2015-04-01 148 views
1

我嘗試在每個小號數字上創建一個包含百分比數字的條形圖。 以下是我的代碼,我希望百分比顯示在條形編號中,也是工具提示中每個條目的計數(反之亦然)。 我試過stackedpercent但它沒有奏效。在Stack Flot圖表中顯示百分比和數字

例如,這些是我的百分比值數據:

 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鏈接進行。

+0

請創建一個[fiddle](http://jsfiddle.net)或代碼片段。 – Raidri 2015-04-01 09:05:40

+0

@Raidri謝謝。我已經解決了重複的酒吧號碼,但更新了我的問題,也添加了小提琴。你可以看看嗎? – 2015-04-02 00:10:00

回答

0

最簡單的解決方案是將計數添加作爲一個單獨的陣列:

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