Chart.js第2686行错误 [英] Chart.js line 2686 Error
问题描述
我想在我的sinatra应用程序中使用Chart.js的lineChart。但是firefox控制台说
I want lineChart of Chart.js in my sinatra application. But firefox console says
`TypeError:this.scale is undefined(Chart.js:2686)`
，并且不显示lineChart。我编写了以下代码。
and, lineChart is not displayed.I wrote following code.
@ hello.erb
@hello.erb
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<script src="Chartjs/Chart.js" type="text/javascript"></script>
<script src="script.js" type="text/javascript"></script>
</head>
<body>
<canvas id="line" height="450" width="600"></canvas>
</body>
</html>
@ script.js
@script.js
$(function(){
var lineChartData = {
labels : ["hoge","fuga"],
datasets : [
{
fillColor : "rgba(220,220,220,0.5)",
strokeColor : "rgba(220,220,220,1)",
pointColor : "rgba(220,220,220,1)",
pointStrokeColor : "#fff",
data : [60,70]
} ]
}
var myLine = new Chart(document.getElementById("line").getContext("2d")).Line(lineChartData);
});
当我在NOT sinatra（erb）中编写此代码时，它可以正常工作。我应该怎么做？
When I write this code in NOT sinatra(erb), it works correctly. What should I do modify?
推荐答案
您的问题看起来像是时间问题。由于脚本运行时画布元素不存在。
Your Problem looks like a timing problem. Since your canvas element is not present when your script runs.
使用Jquery，您可以将图表语句包装在文档中。就绪
With Jquery you can just wrap your chart statement in a document.ready
$( document ).ready(function() {
var myLine = new Chart(document.getElementById("line").getContext("2d")).Line(lineChartData);
}
对于非Jquery解决方案，我建议 https://stackoverflow.com/a/9899701/1279355
For a non Jquery solution I recommend https://stackoverflow.com/a/9899701/1279355
这篇关于Chart.js第2686行错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
