格子越深,表示该主题在这项指标上越高。
清晰85
说服60
密度48
制作成本28
作业适配86
工作适配88
低高
简短问答
什么时候选Chart.js 快速图表?
故事符合「内部工具、学生网络项目、轻量级营销页面」时选用。
什么时候避开?
遇到「您只需要地图、桑基或出版级矢量导出」就换形式。
谁发明或推广了它?
Chart.js 成为 MIT 网络默认入门图表
它编码什么?
来自小配置对象的画布绘制标记
广告能用吗?
在微信、抖音与展示广告里主张能一眼看见就可以;否则把图放在落地页。
老师会收吗?
实验报告与展板里有轴、单位、来源一行就可以。
Chart.js 快速图表把值编码为来自小配置对象的画布绘制标记。Chart.js 成为 MIT 网络默认入门图表。
工作报告、广告与作业中适合「内部工具、学生网络项目、轻量级营销页面」。若「您只需要地图、桑基或出版级矢量导出」,换一种形式。
软件
- Chart.js — 简单、记录的图表 - 麻省理工学院许可。 · MIT · github.com/chartjs/Chart.js
- datalabels plugin — 当图例不够时,在条形上添加数字。 · MIT · github.com/chartjs/chartjs-plugin-datalabels
- Awesome Chart.js — 由社区维护的精选插件和适配器。 · MIT · github.com/chartjs/awesome
- ECharts (step up) — 当 Chart.js 感觉太小时,就从这里毕业。 · Apache-2.0 · github.com/apache/echarts
- Line demo SVG — 用于打印和非 JS 阅读器的服务器 SVG 折线图。 · CC0 examples · github.com/Tool-Lifes/viz-atlas
导出
- 导出 1 — SVG
- 导出 2 — PDF
- 导出 3 — 把 EMF/SVG 放进幻灯(不要截图)
- 导出 4 — 网页用 SVG,印刷用 PDF
无障碍
- 无障碍 1 — 不要只靠色相。叠上纹理、标签和位置。
- 无障碍 2 — 正文对比 4.5:1,大标记 3:1。
- 无障碍 3 — 图上写短替代文本。数字也做成 HTML 表。
- 无障碍 4 — 动效只用于强调。尊重 prefers-reduced-motion。
Chart.js 快速图表:守住来自小配置对象的画布绘制标记,「您只需要地图、桑基或出版级矢量导出」时换图。