直接浏览
打开在线演示；滚轮缩放横轴，Shift + 滚轮缩放纵轴，拖动画布平移，Reset view 恢复。
全部工程
放大查看点击 Anthropic 图例高亮对应模型，其余供应商淡化；深色视图保持点位与标签对应。 
放大查看隐藏文字标签，保留 Anthropic 高亮与 Pareto 线，更清楚地观察点位分布。
模型能力与成本图表 · 在线可用
Intelligence × Cost
把 AI 的能力与费用画在一起，为购买和选择模型提供直观参照。
- 技术方向
- 数据可视化 / 模型比较
- 设计主张
- 用线性距离，直观看清能力与费用。
- 关键能力
- 线性成本轴
- 标签避让
- Pareto 边界
默认深色主题：在线性任务成本轴上比较公开模型能力指数，结合图例与 Pareto 线观察取舍。
看清 AI 能力与费用
为了更好地选择和购买 AI，我把公开能力指数与任务成本放在同一张图里。线性成本轴直观表达价格差距，再通过交互聚焦模型，让能力提升与费用取舍更容易一起理解。
技术构成
- JavaScript / SVG
- 绘制坐标、模型点与交互标签。
- Node.js
- 提取公开数据并统一模型字段。
- GitHub Actions / Pages
- 定时更新 JSON 并部署静态图表。
设计与实现
放大查看让密集数据可比较
- 按需聚焦
横纵轴独立缩放，平移与供应商高亮聚焦局部；标签比较多个候选位置，尽量避开文字和模型点。
- 保留比较依据
Pareto 边界呈现能力与成本取舍；更新器兼容成本字段变化，防止异常空数据覆盖。
更多画面
点击图片，放大查看。
放大查看画面与演示说明
数据来自 Artificial Analysis 的公开页面快照；截图保留采集时的数据状态，最新日期与具体口径以在线页面为准。
快速开始
本地预览
在仓库根目录启动静态服务，浏览器打开 http://localhost:8765。
python -m http.server 8765
