What's new
The latest @michi-vz releases, newest first. All six packages - core, wc, react, vue, svelte, angular - version together (each release lists any package that moved ahead). Full per-commit detail lives in the GitHub releases.
v1.10.0
Package versions: react, wc, angular 1.10.0 · core 1.11.0 · vue, svelte 1.6.2 · devtools, insights 0.2.10.
- Play through the years, on every chart. The new opt-in
timelineprop adds a built-in play button + year scrubber (and a headlesschart.timeline()controller) to all 21 charts. Time-axis charts like Line and Area draw their marks up to the active year and sweep smoothly as the years play; snapshot charts like Pie, Gap, and Scatter step through one period's data at a time with values gliding between years; Treemap and Radial Tree tween whole hierarchies fromdate-tagged root nodes; Sankey plays overdate-tagged links; and Radar and Bar-Bell use a newperiodrow field. Off by default everywhere, and every chart page now has a live demo. - Reveal animation on every chart. The opt-in
progressiveDrawprop wipes the marks in from left to right on mount - and on Line, labels ride each growing line's end and settle beside it.replay()re-runs the reveal on demand. - Both features work in
svgandcanvasrender modes, respectprefers-reduced-motion(the chart renders fully drawn instantly), and are intentionally inert on the experimentalwebgpurenderer. - Fixed: a re-render during a running animation now resumes it from its current position instead of jumping to the end - framework wrappers update the chart right after mounting, which previously cancelled every mount autoplay.
- Fixed: the bare CDN URL for the web component bundle (
cdn.jsdelivr.net/npm/@michi-vz/wc) now resolves to the self-contained browser bundle, so a plain<script type="module">import works without spelling out the full/dist/...path.
v1.9.0
Package versions: react 1.9.0 · core 1.10.0 · wc, angular 1.9.1 · vue, svelte 1.6.1 · devtools, insights 0.2.9.
- Download any chart as an image or CSV. New core export helpers:
chartContextToCsv(ctx)turns any chart'sgetContext().a11yTable(the full, untruncated data table every chart carries) into RFC-4180 CSV with no per-chart code, andchartToStyledSvgString/chartToStyledSvgDataUri/chartToPngDataUrlrebuild a standalone, correctly styled SVG or PNG. Exported images used to lose gridlines, axis labels and the zero line because the chart CSS lives inadoptedStyleSheets, invisible to a plain serializer; the PNG helper also composites canvas-renderer marks over the SVG axes. React chart handles gaingetElement()so the helpers get a scoped element instead of a fragile global DOM query. - One tooltip, every series. LineChart's
sharedTooltip(plus an optionalsharedTooltipFormatter) shows a single tooltip listing every series' value at the nearest year alongside the crosshair, instead of only the nearest series. Forwarded by the web component and Angular wrappers. See Line. - The a11y table now carries the data itself. LineChart's
a11yTablebecame a wide per-period table - one column per x value labelled like the axis, one row per series,-for gaps - so a CSV export offgetContext()includes every plotted point. Per-series stats stay oncontext.series; this is the release's only behaviour change. - Gap chart axis parity. Gap gains
showZeroLineForXAxis(a solid vertical line at x=0, now drawn independently ofshowGrid) andmaxBarHeight(a 1-2 row chart no longer stretches its bars across the full plot height), and the numeric value axes on Gap and Comparable tilt crowded ticks -45° before thinning, as the date axes already did. - Label fixes across the band charts. Row labels clamp to two lines with an ellipsis instead of overlapping their neighbours; long category labels rotate instead of being wrongly thinned to half the axis; a Bubble label hugging the right edge flips to the left of its point rather than being cropped; and Comparable Vertical Bar paints the shorter sub-bar on top - a row whose "before" value was smaller used to hide it completely behind the taller bar - with the change arrow now centred above each pair.
v1.8.1
Package versions: react 1.8.1 · core, wc, angular 1.9.0 · vue, svelte 1.6.0 · devtools, insights 0.2.8.
- Four new charts - the atlas grows to 21. Comparable Vertical Bar (two full-width overlapping columns per category, hatched "before" behind a solid "after", with a change arrow above each pair), and the library's first geography family: Choropleth Map (bring your own GeoJSON, 13 projections, threshold or categorical colouring), Symbol Map (lng/lat bubbles with an optional muted landmass backdrop), and Radial Tree (a radial dendrogram with circles sized at both the group and leaf level).
- Log axes on LineChart.
yAxisScale: "log"for data spanning decades: non-positive values step aside as missing (with a data warning) and crowded labels thin to powers of ten. See Line. - True 100% stacking on AreaChart.
stackOffset: "expand"turns any stacked area into shares of the whole - real d3 stacking, not a display-only rescale. See Area. - Comparable bars, two new tools.
layout: "grouped"splits each band into side-by-side halves instead of overlaying, anddeltaIndicatordraws a red/green change arrow per row. See Comparable. - Honest symbol positions. Symbol Map's
positionMode: "precise"keeps every bubble at its exact projected lng/lat (overlaps allowed) instead of the default de-overlap simulation - the right choice whenever a visible landmass invites reading positions literally. A live toggle on the Symbol Map page shows the difference. - Labels where they were missing. Scatter gains
pointLabelsplus adrawOrderchoice (small-on-top default, or the legacy large-on-top); Treemap can print each tile's value withtileValueLabels. The loading and no-data overlays now also cover Radar, Sankey, and Treemap - and marks correctly stand down while an overlay shows.
v1.6.5
Package versions: react 1.6.5 · core, wc, angular 1.6.0 · vue, svelte 1.5.7 · devtools, insights 0.2.5.
- RibbonChart finally trades places. Each period's stack is now re-ranked by value, so a category that overtakes another visibly crosses ribbons on its way up - the whole point of a ribbon chart, restored from the legacy library. See it on the Ribbon page: US music revenue, where streaming overtakes everything and vinyl climbs back past the CD.
- Comparable bars you can actually read. The shorter sub-bar draws on top again (a grown bar no longer hides its "before"), and the new
colorsBasedMappinggives the before-bar its own colour - pair an opaque light tint withvalueBasedOpacity: 1for a crisp pale-vs-solid read in light and dark. See Comparable. - Bubble clusters without the freeze.
layoutMode: "async"runs the same deterministic force settle in ~12ms slices behind the chart's loading overlay - a 3,000-bubble cluster that used to block the page for ~20 seconds now costs at most a 50ms frame.settleTickstunes the settle, unchanged inputs skip the simulation entirely, and the layout is memoised across re-renders. See the collision-event demo on Bubble. - Small controls, big comfort. BarBell's value axis can move below the plot (
xAxisPosition: "bottom"), GapChart accepts an explicitxAxisDomain(zoom a life-expectancy story into its 35-90 band), the tornado's row labels can sit left of the plot (yAxisPosition: "left"), Radar pole labels stay clear of the title, and the tornado's context summary now names its largest imbalance. - Row labels you can grab - and scrub. On Gap, Comparable, and the tornado, opt-in
interactiveRowLabelsmakes every row label a real control: hover or focus it and a leader line runs to its row with the tooltip and highlight; click pins. The label gutter also scrubs like a slider - drag along it and the tooltip tracks your cursor from row to row, reaching even rows whose labels were thinned away on a dense axis. Try it on the demos above each of those pages. - A legend for everything. Every chart context now carries
legendData, and split charts (treemap, bubble, comparable) also expose each label's pale companion viaLegendItem.paleColor- the docs demos use it for their colour legends and the "Meaning | Colour pairs" toggle. - Dense band axes thin themselves. Row labels on gap/comparable/dual/bar-bell (and the fountain snapshot axis) sample to a readable subset instead of smearing at 100+ rows.
- Docs: press the buttons. Every chart page now has live "✦ Explain this chart" (the real insights rules engine, in your browser) and "🛠 Try DevTools on this chart" actions, plus new story-driven examples: the LHC dimuon spectrum on Scatter, EU gross-vs-net salaries on Bubble, and a ~195-country life-expectancy sweep on Gap.
- The Fountain learns to explain itself. The Fountain page now opens with an anatomy glossary (every visible part of the glyph has one stated meaning) and a field guide of eleven live reads - certainty, stability, risk, AI confidence, divided audiences, Philippine typhoons and more, most in the clean symmetric plume look. Symmetry now carries meaning too: an explicit
lean: 0stands a jet truly upright, a signedleanflags one-sided risk, and a jet with noleankeeps its decorative Geneva wind (reported aslean: nullingetContext()).
v1.6.1 - v1.6.4
Package versions: react 1.6.4 · devtools, insights 0.2.4 · core, wc, vue, svelte, angular 1.5.6. Four small patch waves between the headline releases:
- GapChart's value axis, hardened three ways. Consumer-supplied
tickValuesare filtered to finite values, sorted, and de-duplicated (degenerate inputs fall back to the data domain); marks and axis no longer overflow whentickValuesare passed whileenableExplicitTickValuesis off; and percentage domains gain range-aware padding, so a baseline marker at zero sits on the axis instead of past its edge. - VerticalStackBar's legend keeps its colours. A key you disable stays in
legendDataflaggeddisabled: true, so the legend pill dims instead of disappearing, and colour slots are assigned over the full key set - no key changes colour across a disable/enable toggle. Bars still exclude disabled keys.
v1.6.0
Package versions: react 1.6.0 · devtools 0.2.0 · insights 0.2.0 · core, wc, vue, svelte, angular 1.5.2.
- DevTools 0.2.0: the Michi shield toggle button. Mounting the devtools no longer covers your app - it starts as a small floating shield (the library's crest). Click it, or press
Ctrl/Cmd+Shift+M, to open the panel; the open/closed state is remembered per browser, so a reload comes back exactly how you left it. Corner taken by another floating widget? Drag the shield anywhere - that spot is remembered too, and the newbuttonPositionoption picks the starting corner. The handle gainedisOpen(), and<MichiVzDevtools />(react 1.6.0) passesbuttonPositionthrough. See DevTools. - Insights 0.2.0:
matchLabels()cross-dataset linkage. Link the same entities across two differently-spelled lists (a CRM export vs an ERP export) so two datasets become one joined chart: mutual best match by default, confidence-margin gated, unmatched rows returned with a "did you mean" hint. Model-free hashing works offline; the MiniLM backend also links synonyms, abbreviations, and translations. Try the live MatchLab demo. - Core 1.5.2: heavy-page performance fixes. The
onChartDataProcessedidempotency guard now signs contexts through a bounded FNV-1a hash instead of stringifying every row (a multi-MB string per render at 50k points), and canvas/WebGPU scatter hover collapses each frame's pointer burst into one trailingrequestAnimationFramepass. Big dashboards stay responsive with nothing to configure. - Docs, now in four languages. The site speaks English, French, Dutch, and Vietnamese, with a language switcher in the navbar - every guide, chart, and API page is translated. Contributions to the translations are welcome; see the footer's Help translate link.
- A sharper home page. The homepage now leads with the DevTools story and four plain-language pillars - inspect everything, charts machines can read, accessible by default, and runs locally. A new footer invites you to star the repo, join the community, contribute, and help translate. The Michi shield is the site favicon and sits beside the navbar title, and every page ships a unique description and social card.
v1.5.0
- DevTools is here:
@michi-vz/devtools0.1.0, first public release. An in-page panel (no browser extension) that inspects every chart's live state across eight tabs - Overview (with live editing + Reset chart), Sizing, Scales, Diff, Hit-test, Profiler, Insights, and an A11y audit. Shadow-DOM isolated, resizable, light + dark, dev-only by default with an inert/productionentry, and a React one-liner:<MichiVzDevtools />. See DevTools. - Insights 0.1.0: transparent and local-first AI.Methodology now spells out the exact logic behind every insight;
describeModelSource()states what a model backend would download and from where before anything loads;modelSourceredirects downloads to a mirror or self-hosted files (or forbids them entirely); andollamaCaller/openaiCompatCallerhook a local AI (Ollama, LM Studio, llama.cpp) in one line with zero downloads. Anomaly results now carry their method, threshold, and a plain-language explanation. - Core: the devtools hook gained high-frequency hit-test and render-timing channels (zero cost when devtools is off).
v1.4.0
- The hover crosshair is back - and configurable. LineChart's vertical mouse line is on by default again (legacy parity; the port had silently flipped it off), snaps to the nearest data point instead of trailing the raw cursor, and hides when the cursor leaves the chart - in SVG, canvas, and WebGPU modes alike. Style it per chart with
enableMouseLine: { stroke, strokeWidth, strokeDasharray, snap }, theme it globally with the--michi-vz-crosshair/--michi-vz-crosshair-width/--michi-vz-crosshair-dashCSS vars, or passfalseto turn it off.
v1.3.0
- No period left behind on the x-axis. LineChart date axes now always keep the true first and last period (raw
d3time ticks used to snap to round boundaries and drop them), and crowded labels auto-rotate -45° then thin to ~5 instead of silently disappearing. - Continuous timelines with
fillPeriodTicks(Line + Area, opt-in). A tick for every period in the range, not just the ones present in the data; missing periods render faded with a "no data" hover tooltip, customizable vianoDataTickTooltipandnoDataTickColor.
v1.2.1
- Every npm page links its siblings. Each package README now carries a Framework packages table linking all six packages, so from any wrapper you can reach the rest. A dead monorepo link was fixed.
- All six packages realigned.
vue,angular,svelte, andwcwere a version behind on npm; they are now published together withcoreandreactat the same version. - Docs discoverability. The Installation table links each package to npm, and there is an npm button on the home page plus an npm icon in the top navigation.
v1.2.0
The drop-in compatibility release: the scoped @michi-vz/* packages can replace the legacy single-package michi-vz with no chart regressions. Everything is backward-compatible.
- Renderer-agnostic context.
legendData(the per-series colour contract for canvas / skip-mode consumers) on the Line/Gap/Area/Scatter/BarBell/Radar contexts;renderedData/visibleItems; everyon*Processedis now idempotent, so it fires only when the context actually changes and never loops. - LineChart. Loading / no-data states, axis config (
yTicks, grid lines, zero-line highlight),fontFamily, and consumer-suppliedsvgChildren. - More chart props. Gap shape legend; Comparable
maxBarHeight/symmetricXDomain; VerticalStackBar label rotation +keys; Scatter band scale, crosshair, and per-point shapes; Radar legacy data shape + forgiving hit-test. - Axes, SEO, and a11y. Adaptive auto-rotate and tick-thinning on crowded axes; the chart
<svg>now carries<title>,<desc>, and schema.org JSON-LD<metadata>. - Experimental WebGPU render path alongside SVG and canvas.
v1.1.1
- Bar-Bell fix. End-cap circles render on top of the bar segments (previously a later segment could paint over the previous segment's cap), and the whole segment is hoverable for tooltips, not only the end-cap circle.
