无法将JSON对象呈现给DOJO StoreSeries

时间:2013-06-28 16:39:46

标签: dojo dojox.charting

我正在研究DOJO项目。截至目前,我有一个MySql数据库,一个PHP代码和一个前端的JS脚本。 php代码从数据库读取值,编码它的JSON对象并发送到客户端。 JS脚本应该渲染这个JSON对象并绘制一个LINE图表。

php code -

<?php
$con=mysqli_connect("mysite.com","root","1234","dojo1");
$i=0;
$arr = array();
if (mysqli_connect_errno($con))
{
    echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
else
{
    $result = mysqli_query($con,"SELECT * FROM test");
    while($i<10 && $row = mysqli_fetch_array($result))
    {

        $j=$row['a'];
        $arr[]=array('id'=>$j);
        //$arr[]=$j;
        $i=$i+1;

    }
    header('Content-Type: application/json');
    $temp= json_encode($arr,JSON_FORCE_OBJECT);
    echo $temp;
}
?>

JS代码是 -

    <!DOCTYPE html>
<html >

<head>
</head>
<body class="claro">
<link rel="stylesheet" href="dijit/themes/claro/claro.css">

<script>dojoConfig = {parseOnLoad: true}</script>
<script src='dojo/dojo.js'></script>

<script>
var chart;
var store;

require(["dojo/request/xhr",
    "dojo/json",
    "dojo/store/Memory",
    "dojo/store/Observable",
    "dojox/charting/StoreSeries",
    "dojox/charting/Chart2D", 
    "dojox/charting/plot2d/Lines", 
    "dojox/charting/axis2d/Default",    
    "dojo/domReady!",
    "dojox/charting/StoreSeries"], 

    function(xhr, JSON, Memory, Observable, StoreSeries, Chart, DataSeries) {

    xhr("dojo1.php",{
        handleAs: "json"
    }).then(function(data){ 

        //var data = eval(data1);
        var i=0;
       // for(i=0;i<5;i++)
         //alert(data[i].id);
         console.log(data);
        store = Observable(new Memory({data: data}));

        chart = new Chart("graph");

        chart.addPlot("default", {type: "Lines", markers:true});

        chart.addAxis("x", {title:"Time", titleOrientation:"away"});
        chart.addAxis("y", {vertical: true, majorTick: false, title:"Load"});

        //chart.addSeries("Series X", [1, 2, 2, 3, 4, 5, 5, 7]);

       chart.addSeries("Series Y", new StoreSeries(store, { query: {}}, "id"));
      //  chart.addSeries("Series Z", new DataSeries(store, { query: {} }, "id"));

        chart.render();
    });         
});


</script>
<div id="graph" style="width: 200px; height: 200px; margin: 0px auto 0px auto; "></div>
</body>
</html>

JSON对象看起来像这样 -

[{"id":"20"},{"id":"1"},{"id":"2"},{"id":"3"},{"id":"4"},{"id":"5"},{"id":"1"},{"id":"1"},{"id":"1"},{"id":"1"}]

我经常尝试找到解决方案。我面临的问题是 -  1.如果JS脚本中的值是硬编码的,那么图表就可以了。 (系列X)  2.如果php脚本中的值是硬编码的并且作为JSON对象发送,并且JS脚本读取值,那么图表再次出现就可以了。 (系列Y)。  3.当我从sql数据库中读取数据作为来自php的JSON对象时,会出现问题。 Y系列不起作用,UI只显示2个轴,没有任何绘图。  4.如果我从php文件中的编码部分删除“JSON_FORCE_OBJECT”术语,系列Y中根本不会发生任何事情,即偶数轴不会出现,并且控制台会提供有关“Promises”和“Object Deferred”的大错误列表。 要完成的工作非常简单,即读取JSON对象并将其绘制在LINE图上。但是自从2周以来我一直坚持这个问题。请帮助。

0 个答案:

没有答案