2017-09-11 79 views
3

我正在使用Chart.js,這裏是我想要發生的事情。 My Sample Graph如何在此圖表中添加逗號js

我需要在這些值上附上逗號來表示千位。例如:1000

animation: { 
    duration: 500, 
    easing: "easeOutQuart", 
    onComplete: function (label) { 
     var ctx = this.chart.ctx; 
     ctx.font = Chart.helpers.fontString(Chart.defaults.global.defaultFontFamily, 'normal', Chart.defaults.global.defaultFontFamily); 
     ctx.textAlign = 'center'; 
     ctx.textBaseline = 'bottom'; 
     this.data.datasets.filter(dataset => !dataset._meta[Object.keys(dataset._meta)[0]].hidden).forEach(function (dataset) { 
      for (var i = 0; i < dataset.data.length; i++) { 
       var model = dataset._meta[Object.keys(dataset._meta)[0]].data[i]._model,     
        scale_max = dataset._meta[Object.keys(dataset._meta)[0]].data[i]._yScale.maxHeight; 
            ctx.fillStyle = '#000'; 
       var y_pos = model.y - 5; 
       // Make sure data value does not get overflown and hidden 
       // when the bar's value is too close to max value of scale 
       // Note: The y value is reverse, it counts from top down 
       if ((scale_max - model.y)/scale_max >= 0.70) 
        y_pos = model.y + 20; 
       ctx.fillText(dataset.data[i], model.x, y_pos); 

      } 
     }); 

    } 
} 

這是爲了顯示這些值的代碼,我相信一定會重視這些逗號應該是這個塊的代碼裏面的代碼。

我只是從這個論壇去這個代碼。所以我不確定發生了什麼事。 How to display Values above bars

回答

5

使用此功能。

function addCommas(nStr) 
{ 
    nStr += ''; 
    x = nStr.split('.'); 
    x1 = x[0]; 
    x2 = x.length > 1 ? '.' + x[1] : ''; 
    var rgx = /(\d+)(\d{3})/; 
    while (rgx.test(x1)) { 
     x1 = x1.replace(rgx, '$1' + ',' + '$2'); 
    } 
    return x1 + x2; 
} 

在下面的SO答案中找到。

SO Answer

演示:

JSFiddle Demo

6

您可以使用toLocaleString()對於這種類型的問題:

使用這個鏈接toLocateString爲更多