1

我正在尝试对数据库中的一些数据进行简单的可视化，这些数据是通过 JSON 从一个简单的 Web 服务中获取的。一切都在本地主机上完成。问题似乎是 DataTable 构造函数的 JSON 格式。我已经阅读了文档，并且我认为我已经创建了确切的 json 格式，但是由于某种原因，当我将数据传递给 DataTable 构造函数时，它不会创建数据表，并且图表没有初始化它只是给出了一个错误：表没有列。我从数据库中得到的数据很好。该图表适用于以文字形式给出的示例数据，因此它不适用于 javascript。

这是生成 json 的代码（注意，我也尝试过将 "" 和 '' 以相反的顺序放置，意思是 'cols': [{id: 'ID', type: 'string' }，它也不起作用）：

$niz =  array();
while ($red = $db->getResult()->fetch_object())
{
    $niz[] = $red;
}

$jsonResponse = '{
    "cols": [{id: "ID", type: "string"},
    {id: "Poles", type: "number"},
    {id: "Victories", type: "number"},
    {id: "Team", type: "string"}
    ],
    "rows": [';

    $i = 0;
    foreach ($niz as $line) {
        $i = $i+1;
        $addOn = '{"c":[{"v": "'.$line->name.'"}, {"v": '.$line->poles.'}, {"v": '.$line->victories.'}, {"v": "'.$line->teamName.'"}]}';
        if($i == count($niz))
        {
            $addOn.='] }';

        }
        else
        {
            $addOn.=',';
        }
        $jsonResponse.=$addOn;
    }


    echo json_encode($jsonResponse);





});

这是图表客户端的代码：

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript"  src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {

var jsonData = $.ajax({
url: "http://127.0.0.1/VisualisationWS/poleVictoryRatio.json",
dataType:"json",
async: false
}).responseText;

var data = new google.visualization.DataTable(jsonData);


var options = {
title: 'Correlation between pole positions and wins of drivers, taking in account the  team they are currently in.',
hAxis: {title: 'Poles'},
vAxis: {title: 'Victories'},
bubble: {textStyle: {fontSize: 11}},
};

var chart = new google.visualization.BubbleChart(document.getElementById('chart_div'));
chart.draw(data, options);

}
</script>
</head>
<body>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
4

1 回答 1

1

您的 JSON 无效。JSON 中的对象键必须用双引号引起来，例如：{id: "ID", type: "string"}应该是{"id":"ID","type":"string"}. 通过手动将数据编码为 JSON，您将错过使用该json_encode功能的所有好处（在您当前的设置中它实际上几乎没有任何作用）。如果您在数组中构建数据，json_encode将很乐意为您处理编码数据的繁琐部分：

$myData = array(
    'cols' => array(
        array('id' => 'ID', 'type' => 'string'),
        array('id' => 'Poles', 'type' => 'number'),
        array('id' => 'Victories', 'type' => 'number'),
        array('id' => 'Team', 'type' => 'string')
    ),
    'rows' => array();
);
while ($red = $db->getResult()->fetch_object()) {
    $myData['rows'][] = array('c' => array(
        array('v' => $red->name),
        array('v' => $red->poles),
        array('v' => $red->victories),
        array('v' => $red->teamName)
    ));
}
echo json_encode($myData, JSON_NUMERIC_CHECK);

作为参考，PHP 的关联数组被编码为 javascript 对象，非关联数组被编码为 javascript 数组。 JSON_NUMERIC_CHECK扫描数据中的数字以确保它们被编码为数字而不是字符串（这很有帮助，因为某些数据库会将数字输出为字符串，MySQL 是罪魁祸首）。

于 2014-02-07T17:40:56.860 回答