我无法弄清楚如何使flot.pie将标签中显示的数据从“原始数据”的百分比更改为实际数据。在我的例子中，我创建了一个带有读/未读消息数的饼图。
读取消息数：50。
未读消息数：150。
创建的饼图显示读取邮件的百分比为25％。在这个地方我想显示实际的50条消息。见下图：
我用来创建饼图的代码：
var data = [
{ label: "Read",data: 50,color: '#614E43' },{ label: "Unread",data: 150,color: '#F5912D' }
];
和：
$(function () {
$.plot($("#placeholder"),data,{
series: {
pie: {
show: true,radius: 1,label: {
show: true,radius: 2 / 3,formatter: function (label,series) {
return '<div style="font-size:8pt;text-align:center;padding:2px;color:white;">' + label + '<br/>' + Math.round(series.percent) + '%</div>';
},threshold: 0.1
}
}
},legend: {
show: false
}
});
});
这可能吗？
有了@Ryley的答案，我来到了一个肮脏的解决方案。当我输出series.data时，返回值“1,150”和“1,50”。我想出了减去返回值的前2个字符并显示减法值的想法。
String(str).substring(2,str.lenght)
这是我用此解决方案创建的饼图：
这不是最好的解决方案，但它适用于我。如果有人知道更好的解决方案….
解决方法
我找到了这个问题的答案。数据对象是一个多维数组。要获取acual数据使用以下代码：
$(function () {
$.plot($("#placeholder"),{
series: {
pie: {
show: true,label: {
show: true,series) {
return '<div style="font-size:8pt;text-align:center;padding:2px;color:white;">' + label + '<br/>' + series.data[0][1] + '</div>';
},threshold: 0.1
}
}
},legend: {
show: false
}
});
});
请注意代码“series.data [0] [1]”来提取数据。