github apexcharts/apexcharts.js v6.1.0
💎 Version 6.1.0

14 hours ago

ApexCharts 6.1.0

A focused follow-up to 6.0. The Measure ruler graduates into a first-class toolbar tool you can pre-select, toolbar tools can now be toggled off, and two interaction bugs are fixed. Everything is backward compatible: existing configs render unchanged.

✨ Features

Measure ruler in the toolbar

The measure / delta ruler (shipped in 6.0) is now a built-in toolbar tool, so it can be armed with a click instead of holding the measure key. The button appears automatically whenever the ruler is enabled, and can be pre-selected so the plot loads ready to measure.

import ApexCharts from 'apexcharts'
import 'apexcharts/features/measure'

const options = {
  chart: {
    measure: { enabled: true },
    toolbar: {
      autoSelected: 'measure',   // pre-select the ruler on load
      tools: { measure: true },  // default; set false to keep it key-only
    },
  },
}
  • The button shows only when chart.measure.enabled is true. tools.measure accepts true / false or a custom SVG string, like the other tools.
  • toolbar.autoSelected now also accepts 'measure', so the plot loads armed and ready to drag with no key held and no click. The m key still works.
  • Selecting the ruler is mutually exclusive with zoom / pan / selection. The icon matches the rest of the toolbar and follows the light / dark themes.

🔧 Behavior changes (on by default)

Toolbar tools toggle off on re-click

Clicking an already-selected zoom, pan, selection, or measure icon now deselects it, leaving the chart with no active tool. Previously those buttons were one-way (clicking the active tool did nothing). This makes the ruler's on / off state obvious and lets you drop back to a plain, gesture-free chart.

TypeScript

toolbar.tools.measure, the 'measure' value for toolbar.autoSelected, and the toolbar.measure locale string are all typed.

Don't miss a new apexcharts.js release

NewReleases is sending notifications on new releases.