Closed leoatfentech closed 1 month ago
I'm wondering why tooltip are not showing when hovering my map ?
Followed the examples from the docs but can't find what doing wrong.
here the code I'm using :
<template> <ChoroplethChart :data="data" :options="options" /> </template> <script setup lang="ts"> import { ChoroplethChart } from '@/components/fen-chart/custom-vue-charts/ChoroplethChart' import { ChartConfiguration, ChartOptions } from 'chart.js' import { type Feature, topojson } from 'chartjs-chart-geo' import fr from './fra.topo.json' const regions: Feature = fr.features console.log(regions) const data: ChartConfiguration<'choropleth'>['data'] = { labels: regions.map((d) => d.properties.nom), datasets: [ { label: 'Régions', outline: regions, data: regions.map((d) => ({ feature: d, value: Math.random() * 11, })), }, ], } const options: ChartOptions<'choropleth'> = { responsive: true, showOutline: false, showGraticule: false, plugins: { legend: { display: false, }, }, scales: { projection: { axis: 'x', projection: 'mercator', }, color: { axis: 'y', interpolate: 'purples', missing: 'white', legend: { position: 'bottom-right', }, }, }, } </script>
Changing legend to true or false does nothing
Context
the tooltip plugin is separate in chart.js and need to explicitly registered.
I'm wondering why tooltip are not showing when hovering my map ?
Followed the examples from the docs but can't find what doing wrong.
here the code I'm using :
Changing legend to true or false does nothing
Context