v3.22.0

New: useTooltipPosition composable

Leverage this composable if you want tooltips to 'get out of the way', and be positioned to the right when the client position is on the left-half of the chart, and to the left when the client position is on the right-half of the chart. Also, as it was already possible before, you can adjust the tooltip X and Y offsets to leave appropriate spacing between the tooltip and the client position.

import { useTooltipPosition } from "vue-data-ui/composables";

const chartRef = useTemplateRef('chartRef');

const tooltipPosition = useTooltipPosition(chartRef);

// Example for the VueUiXy component
const config = computed<VueUiXyConfig>(() => {
  chart: {
    tooltip: {
      position: tooltipPosition.value,
    }
  }
})

<VueUiXy ref="chartRef" :dataset :config />

The documentation website will be updated shortly.