我用chart.js创建了一个折线图。然而,这个图表没有显示出来。下面是我的HTML代码:
<canvas id="myChart" width"600" height:"600"></canvas>
以下是我的 JavaScript 代码。使用这种方法不会出现任何错误,但是没有显示任何内容。
var c = $('#myChart');
var ct = c.get(0).getContext('2d');
var ctx = document.getElementById("myChart").getContext("2d").Line(data);
var data = {
labels: ["January", "February", "March", "April", "May", "June", "July","August", "November", "December"],
datasets: [
{
label: "Sodium intake",
fillColor: "rgba(220,220,220,0.2)",
strokeColor: "rgba(220,220,220,1)",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "#fff",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: [165, 159, 180, 181, 156, 155, 140]
},
{
label: "Sugar intake",
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: [128, 148, 140, 119, 186, 127, 190]
}
]
};
我采用的另一种方法与文档类似。我实例化了一个新图表。但是,这种方法对我的线性图表返回未定义。
var ctx = document.getElementById("myChart").getContext("2d");
var myLineChart = new Chart(ctx).line(data,{
belzierCurve : false
});