Loading dashboard...

组合图 / Combo Chart

将柱状与折线组合在同一图表中，突出趋势与对比关系。

柱状 + 折线

对比收入与订单走势。

示例代码

const series = [
  { dataKey: "revenue", label: "收入", color: "oklch(0.646 0.222 41.116)", type: "bar" },
  { dataKey: "orders", label: "订单", color: "oklch(0.6 0.118 184.704)", type: "line" },
]

<ComboChart data={revenueData} series={series} />

双折线组合

展示访问与注册趋势。

示例代码

const series = [
  { dataKey: "visits", label: "访问量", color: "oklch(0.55 0.15 270)", type: "line" },
  { dataKey: "signups", label: "注册", color: "oklch(0.55 0.15 330)", type: "line" },
]

<ComboChart data={trafficData} series={series} />

双柱状对比

对比成本与利润结构。

示例代码

const series = [
  { dataKey: "cost", label: "成本", color: "oklch(0.6 0.118 184.704)", type: "bar" },
  { dataKey: "profit", label: "利润", color: "oklch(0.55 0.15 330)", type: "bar" },
]

<ComboChart data={costData} series={series} />

Loading dashboard...