데이터 라벨링 ChartJS, 중복 제거?

Question

Chartjs에서 중복 데이터 라벨을 제거하는 좋은 방법이 있습니까? 또는 데이터 레이블보다 공간 레이블을 더 잘 배치하여 서로 위에 있지 않도록하는 것이 좋습니다.

Chart.plugins.register({ 
    afterDatasetsDraw: function(chart, easing) { 
    // To only draw at the end of animation, check for easing === 1 
    var ctx = chart.ctx; 

    chart.data.datasets.forEach(function (dataset, i) { 
     var meta = chart.getDatasetMeta(i); 
     if (!meta.hidden) { 
     meta.data.forEach(function(element, index) { 
      // Draw the text in black, with the specified font 
      ctx.fillStyle = 'rgb(255, 255, 255)'; 

      var fontSize = 12; 
      var fontStyle = 'normal'; 
      var fontFamily = 'Arial'; 
      ctx.font = Chart.helpers.fontString(fontSize, fontStyle, fontFamily); 

      // Just naively convert to string for now 
      var dataString = dataset.data[index].toString(); 

      // Make sure alignment settings are correct 
      ctx.textAlign = 'center'; 
      ctx.textBaseline = 'middle'; 
      var bodySpacing = 3; 
      var padding = 10; 
      var position = element.tooltipPosition(); 
      ctx.fillText(dataString, position.x, position.y - (fontSize/2) - padding); 
     }); 
     } 
    }); 
    } 
}); 

데이터가 내 데이터이고, 명확합니다. 코드는 chartjs 샘플 데이터 레이블 페이지에서 가져 와서 기본적으로 붙여 넣습니다.

Answer 1

차트 방문 chart.js 라이브러리의 스타일. 특정 지점의 모든 데이터 목록을 보여줍니다. Here is link