1

我正在做一个 DOJO 项目。到目前为止,我有一个 MySql 数据库、一个 php 代码和一个用于前端的 JS 脚本。php 代码从数据库中读取值,对相同的 JSON 对象进行编码并发送到客户端。JS 脚本应该渲染这个 JSON 对象并绘制一个 LINE 图表。

php代码——

<?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数据库读取的数据作为json对象从php发送时出现问题。Y 系列不起作用,UI 仅显示 2 个轴,没有任何绘图。4. 如果我从 php 文件的编码部分中删除“JSON_FORCE_OBJECT”术语,则 Y 系列中什么都没有发生,即甚至没有轴出现,并且控制台给出了关于“Promises”和“Object Deferred”的大量错误列表. 要完成的工作非常琐碎,即。e 读取 JSON 对象并将其绘制在 LINE 图上。但自从 2 周以来,我一直被困在这个问题上。请帮助。

4

0 回答 0