我正在使用jqplot进行甜甜圈图显示,但是我遇到了一个不寻常的问题。
浏览器中缺少数据集。
应该读的行:
var s1 = [['a',6], ['b',8], ['c',14], ['d',20]];
var s2 = [['a', 8], ['b', 12], ['c', 6], ['d', 9]];
var plot3 = $.jqplot('chart3', [s1, s2], {
seriesDefaults: {
// make this a donut chart.
renderer:$.jqplot.DonutRenderer,
rendererOptions:{
// Donut's can be cut into slices like pies.
sliceMargin: 3,
// Pies and donuts can start at any arbitrary angle.
startAngle: -90,
showDataLabels: true,
// By default, data labels show the percentage of the donut/pie.
// You can show the data 'value' or data 'label' instead.
dataLabels: 'value'
}
}
});
浏览器中缺少数据,因此只显示:
var s1 = ;
var s2 = ;
这给我留下了空白页面,因为没有数据可以形成图表。 问题似乎是双括号。如果我删除了数据的容器括号,那么浏览器会看到它,但是代码无法正常工作,因为它无法理解。
var s1 = ['a',6], ['b',8], ['c',14], ['d',20];
var s2 = ['a', 8], ['b', 12], ['c', 6], ['d', 9];
在浏览器甚至看不到我编码的内容之前,我没有遇到类似的问题。我无法看到我做的与网络上的任何其他示例有什么不同。
这是我正在使用的完整代码;
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<link rel="stylesheet" href="assets/js/jquery.jqplot.css">
</head>
<body style="background-color: #000;">
<div id="chart3" style="height:300px; width:500px;"></div>
<script type="text/javascript">
var s1 = [['a',6], ['b',8], ['c',14], ['d',20]];
var s2 = [['a', 8], ['b', 12], ['c', 6], ['d', 9]];
var plot3 = $.jqplot('chart', [s1], {
seriesDefaults: {
// make this a donut chart.
renderer:$.jqplot.DonutRenderer,
rendererOptions:{
// Donut's can be cut into slices like pies.
sliceMargin: 3,
// Pies and donuts can start at any arbitrary angle.
startAngle: -90,
showDataLabels: true,
// By default, data labels show the percentage of the donut/pie.
// You can show the data 'value' or data 'label' instead.
dataLabels: 'value'
}
}
});
</script>
<script language="javascript" type="text/javascript" src="assets/js/jquery.jqplot.min.js"></script>
<script language="javascript" type="text/javascript" src="assets/js/jqplot.pieRenderer.js"></script>
<script language="javascript" type="text/javascript" src="assets/js/jqplot.donutRenderer.js"></script>
</body>
正如你所看到的,这里没有太多错误。在某些情况下,我尝试过不同版本的jquery。我已经尝试将脚本放在页面上的不同位置但没有帮助。
这是我用作基础的类似工作示例的链接,我无法理解为什么我的工作不正常。
http://jsfiddle.net/devmgs/1xcn4bf5/1/
非常感谢您的帮助
理查德
答案 0 :(得分:0)
好的,看起来所需要的只是在外部括号和内部内容之间放置一个空格。然后显示数据。
还有另一个错误,但将脚本链接从页面底部移动到标题也解决了。现在应该可以正常工作。