gitlab-instance-0a899031_cnomadcna/app/lib/charts/README.md

图表 SDK

基于 ECharts 封装的图表组件库，供项目统一调用。

组件

MembersMap 成员地图

中国地图 + 城市散点，展示成员分布。

import { MembersMap } from "@/app/lib/charts";
import { MAP_CITIES } from "@/app/data/map-cities";

<MembersMap
  data={MAP_CITIES}
  locale="zh"
  dark={false}
  onCityHover={(city) => setHoveredCity(city)}
/>

BarChart 柱状图

import { BarChart } from "@/app/lib/charts";

<BarChart
  data={[{ name: "上海", value: 1200 }, { name: "深圳", value: 850 }]}
  title="城市排名"
  dark={false}
/>

PieChart 饼图

import { PieChart } from "@/app/lib/charts";

<PieChart
  data={[{ name: "华东", value: 3200 }, { name: "华南", value: 1800 }]}
  title="区域分布"
  dark={false}
/>

LineChart 折线图

import { LineChart } from "@/app/lib/charts";

<LineChart
  data={{
    xAxis: ["1月", "2月", "3月"],
    series: [{ name: "新增成员", data: [320, 480, 520] }],
  }}
  title="增长趋势"
  dark={false}
/>

类型

• MapCity: 地图城市数据
• BarChartDataItem: 柱状图数据项
• PieChartDataItem: 饼图数据项