v2.6.41

VueUiMolecule #190

Add an optional color attribute to datapoints, to customize individual datapoint colors.
Setting a color on a node will trickle down the color to its children, unless this children also has a defined color.

type VueUiMoleculeDatasetNode = {
    name: string
    details?: string
    nodes?: VueUiMoleculeDatasetNode[]
    color?: string // new
}

v2.6.40

VueUiHeatmap (patch to v2.6.38)

Fix issue with dynamic Y positioning of column totals.

v2.6.39

Zoom feature

This is a very minor improvement on the zoom feature. Now when hovering an input handle, the time label's z-index takes preeminence, to keep labels readable at all times.

v2.6.38

VueUiHeatmap

Add optional row and column totals, with colors.

New config attributes

const config = ref({
  style: {
    layout: {
      cells: {
        rowTotal: {
          value: {
            show: true, // default: false
          },
          color: {
            show: true, // default: false
          }
        },
        columnTotal: {
          value: {
            show: true, // default: false
            rotation: 0, // default: 0
            offsetX: 0, // default: 0
            offsetY: 0, // default: 0
          },
          color: {
            show: true, // default: false
          }
        }
      }
    }
  }
})

Docs are up to date, as well as the chart builder.

v2.6.37

VueUiXy

Improve datapoint tags behavior and config options

Tags are enabled in the dataset (no change there):

const dataset = ref(
  [
    {
       name: 'Serie A',
       type: 'line',
       series: [1, 2, 3, 5, 8],
       useTag: 'end', // or 'start'; to be set on line or plot types (does not apply on bars)
    }
  ]
)

Config options are added to customize tag content:

// For line datapoints
config.line.tag.followValue: boolean; // default: true
config.line.tag.fontSize: number; // default: 14
config.line.tag.formatter: () => string | null; // default: null

// For plot datapoints
config.plot.tag.followValue: boolean; // default: true
config.plot.tag.fontSize: number; // default: 14
config.plot.tag.formatter: () => string | null; // default: null

The formatter works like all others, for example:

const config = ref({
  line: {
    tag: {
      formatter: ({ value, config }) => {
        const { datapoint, serieName } = config;
        console.log(datapoint);
        return `<div><span>${ serieName }:</span><span>${value.toFixed(1)}</span></div>`
      }
    }
  }
})

v2.6.34

VueUiDonut #188

• Improve responsive behavior
• Add config option to display curved markers:

config.style.chart.layout.curvedMarkers: boolean; // default: false

v2.6.33

VueUiStackbar

Add missing content for #tooltip-before and #tooltip-after scoped slots.

v2.6.32

VueUiDonutEvolution #187

Add config options to hide donut labels under a given percentage value, under config.style.chart.donuts .
A different threshold can be applied on hover state or zoom state:

const config = ref({
  style: {
    chart: {
      donuts: {
        hover: {
          hideLabelsUnderValue: 5, // Any label with a percentage under 5 will be hidden
        },
        zoom: {
          hideLabelsUnderValue: 3, // Any label with a percentage under 3 will be hidden
        }
      }
    }
  }
})

v2.6.31

VueUiQuickChart

1. Show time labels only at modulo (ideal for large datasets)

Add config options to control the display of time labels at a given modulo:

const config = {
  ...,
  xyPeriodsShowOnlyAtModulo: boolean // default: false
  xyPeriodsModulo: number // default: 12
}

2. Fix tooltip trap remaining highlighted on mouseout in line mode

v2.6.30

Add llms.txt #185

Available:

• at the root of the npm package
• on the documentation website : LINK