网页图表看板生成器

你是一个资深前端数据可视化工程师，擅长用纯 HTML+CSS+JavaScript 生成可上传部署的数据仪表盘网页。 请帮我写一个销售数据可视化网页，需求如下： 【使用场景】 - 我会把这个 HTML 文件上传到网站或内网服务器 - 用户打开网页后上传 Excel 文件，网页在浏览器本地读取并展示图表 - 数据不上传服务器，所有处理都在浏览器本地完成 【输入数据】 - 1 个 Excel 文件，包含季度销售数据 - 示例列名：月份、区域、产品类别、销售额、销量、毛利润、目标销售额 【字段识别硬约束】 - 必须兼容以下字段名，不要只识别英文或固定写死一个名字： * 日期字段：月份、销售日期、日期、时间 * 区域字段：区域、地区、城市、门店 * 分类字段：产品类别、品类、产品、产品名称 * 销售额字段：销售额、销售金额、金额、收入 * 销量字段：销量、销售量、销售数量、数量、件数 * 毛利润字段：毛利润、利润、毛利 * 目标字段：目标销售额、销售目标、目标额 - 我们的样本数据列名是：月份、区域、产品类别、销售额、销量、毛利润、目标销售额。生成代码必须能直接读取这组列名。 - 读取 Excel 后先对表头做 trim 清洗，避免空格导致匹配失败。 - 字段匹配要用别名数组查找，例如 qtyField 可以匹配"销量"或"销售量"，不能只写 row['销售量']。 - 如果找不到"销量"字段，可以把销量 KPI 显示为"未识别"，但不能因为缺少"销售量"就阻止整页渲染。 - 只要识别到"月份"和"销售额"，至少要能生成销售趋势折线图。 【页面功能】 1. 页面顶部提供 Excel 上传区域 2. 上传后自动识别字段，并生成可视化仪表盘 3. 展示核心 KPI 卡片： - 总销售额 - 总销量 - 总毛利润 - 整体达成率 4. 展示 4 个图表区域： - 月度销售趋势折线图 - 区域销售额柱状图 - 产品类别销售额占比环形图 - 目标达成率仪表盘或进度图 5. 支持区域和产品类别筛选 6. 支持移动端和大屏展示 【视觉风格】 - 做成高级经营看板风格，不要像普通表格 - 深色背景，清晰的图表颜色，适合投屏演示 - KPI 数字要大，图表要有标题、图例和单位 - 页面要有足够留白，避免信息拥挤 【技术要求】 - 输出一个完整 HTML 文件 - 可以使用 SheetJS 读取 Excel - 可以使用 ECharts 或 Chart.js 绘制图表 - 使用 CDN 引入第三方库 - 不需要后端，不需要数据库 - 代码里写清楚关键注释 - 如果用户上传的数据缺少必要字段，要在页面上给出清晰提示 请直接生成完整的 HTML 代码。

我有一个网页图表看板生成工具，现在想调整功能。 当前功能： - 上传 Excel 文件 - 自动识别数据类型（日期、分类、数值） - 直接在网页里渲染 KPI、折线图、柱状图、环形图和达成率图 - 可以下载生成的 HTML 看板文件 我想改成： 1. 加更多图表类型（面积图、散点图、雷达图等） 2. 根据数据自动推荐最合适的图表类型（比如有日期就推荐折线图） 3. 支持自定义颜色主题（比如用公司品牌色） 4. 支持筛选器联动（区域、产品类别、月份） 5. 支持一键导出当前看板截图 请帮我修改工具代码，保持其他功能不变。