Back

Version 3

10/10/2024
/** @jsxImportSource https://esm.sh/react */
import React, { useState } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";

const regionData = {
sar: { name: "Sardegna", population: 1590044 },
sic: { name: "Sicilia", population: 4833705 },
cal: { name: "Calabria", population: 1877728 },
bas: { name: "Basilicata", population: 547579 },
pug: { name: "Puglia", population: 3933777 },
cam: { name: "Campania", population: 5679759 },
mol: { name: "Molise", population: 296547 },
abr: { name: "Abruzzo", population: 1285256 },
laz: { name: "Lazio", population: 5720796 },
umb: { name: "Umbria", population: 865452 },
mar: { name: "Marche", population: 1501406 },
tos: { name: "Toscana", population: 3692555 },
emi: { name: "Emilia-Romagna", population: 4438937 },
fri: { name: "Friuli-Venezia Giulia", population: 1201510 },
ven: { name: "Veneto", population: 4852453 },
tre: { name: "Trentino-Alto Adige", population: 1067648 },
lom: { name: "Lombardia", population: 9965046 },
};

function App() {
const [hoveredRegion, setHoveredRegion] = useState("");
const [selectedRegions, setSelectedRegions] = useState([]);

const handleMouseEnter = (event) => {
const regionId = event.target.id;
setHoveredRegion(regionId);
};

const handleMouseLeave = () => {
setHoveredRegion("");
};
all-diplomaticmagentatoad.web.val.run
Updated: October 10, 2024