PvMapChart

<script setup lang="ts">
import PvMapChart, { PvMapChartData } from "@charts/PvMapChart/PvMapChart.vue";

const data: PvMapChartData[] = [
  { state: "AL", hospital_score: 0.92 },
  { state: "AK", hospital_score: 0.82 },
  { state: "AZ", hospital_score: 0.94 },
  { state: "AR", hospital_score: 0.1 },
  { state: "CA", hospital_score: 0.64 },
  { state: "CO", hospital_score: 0.79 },
  { state: "CT", hospital_score: 0.83 },
  { state: "DE", hospital_score: 0.65 },
  { state: "FL", hospital_score: 0.93 },
  { state: "GA", hospital_score: 0.23 },
  { state: "HI", hospital_score: 0.84 },
  { state: "ID", hospital_score: 0.91 },
  { state: "IL", hospital_score: 0.89 },
  { state: "IN", hospital_score: 0.66 },
  { state: "IA", hospital_score: 0.73 },
  { state: "KS", hospital_score: 0.81 },
  { state: "KY", hospital_score: 0.5 },
  { state: "LA", hospital_score: 0.65 },
  { state: "ME", hospital_score: 0.95 },
  { state: "MD", hospital_score: 0.72 },
  { state: "MA", hospital_score: 0.84 },
  { state: "MI", hospital_score: 0.5 },
  { state: "MS", hospital_score: 0.96 },
  { state: "MO", hospital_score: 0.52 },
  { state: "MT", hospital_score: 0.91 },
  { state: "NE", hospital_score: 0.73 },
  { state: "NV", hospital_score: 0.66 },
  { state: "NH", hospital_score: 0.84 },
  { state: "NJ", hospital_score: 0.8 },
  { state: "NM", hospital_score: 0 },
  { state: "NY", hospital_score: 1 },
  { state: "NC", hospital_score: 0.89 },
  { state: "OH", hospital_score: 0.98 },
  { state: "OK", hospital_score: 0.96 },
  { state: "OR", hospital_score: 0.15 },
  { state: "PA", hospital_score: 0.95 },
  { state: "RI", hospital_score: 0.84 },
  { state: "SC", hospital_score: 0.91 },
  { state: "SD", hospital_score: 0.77 },
  { state: "TN", hospital_score: 0.84 },
  { state: "TX", hospital_score: 0.2 },
  { state: "UT", hospital_score: 0.97 },
  { state: "VT", hospital_score: 0.74 },
  { state: "VA", hospital_score: 0.66 },
  { state: "WA", hospital_score: 0.9 },
  { state: "WV", hospital_score: 0.89 },
  { state: "WI", hospital_score: 0.45 },
  { state: "WY", hospital_score: 0.7 },
];

const handleRegionSelectionChanged = (event: {
  region: string | null | undefined;
}) => {
  console.log("Selected region:", event.region);
};
</script>

<template>
  <div style="width: 500px">
    <PvMapChart
      :chartData="data"
      seriesKey="hospital_score"
      @region-selection-changed="handleRegionSelectionChanged"
    ></PvMapChart>
  </div>
</template>