Google Chart - не получается построить график из данных приходящих через json
Строю графики через гугл чарт, при чём когда ему через пхп пихал массив то всё ок, а через json просит упаковать данные в совершенно непонятный формат. Уже 2 суток пробую создавать различные массивы, и двухмерные и с индексами, что только не пробовал... Внятных примеров нигде не нашёл.
Вот инструкция https://developers.google.com/chart/..._example?hl=fr В ней он пишет что данные должны выглядеть как то так: { "cols": [ {"id":"","label":"Topping","pattern":"","type":"string"}, {"id":"","label":"Slices","pattern":"","type":"number"} ], "rows": [ {"c":[{"v":"Mushrooms","f":null},{"v":3,"f":null}]}, {"c":[{"v":"Onions","f":null},{"v":1,"f":null}]}, {"c":[{"v":"Olives","f":null},{"v":1,"f":null}]}, {"c":[{"v":"Zucchini","f":null},{"v":1,"f":null}]}, {"c":[{"v":"Pepperoni","f":null},{"v":2,"f":null}]} ] } причём что за "с" что за "v" и "f" зачем он их так нумерует никак не врубаюсь. Когда я задаю ему вручную график вот так: var data = new google.visualization.DataTable(); data.addColumn('string', 'Дата'); data.addColumn('number', 'Yandex'); data.addColumn('number', 'Google'); data.addColumn('number', 'Mail'); data.addRows([ ['24.05.2014', 3,6,8], ['25.05.2014', 1,2,7], ['25.05.2014', 1,2,7], ]); всё работает круто. Пробовал не через json а через обычный текст пихать ему те же данные, но тоже не прокатывает. В общем, нужен пример как на стороне php упаковать колонки и столбцы, так, чтобы гугл схавал. Так как я перепробовал миллион вариантов, и кучу раз пересохранял и переписывал, всё вернулось к исходному коду, обычному массиву с данными и какой то конкретный пример привести не могу( Я в отчаянии :cray: , помогите пожалуйста разобраться |
Вот сконструировал пример php части
$cols= array('Дата'=>'string', 'Google'=>'number', 'Яндекс'=>'number','Mail'=>'number'); $outRows[0]=array('24.05.2014', 5, 7,9); $outRows[1]=array('25.05.2014', 6, 8,10); $dataTable = json_encode(array( 'cols' => $cols, 'rows' => $outRows ), JSON_NUMERIC_CHECK); echo $dataTable; И вот код js+html части <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type='text/javascript'> google.load('visualization', '1', {'packages':['corechart']}); google.setOnLoadCallback(drawChart); function drawChart() { var json = $.ajax({ url: 'test.php', dataType: 'json', async: false, }).responseText; var data = new google.visualization.DataTable(json); var options = { title: '', is3D: 'true', width: 800, height: 600 }; var chart = new google.visualization.LineChart(document.getElementById('chart_div')); chart.draw(data, options); } </script> <div id="chart_div" style="width: 1280px; height: 500px;"></div> Выдаёт ошибку "Table has no columns." Делал по примеру http://www.daniweb.com/web-developme...-chart-problem |
Вот тут описан формат данных для конструктора:
https://developers.google.com/chart/...ence#dataparam |
Цитата:
{ cols: [{id: 'A', label: 'NEW A', type: 'string'}, {id: 'B', label: 'B-label', type: 'number'}, {id: 'C', label: 'C-label', type: 'date'} ], rows: [{c:[{v: 'a'}, {v: 1.0, f: 'One'}, {v: new Date(2008, 1, 28, 0, 31, 26), f: '2/28/08 12:31 AM'}]}, {c:[{v: 'b'}, {v: 2.0, f: 'Two'}, {v: new Date(2008, 2, 30, 0, 31, 26), f: '3/30/08 12:31 AM'}]}, {c:[{v: 'c'}, {v: 3.0, f: 'Three'}, {v: new Date(2008, 3, 30, 0, 31, 26), f: '4/30/08 12:31 AM'}]} ], p: {foo: 'hello', bar: 'world!'} } Вот у меня есть такие данные для построения line chart. Rows ['24.05.2014', 3,6,8], ['25.05.2014', 1,2,7], ['25.05.2014', 1,2,7], Cols ('string', 'Дата'); ('number', 'Yandex'); ('number', 'Google'); ('number', 'Mail'); Как они будут выглядеть в этой невероятной конструкции приведённой выше? |
Цитата:
Цитата:
{ 'cols': [ {'label':'Дата', 'type':'string'}, {'label':'Yandex', 'type':'number'}, {'label':'Google', 'type':'number'}, {'label':'Mail', 'type':'number'} ], 'rows': [ {'c':[{'v':'24.05.2014'},{'v':3},{'v':6},{'v':8}]}, {'c':[{'v':'25.05.2014'},{'v':1},{'v':2},{'v':7}]}, {'c':[{'v':'25.05.2014'},{'v':1},{'v':2},{'v':7}]} ] } |
С колонками получилось! ))
А вот со строками не очень понятно, как создать такой массив. Делаю так $outRows[0]=array('c'=>array('24.05.2014',5,8,5)); $outRows[1]=array('c'=>array('25.05.2014',2,4,4)); Получается вот так "rows":[{"c":["24.05.2014",5,8,5]},{"c":["25.05.2014",2,4,4]}]} Добиться такого варианта как в вашем примере никак не получается.. |
Цитата:
$outRows[0]=array('c'=>array(array('v'=>'24.05.2014'), array('v'=>5), array('v'=>8), array('v'=>5))); |
О, да!!!! ЕЕЕЕЕЕ.
Спасибо добрый человек, левел твоей кармы стремительно вырос вверх!!! я счастлив :dance: |
Часовой пояс GMT +3, время: 01:48. |