series | LineChartSeries[] | [] | series={series} | Chart series data. The component does not provide mock data. |
xLabels | string[] | — | xLabels={xLabels} | Horizontal labels. Without them, use ChartGroup.xLabels or internally generated point-index labels. |
width | number | string | 800 | width="Example" | Overall chart width; supports 100%. Geometry is recalculated from the measured root width. |
height | number | string | 400 | height="Example" | Overall chart height; numeric values follow pixel semantics and become rem. |
yMin | number | — | yMin={42} | Vertical-axis minimum. Without it, derive a nice domain from data; positive-only data includes 0 by default. May inherit ChartGroup. |
yMax | number | — | yMax={42} | Vertical-axis maximum. Automatic mode uses the actual data maximum without rounding upward; may inherit ChartGroup. |
yTicks | number[] | — | yTicks={yTicks} | Explicit vertical-axis ticks, replacing automatic nice ticks; may inherit ChartGroup. |
yTickCount | number | — | yTickCount={42} | Target count for nice ticks when yTicks is absent. |
yTickFormatter | (value: number) => string | — | yTickFormatter={(value) => { /* handle value */ }} | Format vertical-axis labels. Defaults to K formatting or inherits ChartGroup. |
showXAxis | boolean | — | showXAxis | Show the horizontal axis. |
showYAxis | boolean | — | showYAxis | Show the vertical axis. |
showGrid | boolean | — | showGrid | Show horizontal grid lines. |
showGuides | boolean | — | showGuides | Allow series to draw vertical guides through data points. |
showHoverLabel | boolean | — | showHoverLabel | Show a numeric label for hovered or focused points. When showHoverPanel=true and omitted, labels are off by default. |
alwaysShowHoverLabel | boolean | false | alwaysShowHoverLabel | Keep numeric labels visible. May coexist with showHoverPanel. |
adaptiveContrast | boolean | — | adaptiveContrast | Adaptive black-and-white contrast based on solid host background and overlapping bars at the same origin. Adjusts black values, default black-and-white nodes, and black lines without recoloring colored series or nodes. The sRGB grayscale threshold is 0.5; background images and cross-chart transforms are unsupported. Inherits ChartGroup or defaults to true. |
showHoverPanel | boolean | true | showHoverPanel | Show a generated panel for the current point or cell on hover or focus. On by default. false returns to numeric hover labels unless showHoverLabel is explicitly set. |
hoverPanelVariant | ChartHoverPanelVariant | "light" | hoverPanelVariant={value} | Hover panel appearance variant. |
hoverPanelPlacement | ChartHoverPanelPlacement | "pointer" | hoverPanelPlacement={value} | Hover panel position by data anchor, pointer, or fixed plot pin. |
showHoverPanelLabel | boolean | false | showHoverPanelLabel | Show the current category above hover panel data. |
hoverMode | ChartGroupHoverMode | — | hoverMode={value} | Hover hit model. cell creates full category hit regions around point centers and coordinates shared hover. |
activeCellIndex | number | null | — | activeCellIndex={42} | Controlled index of the hovered category point; inherits ChartGroup when omitted. |
onCellHoverChange | (index: number | null) => void | — | onCellHoverChange={(value) => { /* handle value */ }} | Callback when the hovered category point changes. |
valueFormat | NumberFormatOptions | — | valueFormat={value} | Component-level number format for point labels. notation auto or compact uses English k/m/b/t abbreviations. Falls back to NumberFormats. |
labelFormatter | ( value: number, context: { series: LineChartSeries; point: NormalizedPoint; seriesIndex: number; pointIndex: number; }, ) => string | — | labelFormatter={(value) => { /* handle value */ }} | Custom point-value label formatter. Takes priority over global, component, series, and point valueFormat. |
xAxisMode | LineChartXAxisMode | — | xAxisMode={value} | Point placement: edge aligns the first and last points and label centers to plot ends; cell centers them in category cells. |
xLabelAutoCull | boolean | — | xLabelAutoCull | Automatically cull horizontal labels based on measured full-text widths without removing points, paths, or hit cells. |
xMaxLabelCount | number | — | xMaxLabelCount={42} | Maximum visible horizontal labels. Keep endpoints and remove middle labels and corresponding label positions at even intervals; may inherit ChartGroup. |
yLabelAutoCull | boolean | — | yLabelAutoCull | Automatically cull vertical labels according to available height. |
yMaxLabelCount | number | — | yMaxLabelCount={42} | Maximum visible vertical labels. Without yTicks, also limits generated nice ticks; may inherit ChartGroup. |
cornerRadius | number | string | 8 | cornerRadius="Example" | Corner radius for rounded line turns; 0 gives straight segments. |
colors | (LineChartColor | undefined)[] | — | colors={colors} | Color palette. Missing entries fall back to colorMode. |
colorMode | LineChartColorMode | "sequence" | colorMode={value} | Shared chart color mode: default sequence, fading monochrome, or monochrome. |
color | LineChartColor | — | color={value} | Primary color for monochromeFade and monochrome when supplied. |
monochromeColor | LineChartColor | "Primary" | monochromeColor={value} | Color for monochromeFade; first series is 100% opacity, last 20%, with even steps between. |
mutedMonochromeColor | LineChartColor | "Black4" | mutedMonochromeColor={value} | Color for monochrome; series without custom colors default to 4% black fill with 100% stroke opacity. |
showBaseLayer | boolean | false | showBaseLayer | Show a final-size same-color outline at 4% opacity, off by default. It does not animate or change real paths, hit areas, or timeline. Applies to both full lines and Area bases without disabling the real Area gradient. |
appearMotion | boolean | true | appearMotion | Enable chart appearance motion. |
appearOnView | boolean | true | appearOnView | Play appearance when the trigger anchor enters the viewport; same-origin iframes use position in the outermost same-origin page. |
appearanceProgress | number | — | appearanceProgress={42} | Controlled appearance progress from 0..1; when supplied, the chart renders only from that value without its own playback. |
defaultAppearanceProgress | number | 0 | defaultAppearanceProgress={42} | Initial uncontrolled appearance progress. |
appearanceDuration | number | — | appearanceDuration={42} | Override total automatic playback duration. Without it, each series draws for 1000ms and additional series extend completion through 360ms staggering. |
appearAnchorId | string | — | appearAnchorId="Example" | ID of the appearance trigger anchor; defaults to the chart root. |
appearAnchorPoint | AnchorPoint | "top" | appearAnchorPoint={value} | Top, center, or bottom of the anchor used as the trigger point. |
appearViewportPoint | number | "top" | "center" | "bottom" | 0.7 | appearViewportPoint={42} | Viewport trigger line. 0.7 means 70% of viewport height. |
scrollAppearance | boolean | { distance?: number | string } | false | scrollAppearance={scrollAppearanceOptions} | Enable a scroll-driven appearance timeline; same-origin iframes also respond to outer-page scrolling. |
scrollAppearanceDistance | number | string | 320 | scrollAppearanceDistance="Example" | Scroll distance mapped from 0 to 1 appearance progress. |
onAppearanceProgressChange | (progress: number) => void | — | onAppearanceProgressChange={(value) => { /* handle value */ }} | Callback after appearance progress changes. |
loading | boolean | — | loading | Data waiting state. Keeps canvas dimensions, axes, and grid while holding lines, areas, and markers at appearance start and pausing interactions. When cleared, motion follows viewport conditions. Does not render Skeleton; reads ancestor Frame loading context. |
children | Snippet | — | <LineChart>Content</LineChart> | Additional content after the chart body without arguments. Does not replace axes or series. |
class | string | "" | class="my-component" | Additional class on the root layer. |
style | string | "" | style="width: 100%;" | Additional inline style on the root layer. |
enableResponsive | boolean | true | enableResponsive | Enable root Frame responsive behavior. |
enableContext | boolean | true | enableContext | Enable root Frame context behavior. |
enableScaleObserver | boolean | false | enableScaleObserver | Enable root Frame scale observation. |
enableDefaultMotion | boolean | true | enableDefaultMotion | Enable root Frame default motion. |
