ChartJS 3.8.0堆积条形图组合标签

ygya80vv 于 2022-11-07 发布在 Chart.js

关注(0)|答案(1)|浏览(191)

在chart.js 3.8.0中，是否可以合并堆叠条形图上的标签？我找到的最接近的解决方案是为工具提示页脚回调添加，并在工具提示中手动添加额外的文本，但它不包括与该数据集关联的图例/颜色图标。
示例HTML：

<html>
<head></head>
<body>
<h1>
Stacked Bar Chart (chart.js)
</h1>
  <canvas id="chart_display"></canvas>
</body>
</html>

示例Javascript：

const data = {
    labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May'],
  datasets: [
    {
    label: 'Retained',
    data: [62,68,74,80,66,84],
    backgroundColor: 'rgb(0, 178, 169)',
    order: 3,
    stack: 'stack1'
    },
    {
      label: 'Expired',
      data: [5,3,7,9,2,4],
      backgroundColor: 'rgb(207, 16, 45)',
      order: 3,
      stack: 'stack1'
    }
  ]
}
const config = {
    type: 'bar',
  data: data,
  options: {
    scales: {
        x: {
        stacked: true
      },
      y: {
        stacked: true
      }
    }
  },
};
const reportOutput = new Chart(
    document.getElementById('chart_display'),
  config
);