Skip to content

Releases: graphieros/vue-data-ui

v2.4.10

27 Nov 16:55
Compare
Choose a tag to compare

VueUiXy

Minor fix: position datapoint labels correctly when value is 0.

v2.4.9

27 Nov 06:08
Compare
Choose a tag to compare

VueUiSparkStackbar

Add optional tooltip:

const config = ref<VueUiSparkStackBarConfig>({
  style: {
    ..., // rest of your config
    tooltip: {
      show: boolean; // default: true
      backgroundColor: string; // default: "#FFFFFF"
      color: string; // default: "#2D353C"
      fontSize: number; // default: 14
      customFormat: null | Function; // default: null *
      borderRadius: number; // default: 4
      borderColor: string; // default: "#E1E5E8"
      borderWidth: number; // default: 1
      position: "left" | "center" | "right"; // default: "center"
      offsetY: number; // default: 24
    }
  }
})

*check out v2.0.6 to see how to use custom format


Built-in annotator improvement

(see v2.4.2 for details on this feature)
Now the path is smoothed and optimized while drawing, to auto correct the noise that occurs when using a mouse to draw paths.

v2.4.7

25 Nov 18:46
Compare
Choose a tag to compare

Built-in annotator

The built-in annotator available on all charts through the chart menu now allows to draw paths with individual color and stroke width.
Also, a discrete optimization is applied on paths to smooth out noise that always occurs when drawing by hand (especially with a mouse).

image

v2.4.5

25 Nov 05:21
Compare
Choose a tag to compare

Source slot

All chart components now expose a #source slot, to display a source caption under your chart.

Usage:

<VueUiDonut :dataset="dataset" :config="config">
  <template #source>
    <div style="font-size: 10px">
      Source: Lorem ipsum...
    </div>
  </template>
</VueUiDonut>

An example is featured on the documentation page

v2.4.2

23 Nov 17:52
Compare
Choose a tag to compare

New user option: annotator ✍️

Most charts now have the annotator user option, available in the chart top menu, which allows end users to draw live annotations on charts. These annotations can be saved using pdf of img download. A nice feature when people talk around a chart.

When activated, the annotator shows a set of 5 actions:

  • Close the annotator
  • Change the pen color
  • Undo
  • Redo
  • Delete all annotations

By default, this feature is enabled.
To disable this feature, set the following config attribute to false.

userOptions.buttons.annotator: boolean; // default: true

To change the tooltip label of the action button:

userOptions.buttonTitles.annotator: string: // default: "Toggle annotator"
Enregistrement.de.l.ecran.2024-11-23.a.18.44.39.mov

v2.4.1

21 Nov 15:27
Compare
Choose a tag to compare

New component : VueUiBullet

A Bullet Graph is a compact visualization tool for performance data, which includes additional elements such as a target and ranges to provide richer context. This component offers a space-efficient alternative to traditional gauge charts.

Try it out on the documentation page.
A chart maker is also available:)

Enregistrement.de.l.ecran.2024-11-21.a.16.20.43.mov

v2.4.0

20 Nov 12:27
Compare
Choose a tag to compare

VueUiDonut

Apply shadow option in polar mode

VueUiRating & VueUiSmiley

  • Improved reactivity
  • New config options:
  1. Label formatter callbacks to customize labels:
config.style.rating.formatter: Function | null; // default: null
config.style.tooltip.formatter: Function | null; // default: null

Example implementation:

const config = ref({
  style: {
    rating: {
      formatter: ({ value }) => {
        return `Rating: ${value}`;
      }
    }
  }
});
  1. Rounding value config option for tooltips:
config.style.tooltip.roundingValue: number: // default: 0

v2.3.99

19 Nov 04:54
Compare
Choose a tag to compare

VueUiQuickChart

Fix bug causing dataset series names to be ignored. (fixes #122)

VueUiCarouselTable

Fix pause on hover optional feature not working.

VueUiIcon

  • Improve shapes for star and starFilled icons
  • Add starFace icon

v2.3.98

18 Nov 07:22
Compare
Choose a tag to compare
  • Improve smooth line algorithm to fix dips in some edge cases
  • Update chartAgePyramid icon
  • VueUiXy: expose seriesIndex and datapointIndex in #plot-comment slot
  • VueUiScatter: fix regression affecting smooth line on vertical marginal bar

v2.3.95

16 Nov 10:28
Compare
Choose a tag to compare

VueUiDonut

  1. Add new layout option to display the chart as a Polar area:
config.type: "classic" | "polar"; // default: "classic"

Docs are up to date.

Enregistrement.de.l.ecran.2024-11-16.a.11.24.02.mov
  1. Fix a bug showing NaN values in the data table