问题描述
Chart.js 有错误吗?每次我将 Chart.js 中的任何图表添加到我的网站时都会出现错误，但是当我将该图表用作独立程序时，它可以顺利运行而没有错误.我正在使用 HTML5.
Is there a bug with Chart.js? Every time I add any of the graphs at Chart.js to my website I get an error, but when I used the graph as stand-alone program it runs smoothly without errors. I am using HTML5.
<html>
<head>
<meta charset="utf-8" />
<title>Rice Consumption</title>
<script src='Chart.min.js'></script>
</head>
<body>
<canvas id="rice" width="600" height="400"></canvas>
<script>
var riceData = {
labels : ["January","February","March","April","May","June"],
datasets :
[
{
fillColor : "rgba(172,194,132,0.4)",
strokeColor : "#ACC26D",
pointColor : "#fff",
pointStrokeColor : "#9DB86D",
data : [203000,15600,99000,25100,30500,24700]
}
]
}
var rice = document.getElementById('rice').getContext('2d');
new Chart(rice).Line(riceData);
</script>
</body>
</html>
已解决:我只是将脚本与画布元素分离(为脚本创建了另一个文件以执行其功能).
SOLVED: I just decoupled the script from the canvas element (made another file for the script to execute its function).
更新的 HTML:
<html>
<head>
<meta charset="utf-8" />
<title>Rice Consumption</title>
<script src='Chart.min.js'></script>
</head>
<body>
<canvas id="rice" width="600" height="400"></canvas>
<script src='Chart.min.js'></script>
<script src='rice.js'></script>
</body>
</html>
新的 JavaScript 文件:
New JavaScript file:
var riceData = {
labels : ["January","February","March","April","May","June"],
datasets : [
{
fillColor : "rgba(172,194,132,0.4)",
strokeColor : "#ACC26D",
pointColor : "#fff",
pointStrokeColor : "#9DB86D",
data : [203000,15600,99000,25100,30500,24700]
}
]
}
var rice = document.getElementById('rice').getContext('2d');
new Chart(rice).Line(riceData);
推荐答案
这是你的代码的工作 jsfiddle:new Chart(rice).Line(riceData);
http://jsfiddle.net/mahmalsami/jqcthmyo/
所以问题肯定来自您的外部 Chart.min.js 包含
你可能会在你的 js get 上找到一个 404.请确保您链接到正确的 js 文件夹.(尝试访问您的 localhost/Chart.min.js 以查看您是否可以访问您的文件)
here is a working jsfiddle of your code:
new Chart(rice).Line(riceData);
http://jsfiddle.net/mahmalsami/jqcthmyo/
So the problem is definitively coming from your external Chart.min.js inclusion
You may find a 404 on your js get. Please make sure you're linking to the correct js folder. (try accessing your localhost/Chart.min.js to see if you can access to your file)
这篇关于ReferenceError:图表未定义 - chartjs的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！