Interactive Dashboard Builder 是一个用于构建自包含交互式 HTML/JS 仪表板的技能，主要面向需要快速生成单文件数据看板的场景。它提供了一套可复用的模式与代码片段，帮助开发者或数据分析人员用 Chart.js 搭建带筛选、交互和专业样式的仪表板。
用途 该技能用于创建自包含的 HTML 仪表板，即所有 HTML、CSS、JavaScript 和数据都嵌入在单个文件中，无需额外构建步骤或后端服务。它适合需要快速展示数据、支持用户交互筛选、并保持专业视觉风格的场景。
主要能力
- 基础模板：提供完整的 HTML 结构，包括头部、筛选区、KPI 行、图表行、表格区和页脚，并引入 Chart.js 4.5.1 与 chartjs-adapter-date-fns 3.0.0。
- KPI 卡片：支持渲染数值、格式化（货币、百分比、数字）以及计算与上一周期的变化百分比，并显示正负样式。
- 图表类型：提供折线图、柱状图（支持水平方向）和环形图的创建函数，包含响应式配置、图例、工具提示和坐标轴格式化。
- 筛选与交互：支持下拉筛选器、日期范围筛选，以及组合筛选逻辑；筛选变化后自动更新 KPI、图表和表格。
- 可排序表格：提供表格渲染函数，支持点击表头进行升序/降序排序。
- 样式系统：提供 CSS 变量定义的颜色系统、布局、KPI 卡片、图表容器和筛选器样式，确保仪表板外观专业统一。
使用方式 该技能以代码模式和模板的形式提供。使用者可以复制基础模板，将数据嵌入到 DATA 数组中，然后根据需求调用 createLineChart、createBarChart、createDoughnutChart 等函数创建图表，使用 populateFilter 和 getFilterValue 实现筛选，使用 renderTable 渲染可排序表格。所有逻辑封装在 Dashboard 类中，通过实例化并调用 applyFilters 等方法实现交互。
适用场景
- 需要快速生成单文件数据看板的内部工具或演示。
- 数据分析结果的可视化展示，支持用户按地区、类别、日期等维度筛选。
- 需要 KPI 指标、趋势图、分布图和明细表格组合的仪表板。
- 希望避免复杂前端框架、直接使用原生 HTML/JS 和 Chart.js 的项目。
限制
- 该技能依赖 Chart.js 和 chartjs-adapter-date-fns 的 CDN 链接，需要网络访问。
- 数据需要嵌入在 HTML 中，不适合处理超大规模数据集或需要实时后端更新的场景。
- 未提供关于收费、价格、平台支持或具体性能指标的说明。
- 未提供安装命令或包管理方式，使用方式以代码模板和函数调用为主。