Question

如何在flot.pie.js上自定义图例？

我有以下代码：

var options = { 
            series: { 
                pie: {
                    show: true
                },
                legend: {
                    show: true,
                    label: {
                        show: true,
                        formatter: function(label, series){
                            return '<div style="font-size:8pt;text-align:center;padding:2px;">' + label + ' ' + Math.round(series.percent)+'%</div>';
                        }
                    }
                }
            }
        };

那不行，我想我正在组成传奇部分...我想要的是展示传奇的价值观。我怎么能这样做？

Answer 1

只需将数据值添加到系列标签中即可。您没有显示您的数据，因此请想象您的数据如下所示：

var data = [
    {
    label: "Good",
    data: 10},
{
    label: "Bad",
    data: 30 },
{
    label: "Ugly",
    data: 90},
];

然后您可以使用此代码将数据值附加到每个标签：

for (var i=0;i<data.length;i++){
    data[i].label+=' ('+data[i].data+')'
}

以下是它的外观：http://jsfiddle.net/ryleyb/p8fzS/

Answer 2

这对我有用：

function legendFormatter(label, series) {
    return '<div ' + 
           'style="font-size:8pt;text-align:center;padding:2px;">' +
           label + ' ' + Math.round(series.percent)+'%</div>';
};

var options = { 
    series: { 
        pie: {
            show: true
        },
    },
    legend: {
        show: true,
        labelFormatter: legendFormatter
    }
};

工作示例链接：http://jsfiddle.net/Rnusy/322/

flot.js：自定义图例

2 个答案: