v3.1.17

VueUiXy

Fix regression on zoom range inputs in non-minimap mode.

v3.1.16

VueUiXy

In fullscreen mode, fix cursor offset.

v3.1.15

VueUiXy

Fix bars disappearing from the zoom minimap selection in some cases.

v3.1.14

Zoom feature - Focus on drag

Add optional config attributes to zoom on a set portion of the zoom component:

Enregistrement.de.l.ecran.2025-09-18.a.14.27.25.mov

config...zoom : {
  focusOnDrag: true, // New. Default: false, current behavior
  focusRangeRatio: 0.2, // New: will zoom on 20% of the zoom width, around the cursor position. Clamped from 0.05 to 0.95
}

Available for the following components:

• VueUiXy
• VueUiXyCanvas
• VueUiDonutEvolution
• VueUiStackbar
• VueUiCandlestick
• VueUiQuickChart

v3.1.13

VueUiXy

Fix regression leading to selection rect no showing on the main chart when dragging the zoom selection (with preview mode enabled).

v3.1.12

VueUiXy

Fix scale issues in zoom minimap when multiple series are visible.

v3.1.11

VueUiXy

Fix recursive update error in Firefox when using a large amount of data intensive chart instances with zoom + preview enabled.

v3.1.10

Follow-up to v3.1.8

• Improve minimap performance for VueUiXy and VueUiQuickChart zoom
• Apply optional cutNullValues set on VueUiXy on minimap lines

v3.1.8

VueUiXy, VueUiQuickChart : compact minimap with all visible series

Enregistrement.de.l.ecran.2025-09-16.a.14.02.34.mov

VueUiXy

const config = ref({
  chart: {
    zoom: {
      minimap: {
        show: true,
        compact: true, // new (default true, set to false to get previous design)
        merged: false, // new (default false, shows all series. Set to true to get previous design)
        frameColor: '#A1A1A1' // new (set frame color when compact = true)
      }
    }
  }
})

VueUiQuickChart

const config = ref({
  zoomMinimap: {
    show: true,
    compact: true, // new (default true, set to false to get previous design)
    merged: false, // new (default false, shows all series. Set to true to get previous design)
    frameColor: '#A1A1A1' // new (set frame color when compact = true)
  }
})

VueUiTable - Add filename input field in export menu #250

An optional default filename can be set in config.style.exportMenu.filename (default: '')

VueUiNestedDonuts

Fix inverted donut names on Firefox

v3.1.7

VueUiXy - Custom gradients

New slots are available to use custom gradients on areas and bars.

#area-gradient & #bar-gradient slots

Use these slots to inject a gradient svg element (linearGradient, radialGradient) into the pre-existing defs element of the chart.
Slots expose the series data, as well as the id that must be used on the gradient to be recognized and applied.

<VueUiXy
  :dataset="dataset"
  :config="config"
>
  <!-- This slot is applied on all line series with useArea set to true -->
  <template #area-gradient="{ series, id }">
    <linearGradient :id="id" x1="0" x2="0" y1="0" y2="1">
      <stop offset="0%" :stop-color="series.color"/>
      <stop offset="100%" :stop-color="isDarkMode ? '#3A3A3A' : '#FFFFFF'" stop-opacity="0"/>
    </linearGradient>
  </template>

  <!-- This slot is applied on all bar series -->
  <template #bar-gradient="{ series, positiveId, negativeId }">
    <!-- Gradient applied for positive datapoints -->
    <linearGradient :id="positiveId" x1="0" x2="0" y1="0" y2="1">
      <stop offset="0%" :stop-color="series.color"/>
      <stop offset="100%" :stop-color="isDarkMode ? '#3A3A3A' : '#FFFFFF'" stop-opacity="0"/>
    </linearGradient>

    <!-- Gradient applied for negative datapoints -->
    <linearGradient :id="negativeId" x1="0" x2="0" y1="0" y2="1">
       <stop offset="0%" :stop-color="isDarkMode ? '#3A3A3A' : '#FFFFFF'" stop-opacity="0"/>
       <stop offset="100%" :stop-color="series.color"/>
    </linearGradient>
  </template>
</VueUiXy>

Documentation & examples are up to date