New lollipop and candlestick charts, plus animations
Compare categories with a new lollipop graph, which uses a dot and a line back to zero for each value. It gives rankings and comparisons a lighter look than bars, with horizontal or vertical layouts and separate styling for the dots and lines.
Our new candlestick graphs show opening, closing, highest and lowest prices for each trading session, with colours that distinguish rising and falling prices. Hover over a candle to see all four values. Both graph types are available as beta plugins for graphs you build in code.
Learn more about lollipop graphs and candlestick graphs.
Animate when a reader gets to the chart
Graphs further down a page can now wait to play their entrance animation until you scroll to them. It’s useful for reports and stories where readers reach each graph at their own pace.
Set animation.intro.trigger to 'inView' to enable it. The title, axes and legend appear immediately, and the animation plays once when the graph comes into view.
Point and edit (work in progress)
On our new point and edit experience (still under development), the selection menu now lets you move between one value, its category and its series where those selections differ.
It's now possible to style the point-and-edit menu separately from your graph, including different looks for light and dark mode, while keeping the editor’s own font. Point and edit also no longer opens an empty menu for custom graph types without an editor registered for them.
Calculate a mean or median for each category and series with
stat.summary(), with an optional range or statistical interval around it.Gradient, pattern and image fills on bars and heatmap cells now appear in matching legend and tooltip symbols, as well as symbols beside headline numbers and reference labels.
Points placed side by side now line up with their corresponding bars, and lines stay aligned with their points, including on radar graphs.
Replace a control across multiple editor panels at once with
ControlRegistryProvider, while keeping the option to override it within one panel.Custom graph plugins can draw rectangles and shapes that animate as data changes, and colour individual parts from the values they represent.
Plugin authors can reuse Graphy’s gradient and pattern rendering and format labels in the graph’s language and number format.
Custom graph plugins can supply their own default calculation and declare which values it produces for the chosen settings.
Plugin authors can hide tooltip rows when a value is missing, give other layers priority on hover and report unsupported data mappings clearly.
The Graphy charts skill now creates working HTML graphs in Claude Desktop and other environments without a build setup.
Data labels choose readable text colours over transparent fills, and contrast calculations recognise more
rgb()andhsl()colour formats.Automatically placed pie and donut labels stay inside their slice when they fit and move outside when they need more room.
Reference-line labels have more room before their text is cut off.
Graphs with data mappings on individual layers, reshaped columns or two vertical axes now resolve their scales correctly.
A reference line listed first no longer takes over the axis title or number format.
Hovering a lollipop picks the one under the pointer, and clicking its line selects it correctly.
Clicking anywhere across a candlestick’s body selects that trading session.
Tooltips without colour symbols no longer leave an empty space beside every row.
Calculations keep their computed data mappings when filtering removes every row, and custom
computeStatimplementations must now handle empty datasets.Time axes can show hourly labels for readings within a day and keep the date when they span several days.
Titles no longer briefly overlap the legend or graph when first appearing.
Switching to a pie or donut works when you’ve set a fixed category order, and switching back preserves that order.
Graphs that wait to animate until they scroll into view now draw correctly in Safari.