Question

我正在使用从FitBit收集的一些JSON数据创建一个JSchart。

这是我的代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.6/Chart.min.js"></script>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<div class="chart-wrap" style="width: 100%; height: 100%;">
    <canvas id="canvas" style="width: 100%; height: auto;"></canvas>
</div>
<div id="js-legend" class="chart-legend"></div>

</body>
</html>

<script>

$.getJSON("fitbitdata.json", function (json) {
  // will generate array with ['Monday', 'Tuesday', 'Wednesday']
  var labels = json.map(function(item) {
    return item.Weight;
  });



});
//there was a comma separating these two var declarations. Changed it to a `;`
var lineChartData = {
    labels : ["January","February","March","April","May","June","July"],
    datasets : [
        {
        label: "Gewicht",
            fillColor : "rgba(141,255,220,0.5)",
            strokeColor : "rgba(220,220,220,1)",
            pointColor : "rgba(220,220,220,1)",
      backgroundColor : "rgba(215, 44, 44, 0.2)",
            pointStrokeColor : "#fff",
            data: []
        },
        {
            label : "BMI",
            fillColor : "rgba(215, 40, 40, 0.9)",
            strokeColor : "rgba(151,187,205,1)",
      backgroundColor : "green",
            pointColor : "rgba(151,187,205,1)",
            pointStrokeColor : "#fff",
            data : []

        }
    ]
};

// I put the canvas element in a var just to clean up the 'new Chart' syntax
var canvas = document.getElementById("canvas").getContext("2d");

//this is the new syntax
var myLine = new Chart(canvas, {
  type: 'line',
  data: lineChartData//,
  //options: options //if you had any to pass
});




</script>

我想做的是：

我有一个json文件包含这样的数据：

[{<br>
   "Datum":"Week 1",
   "Weight":74,
   "BMI":21.39,
   "Fat":0,
   "CaloriesBurned":2.103,
   "Steps":3.53,
<br>
}]

当我做警报（标签）时

显示所有值。为什么不在我的jschart中？

用JSON文件填写JSchart

0 个答案: