ApexCharts 7.5 and 7.6: Icicle Charts, Interactive Tooltips, and Weave v6

ApexCharts 7.5.0 and 7.6.0 shipped in September 2026: 7.6 is for whoever draws the chart, 7.5 for whoever writes the plugin. No option was removed, but 7.6 changes how the library stylesheet and reduced motion behave, and the new icicle chart needs its own import.

Key takeaways

• Icicle charts (7.6) draw a hierarchy as nested bands, and need their own import.
• tooltip.interactive (7.6) makes a link or button inside a custom tooltip clickable.
• Page CSS now wins over the library's at equal specificity (7.6).
• Animations resume when reduced motion is turned off (7.6).
• Weave v6 (7.5) adds api.can(), api.claim(), api.drawn() and api.declare().
• Upgrading is npm install apexcharts@7.6.0.

Which defaults changed?

Default change	Release	What you will see	How to reverse it
Library stylesheet is prepended to <head>	7.6.0	A page rule at equal specificity beats the library's, wherever the page puts it	Set chart.injectStyleSheet: false and load apexcharts/dist/apexcharts.css yourself, after your own stylesheet, to put the library last in the cascade again
Reduced motion is no longer one-way	7.6.0	A chart mounted with the preference on animates again once it is turned off	chart.animations.enabled: false keeps a chart still
chart.animations.respectReducedMotion: false reaches the stylesheet	7.6.0	With the opt-out, CSS-driven motion (pie slice offset, tooltip and crosshair fades) animates too	Leave respectReducedMotion at its default, true

The icicle import is not a change: the chart type is new in 7.6. Reduced motion covers the preference and the opt-out.

What is an icicle chart?

An icicle chart draws a hierarchy as one band per depth level, each child nested inside its parent's extent along the value axis. It is the sunburst's layout in cartesian coordinates and takes the same data: a children tree, or an existing drilldown config read as plain data. Labels stay horizontal at every depth, so pick it when labels matter or the tree is deep.

import ApexCharts from 'apexcharts/icicle'

const chart = new ApexCharts(el, {
  chart: { type: 'icicle' },
  series: [{
    data: [
      { x: 'All storage', children: [
        { x: 'Engineering', children: [
          { x: 'Build', y: 210 },
          { x: 'Runtime', y: 160 },
        ]},
        { x: 'Design', y: 140 },
      ]},
    ],
  }],
})
chart.render()

The import is required. The icicle is the first chart type the full bundle does not carry; with script tags, load dist/icicle.js after the core script. Without it, render throws chart type "icicle" is not registered.

For a flame graph, set plotOptions.icicle to direction: 'up' and sort: 'name'. Clicking a branch rescales the value axis only; zoomType: 'both' re-bands the levels too. See the icicle chart docs.

How do I put a link inside a tooltip?

Set tooltip.interactive: true. A default tooltip has pointer-events: none and closes as the pointer leaves the data point, so a link inside it could never be clicked. With interactive on, the tooltip takes the pointer and waits 150ms before closing so the pointer can reach it.

tooltip: {
  interactive: true,
  custom: ({ series, seriesIndex, dataPointIndex }) => {
    const value = series[seriesIndex][dataPointIndex]
    return `<div class="tooltip-card">
              <strong>${value}</strong>
              <a href="/reports/${dataPointIndex}">Open report</a>
            </div>`
  },
}

followCursor is ignored while it is on. On grouped charts, leaving the tooltip dismisses the tooltips across the group. Leave it off unless the tooltip holds something to click.

What is new in Weave v6?

Four additions, all additive, all reachable from a plugin still declaring apiVersion: 2. Do not raise your apiVersion to get them: a host older than the version you declare skips the plugin.

• api.can(name) replaces typeof sniffing on the facade. Hosts before 7.5 have no can, so call it as api.can?.().
• api.claim(path, entries) sets stroke.dashArray or dataLabels.enabledOnSeries for your own series without writing the caller's config.
• api.drawn() lists series, annotations and overlays with their owner; api.declare() adds yours. Readers of drawn() need 7.5.1.
• api.info.title and pointer modifiers (shift, ctrl, alt, meta).

if (api.can?.('claim')) {
  const claim = api.claim('stroke.dashArray', [
    { series: 'Revenue (forecast)', value: 6 },
  ])
  // later
  claim.release()
}

The plugins guide has the full contract.

Other fixes

• A series declared hidden: true no longer comes back empty from resetSeries(), and shared tooltips keep every series once it is shown again.
• A hierarchy branch that omits its own value is summed from its children instead of dropped.
• rangeArea charts scale the y axis to their data.
• Data labels on a 100% stacked combo chart are fixed (#2429).
• The drilldown spinner's reduced-motion fallback, an opacity pulse, now runs.

Thanks to @lovasoa, @gioboa, @mrash and @mmilanovic4. The full lists are in the 7.5.0, 7.5.1 and 7.6.0 GitHub releases.

Upgrading

npm install apexcharts@7.6.0

Or with a script tag:

<script src="https://cdnjs.cloudflare.com/ajax/libs/apexcharts/7.6.0/apexcharts.min.js"></script>

• Check the default changes against any page CSS that targets chart elements.
• Drawing icicle charts? Add the apexcharts/icicle import.
• Maintaining a Weave plugin? Change nothing, and keep your apiVersion.

Per-entry bundle sizes, re-measured on 7.6.0, are in the tree-shaking guide.

Under the 7.6.0 terms, the Community License is free only for organisations under $2M USD in annual revenue (for a non-profit, annual operating budget). 7.7.0 widened that test; the current terms are on the licence and pricing pages.

Frequently asked questions