在 Stack Flot 图表中显示百分比和数字答案

【问题标题】：show percentages and Numbers both in a Stack Flot Chart在 Stack Flot 图表中显示百分比和数字
【发布时间】：2015-04-01 02:37:30
【问题描述】：

我尝试创建一个条形图，每个条形数字上都有百分比数字。以下是我的代码，我希望将百分比显示在条形数字中，以及工具提示中每个项目的计数（反之亦然）。我已经尝试过 stackedpercent，但没有成功。

例如，这些是我的数据百分比值：

        var dc20 = [[37, 0], [0, 1], [16, 2], [34, 3]];      
        var dc21 = [[58, 0], [0, 1], [80, 2], [62, 3]];     
        var dc22 = [[0, 0], [0, 1], [0, 2], [0, 3]];    
        var dc23 = [[5, 0], [100, 1], [4, 2], [4, 3]];     
        var dc24 = [[0, 0], [0, 1], [0, 2], [0, 3]];

这些值用于记录计数

        var dc20 = [[16, 0], [0, 1], [5, 2], [11, 3]];        
        var dc21 = [[25, 0], [0, 1], [25, 2], [20, 3]];       
        var dc22 = [[0, 0], [0, 1], [0, 2], [0, 3]];        
        var dc23 = [[2, 0], [1, 1], [1, 2], [1, 3]];       
        var dc24 = [[0, 0], [0, 1], [0, 2], [0, 3]];

更新这是Fiddle 链接。

【问题讨论】：

请创建fiddle 或代码sn-p。
@Raidri 谢谢。我已经解决了重复的条码，但更新了我的问题，还添加了一个小提琴。你能看一下吗？

标签： charts numbers bar-chart flot percentage

【解决方案1】：

最简单的解决方案是将计数添加为单独的数组：

var counts = [
    [16, 0, 5, 11],
    [25, 0, 25, 20],
    [0, 0, 0, 0],
    [2, 1, 1, 1],
    [0, 0, 0, 0]
];

并在 tooltipOpts: 中使用它：

    content: function (label, xval, yval, flotItem) {
        return '%' + xval + 'which has ' + counts[flotItem.seriesIndex][flotItem.dataIndex] + ' records ';
    },

请参阅updated fiddle。

【讨论】：