javascript - 简单的 HTML 条形图生成

Question

我是一名 C++ Linux 专家，正在尝试使用 html 或 js 制作条形图。 我试着用谷歌搜索如何生成条形图。但无法正确理解。

我有一个包含以下内容的文件 (content.txt):

A - 0
B - 3
C - 1
D - 2
E - 2 
F - 0

所有字母都需要在 Y 轴上表示。 条形颜色基于文件中的值。 (该值始终在 0 到 3 的范围内)

所有四个值都需要用不同的颜色表示。

图形如下所示。 请帮助我阅读 content.txt 文件(它在 0 到 3 内动态更改 A 到 F 的值)并用图表表示。

Answer 1

如上所述，最难的部分是从文件系统中读取数据。如果您可以将数据放入 JSON blob 或对象中，那就容易多了。

您有什么理由希望 HTML 上的条形图完整吗？对于简单的图表，我强烈推荐 ChartJS ( http://www.chartjs.org/docs/#bar-chart ) ...它使用起来非常简单，尤其是当您的数据是 JSON/Obj 格式时。