我正在使用令人敬畏的插件Chart.js,我正试图在每个百分比内找到显示标签的方式.所以我用Google搜索了,我发现了这个问题:https://github.com/nnnick/Chart.js/pull/35
我做了一个简单的小提琴测试它,但不起作用:http://jsfiddle.net/marianico2/7ktug/1/
这是内容:
HTML
<canvas id="canvas" height="450" width="450"></canvas>
Run Code Online (Sandbox Code Playgroud)
JS
$(document).ready(function () {
var pieData = [{
value: 30,
color: "#F38630",
label: 'HELLO',
labelColor: 'black',
labelFontSize: '16'
}, {
value: 50,
color: "#E0E4CC"
}, {
value: 100,
color: "#69D2E7"
}];
var myPie = new Chart(document.getElementById("canvas").getContext("2d")).Pie(pieData, {
labelAlign: 'center'
});
});
Run Code Online (Sandbox Code Playgroud)
此外,我想知道如何为每个部分显示标签,但在图表之外.由一条线连接.和highcharts.js的图表一样.
顺便说一句,如果你推荐我一个html5图表替代品,包括我上面提到的选项,我会很高兴.我听说过flot插件,但我担心不支持动画......
如果您需要更多信息,请告诉我,我会编辑帖子.
我正在开发一个webapp,最近我用谷歌图表和chart.js交换了谷歌图表,因为它在视觉上更具吸引力.然而,我所承受的一个损失是我不能再在数据点之上获得工具提示.我想知道是否有人知道如何做到这一点,因为我是一个新手javascript.以下是图表和设置的代码:
var data = {
labels : graphData[0],
datasets : [
{
fillColor : "rgba(200,160,100,0.5)",
strokeColor : "rgba(80,240,70,1)",
pointColor : "rgba(80,240,70,1)",
pointStrokeColor : "#fff",
data : graphData[3]
},
{
fillColor : "rgba(220,220,220,0.5)",
strokeColor : "rgba(220,220,220,1)",
pointColor : "rgba(220,220,220,1)",
pointStrokeColor : "#fff",
data : graphData[1]
},
{
fillColor : "rgba(151,187,205,0.5)",
strokeColor : "rgba(151,187,205,1)",
pointColor : "rgba(151,187,205,1)",
pointStrokeColor : "#fff",
data : graphData[2]
}
]
};
var options = {
scaleShowGridLines : true,
scaleShowLabels : true,
animationSteps : 150,
scaleOverride: true,
scaleSteps …Run Code Online (Sandbox Code Playgroud)