{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\user\\\\Desktop\\\\projet dashboard\\\\dashboard\\\\src\\\\components\\\\tableau_main\\\\components\\\\chart4.js\",\n _s = $RefreshSig$();\nimport React, { useEffect, useState } from \"react\";\nimport { GoogleMap, Marker } from \"@react-google-maps/api\";\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst Chart4 = () => {\n _s();\n const [donneesMap, setDonneesMap] = useState(null);\n const [donneesMapData, setDonneesMapData] = useState(null);\n useEffect(() => {\n fetch(\"./../data.json\").then(response => response.json()).then(data => {\n console.log(data.carte);\n setDonneesMap(data.carte);\n setDonneesMapData(data.carte.data);\n }).catch(e => {\n console.error(\"Erreur lors de la récupération des données JSON:\", e);\n });\n }, []);\n const mapContainerStyle = {\n width: \"400px\",\n height: \"400px\"\n };\n const center = {\n lat: 51.5074,\n lng: -0.1278\n };\n\n // Définir les coordonnées des frontières des pays à colorer\n const blueCountries = [{\n name: \"Country1\",\n coordinates: [...coordinates1]\n }, {\n name: \"Country2\",\n coordinates: [...coordinates2]\n }\n // Ajoutez d'autres pays ici avec leurs coordonnées\n ];\n\n const getFillColor = feature => {\n // Vérifier si le pays actuel doit être coloré en bleu\n const country = blueCountries.find(item => item.name === feature.getProperty(\"name\"));\n return country ? \"blue\" : \"default fill color\";\n };\n return /*#__PURE__*/_jsxDEV(\"div\", {\n children: [donneesMap && /*#__PURE__*/_jsxDEV(\"h3\", {\n children: [donneesMap.title, \" \"]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 45,\n columnNumber: 22\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"row\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"graphMiddle \",\n children: donneesMapData ? /*#__PURE__*/_jsxDEV(GoogleMap, {\n mapContainerStyle: mapContainerStyle,\n center: center,\n zoom: 2,\n options: {\n // Définir la couleur de remplissage par défaut pour tous les pays\n fillColor: \"default fill color\",\n // Définir la fonction de style pour les pays\n styles: [{\n featureType: \"administrative.country\",\n elementType: \"geometry.fill\",\n stylers: [{\n visibility: \"on\"\n }],\n // Utiliser la fonction de style pour définir la couleur de remplissage\n // des pays en fonction des conditions définies dans getFillColor\n color: getFillColor\n }]\n },\n className: \"d-flex align-items-center\",\n children: donneesMapData.map((item, index) => /*#__PURE__*/_jsxDEV(Marker, {\n position: {\n lat: item.lat,\n lng: item.lng\n },\n label: item.visits.toString()\n }, index, false, {\n fileName: _jsxFileName,\n lineNumber: 71,\n columnNumber: 17\n }, this))\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 49,\n columnNumber: 13\n }, this) : /*#__PURE__*/_jsxDEV(\"p\", {\n children: \"on cherche map loading\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 79,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 47,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"graphMiddle\",\n children: donneesMapData && donneesMapData.map((item, index) => /*#__PURE__*/_jsxDEV(\"p\", {\n children: ` ${item.location.toString()}, Nombres de visites ${item.visits.toString()}`\n }, index, false, {\n fileName: _jsxFileName,\n lineNumber: 85,\n columnNumber: 15\n }, this))\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 82,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 46,\n columnNumber: 7\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 44,\n columnNumber: 5\n }, this);\n};\n_s(Chart4, \"tvtsUyLQ6o3zkx1VxSW2+y5eLk8=\");\n_c = Chart4;\nexport default Chart4;\nvar _c;\n$RefreshReg$(_c, \"Chart4\");","map":{"version":3,"names":["React","useEffect","useState","GoogleMap","Marker","jsxDEV","_jsxDEV","Chart4","_s","donneesMap","setDonneesMap","donneesMapData","setDonneesMapData","fetch","then","response","json","data","console","log","carte","catch","e","error","mapContainerStyle","width","height","center","lat","lng","blueCountries","name","coordinates","coordinates1","coordinates2","getFillColor","feature","country","find","item","getProperty","children","title","fileName","_jsxFileName","lineNumber","columnNumber","className","zoom","options","fillColor","styles","featureType","elementType","stylers","visibility","color","map","index","position","label","visits","toString","location","_c","$RefreshReg$"],"sources":["C:/Users/user/Desktop/projet dashboard/dashboard/src/components/tableau_main/components/chart4.js"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\r\nimport { GoogleMap, Marker } from \"@react-google-maps/api\";\r\n\r\nconst Chart4 = () => {\r\n const [donneesMap, setDonneesMap] = useState(null);\r\n const [donneesMapData, setDonneesMapData] = useState(null);\r\n\r\n useEffect(() => {\r\n fetch(\"./../data.json\")\r\n .then((response) => response.json())\r\n .then((data) => {\r\n console.log(data.carte);\r\n setDonneesMap(data.carte);\r\n setDonneesMapData(data.carte.data);\r\n })\r\n .catch((e) => {\r\n console.error(\"Erreur lors de la récupération des données JSON:\", e);\r\n });\r\n }, []);\r\n\r\n const mapContainerStyle = {\r\n width: \"400px\",\r\n height: \"400px\",\r\n };\r\n const center = {\r\n lat: 51.5074,\r\n lng: -0.1278,\r\n };\r\n\r\n // Définir les coordonnées des frontières des pays à colorer\r\n const blueCountries = [\r\n { name: \"Country1\", coordinates: [...coordinates1] },\r\n { name: \"Country2\", coordinates: [...coordinates2] },\r\n // Ajoutez d'autres pays ici avec leurs coordonnées\r\n ];\r\n\r\n const getFillColor = (feature) => {\r\n // Vérifier si le pays actuel doit être coloré en bleu\r\n const country = blueCountries.find((item) => item.name === feature.getProperty(\"name\"));\r\n return country ? \"blue\" : \"default fill color\";\r\n };\r\n\r\n return (\r\n
\r\n {donneesMap &&

{donneesMap.title}

}\r\n
\r\n
\r\n {donneesMapData ? (\r\n \r\n {donneesMapData.map((item, index) => (\r\n \r\n ))}\r\n \r\n ) : (\r\n

on cherche map loading

\r\n )}\r\n
\r\n
\r\n {donneesMapData &&\r\n donneesMapData.map((item, index) => (\r\n {` ${item.location.toString()}, Nombres de visites ${item.visits.toString()}`}

\r\n ))}\r\n
\r\n
\r\n
\r\n );\r\n};\r\n\r\nexport default Chart4;\r\n"],"mappings":"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"},"metadata":{},"sourceType":"module","externalDependencies":[]}