我正在尝试通过Google Chart API创建图表,但无法将php变量放入脚本中:我得到了空白页。
的PHP
$columns = array( array('string' => 'x'), array('number' => 'values'), array('id' => 'i1', 'type' => 'number', 'role' => 'interval'), array('id' => 'i1', 'type' => 'number', 'role' => 'interval'), array('number' => 'OtherValues'), array('id' => 'i1', 'type' => 'number', 'role' => 'interval'), array('id' => 'i1', 'type' => 'number', 'role' => 'interval') ); $test = array( array( 'a' => array(100, 90, 150,15,10,20)), array( 'b' => array(120, 95, 130,20,10,30)), array( 'c' => array(130, 105, 140,30,25,35)), array( 'd' => array( 90, 85, 95,40,35,45)), array( 'e' => array(70, 74, 63,50,45,55)), array( 'f' => array(30, 39, 22,60,55,65)), array( 'g' => array(100, 90, 150,15,10,20)), ); $table['cols'] = $columns; $table['rows'] = $test;
HTML视图
<div id="chart-lines"></div> <script> google.setOnLoadCallback(drawChart); function drawChart() { var data = new google.visualization.DataTable(<?php echo json_encode($table) ?>); // The intervals data as narrow lines (useful for showing raw source // data) var options_lines = { title: 'Line intervals, default', intervals: { 'lineWidth':2, 'barWidth': 0.5 }, legend: 'none', }; var chart_lines = new google.visualization.LineChart(document.getElementById('chart-lines')); chart_lines.draw(data, options_lines); } </script>
使用Google Chrome Javascript控制台,对于每个具有以下详细信息的图形,我都会收到“未捕获的错误:无效的类型:未定义”:
R.Osa R.ug (anonymous function) nj.(anonymous function).d Ep drawchart
对于Visualization API的DataTable构造函数,您的数据结构不正确。
对于列正确的格式是列对象的数组,其中每个对象具有type(强制), ,label,id和p(所有可选)属性。 type是可能的值的字符串string,number,boolean,date,datetime,和timeofday。 label并且id是字符串。 p是列属性的对象。
type
label
id
p
string
number
boolean
date
datetime
timeofday
行的正确格式是行对象的数组,其中每个对象都有c和p属性。 c是单元格对象的数组。 p是行属性的对象。单元格对象具有v,f和p属性,其中v是单元格的值,是单元格f的字符串格式的值,并且p是单元格属性的对象。
c
v
f
所有属性对象支持的属性都取决于您所绘制的图表类型。
使用PHP的json_encode功能,将关联数组转换为对象,将非关联数组转换为数组。表的适当结构应如下所示:
json_encode
$columns = array( array('type' => 'string', 'label' => 'x'), array('type' => 'number', 'label' => 'values'), // each interval should have its own unique id, // but leaving them the same won't break anything for your chart as-is array('type' => 'number', 'id' => 'i1', 'p' => array('role' => 'interval')), array('type' => 'number', 'id' => 'i1', 'p' => array('role' => 'interval')), array('type' => 'number', 'label' => 'OtherValues'), array('type' => 'number', 'id' => 'i1', 'p' => array('role' => 'interval')), array('type' => 'number', 'id' => 'i1', 'p' => array('role' => 'interval')) ); $test = array( array('c' => array( array('v' => 'a'), array('v' => 100), array('v' => 90), array('v' => 150), array('v' => 15), array('v' => 10), array('v' => 20) )), // etc ); $table['cols'] = $columns; $table['rows'] = $test;