一尘不染

Google Chart From Php变量

json

我正在尝试通过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

阅读 261

收藏
2020-07-27

共1个答案

一尘不染

对于Visualization API的DataTable构造函数,您的数据结构不正确。

对于列正确的格式是列对象的数组,其中每个对象具有type(强制), ,labelidp(所有可选)属性。
type是可能的值的字符串stringnumberbooleandatedatetime,和timeofday
label并且id是字符串。 p是列属性的对象。

行的正确格式是行对象的数组,其中每个对象都有cp属性。 c是单元格对象的数组。
p是行属性的对象。单元格对象具有vfp属性,其中v是单元格的值,是单元格f的字符串格式的值,并且p是单元格属性的对象。

所有属性对象支持的属性都取决于您所绘制的图表类型。

使用PHP的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;
2020-07-27