Atelier UI

搜索组件…

搜索组件…

Sparkline

由数字数组生成的迷你折线/面积图,渐变填充、末点圆点与涨跌配色。

在沙盒中编辑

复制一段给 AI 编程工具的提示词,包含源码、依赖和用法

属性

SparklineProps

同时支持以下类型的全部属性: Omit<React.ComponentProps<"div">, "children">

属性类型默认值说明
data* 必填number[]——
trend"auto" | "up" | "down" | "primary""auto""auto" colours by first-vs-last value; "primary" uses the theme primary colour
areabooleantrueDraw the gradient area under the line
showDotbooleantrueDraw a dot on the last point
strokeWidthnumber2—
labelstring—Accessible description; defaults to an automatic summary

安装

$ npx shadcn@latest add https://chromotion.dev/r/sparkline.json

同类组件