HelixOverviewDocsComponentsSandboxTheme builderCortexDocsEngramBuildingTraceBuildingRecallDeclaredServicesInsightsGet in touchSource on GitHub
Loading the reference
Line ChartView SourceEdit in SandboxView MarkdownCopy MarkdownOpen in ClaudeOpen in CursorA series over time as a line, read from a table.ExperimentalSince 0.1.0ChartsUsageimport'@fusion.dev/helix/line-chart'import'@fusion.dev/helix-headless/line-chart'Preview
API ReferenceRoothelix-line-chartA series over time as a line, read from a table.
PropTypeDefaultDescriptionareabooleanfalseWhether a wash is drawn under each line.curveCurveHow the line gets from one reading to the next.emphasis"outlined"|"solid"|"subtle"How much ink the lines claim.forstring""The id of the table to read.gridlines"both"|"category"|"value"Which rules are drawn across the plot, if any.labelstring""The drawing's name, for a pointer resting on it.material"frosted"|"glass"What the lines are made of.terminus"none"|"ring"|"square"|"triangle"The shape of the mark on each series' last reading.zerobooleanfalseWhether zero is forced into the range.
ReadTypeDescriptionnamedstringWhat to call the drawing, the consumer's word or the table's own.pointerWhich reading a pointer is nearest, for a tooltip to sit on.readingsnumberHow many readings there are, which is what the pointer maps onto.seriesSeries[]The columns of the table, one series each, or none if there is no table.sourceRowsRow[]Every row of the table, with each cell's text as well as its number.whenSettledPromise<void>Resolves a frame after the first update, when transitions are switched on.
PartDescriptionareaThe wash under one line, where `area` is set.bandThe slot the pointer is resting in.baselineThe rule at zero, where zero is inside the range.gridlineOne rule across the plot, under `gridlines`.guideA rule down the reading a pointer is resting on.labelOne reading's name.labelsThe row of reading names.lineOne series.markThe invisible point the tooltip is anchored to.plotThe drawing.svgThe drawing surface the lines and areas sit on.terminusThe mark on one series' last reading.tooltipThe bubble, forwarded from `Tooltip`.tooltip-anchorThe `Tooltip` element itself.tooltip-cellOne column's name and value inside the tooltip.tooltip-labelThe reading's own name inside the tooltip.tooltip-nameA column's name inside the tooltip.tooltip-valueA column's value inside the tooltip.
CSS PropertyDescription--line-chart-area-opacityHow much of a line's color its wash takes.--line-chart-band-colorThe slot the pointer is resting in.--line-chart-block-sizeHeight of the drawing.--line-chart-gapSpace between the drawing and its labels.--line-chart-gridline-colorOne rule across the plot, under `gridlines`.--line-chart-widthThickness of a line.
Roothelix-headless-line-chartA series over time as a line, read from a table.
PropTypeDefaultDescriptionareabooleanfalseWhether a wash is drawn under each line.curveCurveHow the line gets from one reading to the next.forstring""The id of the table to read.gridlines"both"|"category"|"value"Which rules are drawn across the plot, if any.labelstring""The drawing's name, for a pointer resting on it.terminus"none"|"ring"|"square"|"triangle"The shape of the mark on each series' last reading.zerobooleanfalseWhether zero is forced into the range.
ReadTypeDescriptionnamedstringWhat to call the drawing, the consumer's word or the table's own.pointerWhich reading a pointer is nearest, for a tooltip to sit on.readingsnumberHow many readings there are, which is what the pointer maps onto.seriesSeries[]The columns of the table, one series each, or none if there is no table.sourceRowsRow[]Every row of the table, with each cell's text as well as its number.whenSettledPromise<void>Resolves a frame after the first update, when transitions are switched on.
PartDescriptionareaThe wash under one line, where `area` is set.bandThe slot the pointer is resting in.baselineThe rule at zero, where zero is inside the range.gridlineOne rule across the plot, under `gridlines`.guideA rule down the reading a pointer is resting on.labelOne reading's name.labelsThe row of reading names.lineOne series.markThe invisible point the tooltip is anchored to.plotThe drawing.svgThe drawing surface the lines and areas sit on.terminusThe mark on one series' last reading.tooltipThe bubble, forwarded from `Tooltip`.tooltip-anchorThe `Tooltip` element itself.tooltip-cellOne column's name and value inside the tooltip.tooltip-labelThe reading's own name inside the tooltip.tooltip-nameA column's name inside the tooltip.tooltip-valueA column's value inside the tooltip.
ExamplesNameDescriptionAreaA wash under the line, for one series read as a quantity rather than a shape.CurvesThe three curves over one series: joined, smoothed, and held until the next reading.EmphasisFour weights of the same readings, from the line carrying them to the wash.From ZeroOpen incidents, where the distance from none is the reading: its own range turns a quiet year into a collapse.MaterialThe same wash opaque and as glass, with gridlines under it to read through.PreviewSessions a month, read from the table beside it. The cell text is what a reader sees and data-value is the number.PreviewSessions a month, read from the table beside it. The cell text is what a reader sees and data-value is the number.Several SeriesTwo series on one scale, with a legend mapping the same palette.Taking New DataThe same chart given different numbers, moving to the new shape rather than snapping to it.TerminiEach series marked where it ends, which is the column a reader checks for the current value.With A TooltipA pointer resting on a reading, showing the whole row including a column nothing plotted.With GridlinesRules at the levels a reader would infer, so a reading can be placed against one.