We’re excited to announce Highcharts 12.6. The standout feature of this release is the experimental contour plot, a new series type that renders continuous, color-graded terrain from three-dimensional data directly in the browser.
Contour Plots, Powered by WebGPU
Contour plots are the go-to visualization for scientists, engineers, and analysts working with geospatial data, simulation outputs, or any dataset where you need to express how a value changes across a two-dimensional surface. Think elevation maps, temperature gradients, signal strength heatmaps, or pressure fields.
What makes this implementation special is the WebGPU rendering engine behind it. Rather than leaning on the CPU or SVG, the contour series offloads computation to the graphics card. The result is silky-smooth re-renders as you adjust parameters in real time.
Use the contourInterval and contourOffset sliders to watch the chart respond instantaneously, and toggle smoothColoring to see the gradient blend between levels. No janky redraws, no layout flicker. That’s WebGPU doing its job
A note on browser support: WebGPU is not yet universally available across all modern browsers. Check the Can I Use WebGPU table for the current picture before shipping to production. To get started, load modules/contour.js alongside your Highcharts core file.
This feature is currently experimental while we’re waiting for full browser support, and we’d love to hear how you put it to use. See the contour series docs for setup instructions and configuration options.
What Else Is New
Arrow Functions as Callbacks
A long-standing sore spot for modern JavaScript developers: arrow functions don’t bind this, which made using them as Highcharts callbacks awkward.
In 12.6, we’ve resolved this by passing the chart/series/point context as a separate argument.
Axis Units for Annotations
When positioning annotation shapes, you can now set xAxis and yAxis on shapes or shapeOptions to have coordinates and dimensions (including width, height, r, and ry) interpreted in axis units rather than pixels. This makes annotations dramatically easier to place accurately on scaled or dynamically sized charts.
Tooltip and Crosshair showDelay
You can now configure a showDelay on both tooltips and crosshairs. This is useful for reducing noise on dense charts where fast cursor movement would otherwise trigger a flurry of tooltip appearances.
Anchored Pattern Fills
Pattern fills now support anchoring, giving you stable, predictable alignment when patterns are applied across individual points like columns. This is particularly useful for print-ready and accessible charts where visual consistency matters.
Boost chunkSize Option
For boosted charts with large datasets, the new boost.chunkSize option lets you fine-tune how tooltip position indexing is processed. If you’ve been hitting performance ceilings on extremely dense scatter or line series, this will help.
Credits Click Event
A small but useful addition: you can now attach a click event callback to the credits element.
Get the Update
Highcharts 12.6 is available now. Grab it from npm or the download page, and see the full changelog for the complete list of bug fixes and improvements in this release.
As always, if you run into anything or want to share what you’ve built (especially with the new contour series) we’d love to hear from you.
Leave a Reply