TL;DR：在 /try 中输入提示词 "一个带有 KPI 卡片、三个 Chart.js 图表和真实感模拟数据的 SaaS 数据分析仪表盘"，首个版本约 30 秒即可生成。通过元素级编辑调整布局和指标，满意后即可下载或发布。
用几分钟时间创建一个包含 KPI 卡片、Chart.js 图表和真实感模拟数据的 SaaS 风格仪表盘。
一个专业的数据分析仪表盘，包含：
在浏览器中访问 /try.html。
可以使用如下提示词：
Build a single-file HTML analytics dashboard with: 1) Top row: 4 KPI cards (Revenue, Active Users, Conversion Rate, Churn Rate); 2) Middle: Line chart showing daily revenue over 30 days; 3) Bottom: Two charts side-by-side (pie chart for revenue by region, bar chart for signups vs churn). Use Chart.js for charts. Include mock data. Professional dark theme with accent color. Responsive grid layout.
也可以根据自己的需求定制：
选择你偏好的提供商（Claude 效果最佳，DeepSeek 速度更快），然后点击"发送"。AI 将在预览窗格中生成一个完整的交互式仪表盘。
你将看到图表实时渲染，模拟数据已经自动填充。
生成的仪表盘包含：
所有内容都生成为单个 HTML 文件，内嵌 CSS 和 JavaScript，无需构建步骤，也没有外部依赖。
通过后续提示词进一步完善你的仪表盘：
生成的仪表盘使用模拟/示例数据。如需接入真实数据：
<script> 标签内）const revenue = [1200, 1350, 1100, 1400, ...]
const revenue = await fetch('/api/revenue').then(r => r.json())
点击三点菜单，选择：
之后你可以将 HTML 文件托管在任何地方（你的网站、子页面、嵌入到其他应用中），并可选地接入真实数据。
添加交互性："点击 KPI 卡片时，显示详细数据分解。"
修改时间范围："改为显示最近 7 天，而不是 30 天。"
添加更多指标："添加第四行，展示同期留存率和客户终身价值。"
使用不同图表："用 Apex Charts 替代 Chart.js，以获得更丰富的交互功能。"