Question

我希望能够在chart.js的1个条形图上显示2个不同的json数据。但是，我的javascript文件并没有识别Json中的数组。显示图表的轮廓但标签未定义。

Cendex1.php

// suppress error notices
error_reporting(E_ALL & ~E_NOTICE);




require 'connect.php';




$query="SELECT * FROM employed";
if($result = mysqli_query($db, $query)){


 /* fetch associative array */
    while ($row= mysqli_fetch_array($result)) {
         $dataem[]=array($row[0],$row[1], $row[2]);
    }
    mysqli_free_result($result);
}









$output = json_encode($dataem);
echo $output;


?>

cendex2.php

/* fetch associative array */ while ($row= mysqli_fetch_array($result)) { $dataun[]=array($row[0],$row[1], $row[2]); } mysqli_free_result($result); } $output = json_encode($dataun); echo $output; ？＆GT;

Cendis1.html

<!doctype html>
<html>
<head>
    <title>Employment Rate</title>
</head>
<body>
    <p>Employed</p>
    <canvas id="myChart" width="400" height="400"></canvas>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="js/graph1.js"></script>
    <script src="js/chartjs/Chart.js"></script>

</body>
</head>
</html>

Graph1.js

$（document）.ready（function（）{

  var ageData = new Array();
  var emData = new Array();
  var unData = new Array();

  $.getJSON("cendex1.php", function(data){
      var em = data;
      $.each( em, function( i, val ) {
              ageData.push(val.age);
              emData.push(val.age);
      });
      console.log(emData);
      getun(ageData, emData);
  });

  function getun(){
      $.getJSON("cendex2.php", function(data){
          var un = data;
          $.each( un, function( i, val ) {
              unData.push(val.un);
          });
          console.log(unData);
          createChart();
      });
  }

  function createChart() {

      var data = {
      labels: ageData,
          datasets: [
              {
                  label: "My First dataset",
                  fillColor: "rgba(46, 138, 83, 1)",
                  strokeColor: "rgba(220,220,220,1)",
                  pointColor: "rgba(220,220,220,1)",
                  pointStrokeColor: "#fff",
                  pointHighlightFill: "#fff",
                  pointHighlightStroke: "rgba(220,220,220,1)",
                  data: emData
              },
              {
                  label: "My Second dataset",
                  fillColor: "rgba(151,187,205,0.2)",
                  strokeColor: "rgba(151,187,205,1)",
                  pointColor: "rgba(151,187,205,1)",
                  pointStrokeColor: "#fff",
                  pointHighlightFill: "#fff",
                  pointHighlightStroke: "rgba(151,187,205,1)",
                  data: unData
              }
          ]
      };

      var options = {
          responsive: true,
          maintainAspectRatio: true,
          scaleFontColor: "#000",
          datasetStrokeWidth: 5
      };

      var ctx = $("#myChart").get(0).getContext("2d");
      var myBarChart = new Chart(ctx).Bar(data, options);
  }

});

我无法获得JSON来显示Chart.js上的数据

0 个答案: