Question

我是网络开发人员的新手并尝试加载chart.js但是我遇到了一些问题......在阅读完文档之后我认为我有正确的部分可能是错误的顺序？

通过nmp安装chart.js并链接到标题中的脚本，然后添加

<canvas id="myChart" width="400" height="400"></canvas>身体。

之后，您似乎只需要（在正文中的脚本标签中）......

var myPieChart = new Chart(ctx[0]).Pie(data,options);

然后是实际数据......

var data = [
    {
        value: 300,
        color:"#F7464A",
        highlight: "#FF5A5E",
        label: "Red"
    },  etc......

不幸的是，我在页面上看不到任何内容。 chart.js实际上有一些很棒的文档，但我在开始时有点迷失，有什么想法吗？谢谢！

为了清晰起见，jsfiddle添加了！ https://jsfiddle.net/bencasalino/tfsy6gxL/

和我使用的教程http://www.sitepoint.com/creating-beautiful-charts-chart-js/

Answer 1

根据fiddle中提供的comment，而不是您的问题，您遇到了一些问题：

您在小提琴的<script>部分中有HTML JavaScript标记。
您正在使用Chart.js加载<script type="text/javascript" src="chart.js/Chart.js"></script>，其中JSFiddle上没有chart.js/Chart.js（他们的服务器上也不存在myjs.js）。
您的var skillsChart = new Chart(context).Pie(data);数组之前有pieData ，而不是之后。

var skillsChart = new Chart(context).Pie(data);应为var skillsChart = new Chart(context).Pie(pieData);，因为您的数组名为pieData，而不是data。

请参阅此fiddle。

希望这有帮助！：）

Chart.js无法正确显示/安装问题

1 个答案: