agchart/README.md

组团趋势图

这是一个基于 React + AG Charts 的组团趋势图页面，用来查看不同分类维度下的年度统计趋势，并通过右侧筛选条件联动图表结果。

功能

• 左侧展示组团趋势图，支持最低值、最高值、平均值、中位数和数据量切换
• 右侧展示分类树，支持按 自然地理区位 / 设施类别 / 建设阶段 / 规划形式 选择节点
• 筛选条件支持 省市区，后端会根据 uf_xzqy 展开到区级 id 后再过滤
• 支持搜索筛选树节点，支持多条件叠加
• 图表空状态会提示当前是否需要先选择右侧分类项

技术栈

• React 19
• TypeScript
• Vite
• AG Charts Enterprise
• Bun

开发

安装依赖：

bun install

启动开发服务：

bun run dev

构建生产包：

bun run build

本地预览构建结果：

bun run preview

接口说明

前端默认请求后端统计接口，当前代码里的地址在 src/App.tsx 的 API_BASE_URL。

省市区筛选依赖后端接口返回的 uf_xzqy 字典数据，前端会将平铺数据归并为 省 -> 市 -> 区 的展示结构。

目录

• src/App.tsx：主页面逻辑、图表配置、筛选联动
• src/styles.css：页面样式
• dist/：构建产物

备注

• 如果要切换到本地后端，把 src/App.tsx 里的 API_BASE_URL 改成对应地址即可
• AG Charts 的 license key 已写在代码里，和当前页面绑定