2016-03-21 16 views
1

Ben Analytics API tarafından döndürülen datatable bir Area chart doldurma ediyorum içinde Datatable ait etiketleri değiştirin, ama Sütun etiketleri ölçütlerinin adıyla doldurulur.bir grafik

amacı daha kolay daha sonra etiketin değerini değiştirmek için bir yol arıyoruz, okumak için yapmaktır, ben ticks bulundu, ancak hiçbir etkisi:

'ticks' => [ ['v' => 'ga:goalsCompletionsAll', 'f' => 'Objetivos completados'] ], 

google.load('visualization', '1.0', { 
 
    'packages': ['corechart'] 
 
}); 
 
google.setOnLoadCallback(drawChart_conversion); 
 

 
function drawChart_conversion() { 
 
    var data = new google.visualization.DataTable("{\"cols\":[{\"id\":\"ga:date\",\"label\":\"ga:date\",\"type\":\"date\"},{\"id\":\"ga:sessions\",\"label\":\"ga:sessions\",\"type\":\"number\"},{\"id\":\"ga:pageviews\",\"label\":\"ga:pageviews\",\"type\":\"number\"},{\"id\":\"ga:goalCompletionsAll\",\"label\":\"ga:goalCompletionsAll\",\"type\":\"number\"}],\"rows\":[{\"c\":[{\"v\":\"Date(2016, 02, 21)\"},{\"v\":\"20912\"},{\"v\":\"60184\"},{\"v\":\"6386\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 20)\"},{\"v\":\"27073\"},{\"v\":\"70853\"},{\"v\":\"7425\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 19)\"},{\"v\":\"27603\"},{\"v\":\"79345\"},{\"v\":\"8738\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 18)\"},{\"v\":\"27830\"},{\"v\":\"84522\"},{\"v\":\"9350\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 17)\"},{\"v\":\"29514\"},{\"v\":\"77769\"},{\"v\":\"7936\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 16)\"},{\"v\":\"30244\"},{\"v\":\"82223\"},{\"v\":\"8605\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 15)\"},{\"v\":\"33329\"},{\"v\":\"89677\"},{\"v\":\"9227\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 14)\"},{\"v\":\"35109\"},{\"v\":\"97420\"},{\"v\":\"10222\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 13)\"},{\"v\":\"28073\"},{\"v\":\"65107\"},{\"v\":\"5984\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 12)\"},{\"v\":\"29413\"},{\"v\":\"69381\"},{\"v\":\"6604\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 11)\"},{\"v\":\"36198\"},{\"v\":\"95145\"},{\"v\":\"9865\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 10)\"},{\"v\":\"40324\"},{\"v\":\"101335\"},{\"v\":\"10038\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 09)\"},{\"v\":\"42686\"},{\"v\":\"92811\"},{\"v\":\"8538\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 08)\"},{\"v\":\"28007\"},{\"v\":\"81052\"},{\"v\":\"8973\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 07)\"},{\"v\":\"28904\"},{\"v\":\"80751\"},{\"v\":\"8635\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 06)\"},{\"v\":\"23209\"},{\"v\":\"65989\"},{\"v\":\"7249\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 05)\"},{\"v\":\"22088\"},{\"v\":\"59370\"},{\"v\":\"6216\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 04)\"},{\"v\":\"29197\"},{\"v\":\"85678\"},{\"v\":\"9060\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 03)\"},{\"v\":\"30952\"},{\"v\":\"95124\"},{\"v\":\"10687\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 02)\"},{\"v\":\"33903\"},{\"v\":\"101749\"},{\"v\":\"11771\"}]},{\"c\":[{\"v\":\"Date(2016, 02, 01)\"},{\"v\":\"30964\"},{\"v\":\"83933\"},{\"v\":\"8927\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 29)\"},{\"v\":\"28980\"},{\"v\":\"85747\"},{\"v\":\"9282\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 28)\"},{\"v\":\"22790\"},{\"v\":\"61742\"},{\"v\":\"6594\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 27)\"},{\"v\":\"21750\"},{\"v\":\"58801\"},{\"v\":\"6404\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 26)\"},{\"v\":\"13476\"},{\"v\":\"39905\"},{\"v\":\"4441\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 25)\"},{\"v\":\"21799\"},{\"v\":\"58781\"},{\"v\":\"6350\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 24)\"},{\"v\":\"32734\"},{\"v\":\"91558\"},{\"v\":\"9594\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 23)\"},{\"v\":\"32281\"},{\"v\":\"96403\"},{\"v\":\"10349\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 22)\"},{\"v\":\"37484\"},{\"v\":\"105435\"},{\"v\":\"11150\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 21)\"},{\"v\":\"29868\"},{\"v\":\"81317\"},{\"v\":\"8537\"}]},{\"c\":[{\"v\":\"Date(2016, 01, 20)\"},{\"v\":\"28819\"},{\"v\":\"81865\"},{\"v\":\"8759\"}]}]}"); 
 
    var chart_div = document.getElementById('googlechart_conversion'); 
 
    var options = { 
 
    "hAxis": { 
 
     "titleTextStyle": { 
 
     "color": "#333" 
 
     }, 
 
     "gridlines": { 
 
     "color": "transparent" 
 
     } 
 
    }, 
 
    "vAxis": { 
 
     "ticks": [{ 
 
     "v": "ga:pageviews", 
 
     "f": "teste" 
 
     }], 
 
     "minValue": 0 
 
    }, 
 
    "pointsVisible": true, 
 
    "  pointSize": 5, 
 
    "width": "100%", 
 
    "height": "200", 
 
    "chartArea": { 
 
     "width": "100%", 
 
     "height": "80%" 
 
    } 
 
    }; 
 
    var chart = new google.visualization.AreaChart(chart_div); 
 
    chart.draw(data, options); 
 
}
<script src="https://www.google.com/jsapi"></script> 
 
<div id="googlechart_conversion"></div>

cevap

2

Tüm genel boyutların ve metriklerin bir listesini almak ve daha sonra API yanıtınızı atlayıp takas etmek için Metadata API'u kullanabilirsiniz.

<google-analytics-chart> polimer öğesi tam olarak bunu yapar, böylece nasıl çalıştığına dair bir fikir edinmek için the implementation'a bakabilirsiniz.

Bunu sizin için daha kolay hale getirmek amacıyla, Meta Veri API'sını sorgulamak için bazı güzel kolaylık yöntemleri ekleyen Google Analytics javascript-api-utils modülünü kullanabilirsiniz (örn. Sonuçları önbelleğe alma, boyutlarım/metrikleri/genel/özel, vb. Filtreleme) .).

+0

İlk ipucu daha kolay çözüldü –