118 lines
4.4 KiB
JavaScript
118 lines
4.4 KiB
JavaScript
// Initialiser la carte centrée sur la France
|
|
const map = L.map('map').setView([46.711100, 1.719100], 6);
|
|
|
|
// Fond de carte
|
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
attribution: '© OpenStreetMap contributors'
|
|
}).addTo(map);
|
|
|
|
const iconMap = {
|
|
"archi privés": new L.Icon({
|
|
iconUrl: 'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-orange.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
}),
|
|
"archi hotel & spa": new L.Icon({
|
|
iconUrl: 'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-gold.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
}),
|
|
"archi publics": new L.Icon({
|
|
iconUrl: 'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-violet.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
}),
|
|
"paysagiste": new L.Icon({
|
|
iconUrl: 'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-green.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
}),
|
|
"pauseurs": new L.Icon({
|
|
iconUrl: 'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-yellow.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
}),
|
|
"fournisseurs": new L.Icon({
|
|
iconUrl: 'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-red.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
}),
|
|
"piscinistes": new L.Icon({
|
|
iconUrl: 'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-blue.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
}),
|
|
"chantiers emblématiques": new L.Icon({
|
|
iconUrl: 'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-black.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
})
|
|
};
|
|
|
|
// Charger les données du Google Sheet (CSV)
|
|
fetch("https://docs.google.com/spreadsheets/d/e/2PACX-1vQri4kOnjImxQFwbX5idNhjlQk1Hp-N6um5Ll46OVo4Hoe2o9SWKaHT2OYbNfb_j75StQ0VLDfBkq-6/pub?output=csv")
|
|
.then(response => response.text())
|
|
.then(csv => {
|
|
const lines = csv.split("\n").slice(1); // Enlever l'en-tête
|
|
lines.forEach(line => {
|
|
const [nombre, type, lon, lat, nom, email, numero, note, website] = line.split(",");
|
|
|
|
// Vérifier que les coordonnées sont valides
|
|
if (!isNaN(parseFloat(lat)) && !isNaN(parseFloat(lon))) {
|
|
const typeKey = (type || "").trim().toLowerCase();
|
|
const icon = iconMap[typeKey] || iconMap["fournisseurs"]; // par défaut = rouge
|
|
|
|
const popup = `
|
|
<strong>${nom}</strong><br>
|
|
Email: ${email}<br>
|
|
Tel: ${numero}<br>
|
|
Note: ${note}<br>
|
|
<a href="${website}" target="_blank">Site web</a>
|
|
`;
|
|
|
|
L.marker([parseFloat(lat), parseFloat(lon)], { icon: icon })
|
|
.addTo(map)
|
|
.bindPopup(popup);
|
|
}
|
|
});
|
|
})
|
|
.catch(error => {
|
|
console.error("Erreur de chargement du CSV :", error);
|
|
});
|
|
|
|
|
|
|
|
|
|
const typeKey = data.type.trim().toLowerCase();
|
|
const icon = iconMap[typeKey] || iconMap["fournisseurs"]; // couleur par défaut = rouge
|
|
|
|
const marker = L.marker([data.lat, data.lon], { icon: icon })
|
|
.addTo(map)
|
|
.bindPopup(popup);
|
|
|
|
markers.push(marker);
|