具有重复颜色的 HTML5 图表堆叠条形图

Posted 2023-03-25

【中文标题】具有重复颜色的 HTML5 图表堆叠条形图

【英文标题】：HTML5 chart stacked bars with repeated colors

【发布时间】：2021-01-12 08:03:30

【问题描述】：

我想绘制由少量但数量可变的彩色区域组成的条形图，每个条形图多次出现相同（三种）颜色。我知道stacked bar charts in chart.js，但这对每个条使用相同数量的彩色区域（数据集）。破解它来绘制一堆零长度数据集以获得每个条形图中正确数量的彩色区域感觉是错误的。也就是说，chart.js 中的工具提示等很好，所以如果没有更自然的解决方案，也许零长度数据集是要走的路。有什么想法吗？

【参考方案1】：

所以，我想我会使用d3.js，而不是使用chart.js。使用 d3 绘制单个矩形并不难。

作为参考，每个条目只有一个栏但不难扩展的示例是horizontal barplot shown here。 （在同一个网站上有一个simple intro to d3.js。）