2017-09-11 45 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为更多