https://primariamargineni.ro/wp-content/themes/townpress-child/map.js

1document.addEventListener('DOMContentLoaded', function () {
2    const mapContainer = document.getElementById('map');
3    if (!mapContainer) return;
4
5   // Initializeaza harta
6const map = L.map('map').setView([46.8945852, 26.6345071], 14); // Pozitia exacta a comunei / orasului
7
8// adauga OpenStreetMap titluri cu atribute
9L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
10    maxZoom: 18,
11    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a> contributors'
12}).addTo(map);
13
14map.attributionControl.setPrefix('');
15
16    // Creaza marker pe harta cu Bootstrap Icons
17    const customIcon = L.divIcon({
18        className: 'leaflet-div-icon',
19        html: '<i class=\"bi bi-geo-alt-fill\" style=\"font-size: 24px; color: #3388ff;\"></i>', 
20        iconSize: [30, 30],   // Marime icon
21        iconAnchor: [15, 30], 
22        popupAnchor: [0, -30],
23    });
24
25    // Arata poligon zona
26    fetch('https://nominatim.openstreetmap.org/search?q=Margineni,Neamt,Romania&format=json&polygon_geojson=1') // nume comuna
27        .then(response => response.json())
28        .then(data => {
29            if (data.length > 0) {
30                const geojson = data[0].geojson;
31
32                const boundary = L.geoJSON(geojson, {
33                    style: {
34                        color: '#3388ff', // Culoare margini
35                        weight: 3,       // Grosime margini
36                        fillOpacity: 0.1 // Transparenta
37                    }
38                }).addTo(map);
39
40                map.fitBounds(boundary.getBounds());
41             
42                let marker;
43                map.on('click', function (e) {
44                    const { lat, lng } = e.latlng;
45
46                    if (marker) {
47                        marker.setLatLng([lat, lng]);
48                    } else {
49                        marker = L.marker([lat, lng], { icon: customIcon }).addTo(map);
50                    }
51
52                    document.getElementById('latitude').value = lat;
53                    document.getElementById('longitude').value = lng;
54
55                    const googleMapsLink = 'https://www.google.com/maps?q=' + lat + ',' + lng;
56
57                    document.getElementById('google-maps-link').value = googleMapsLink;
58                });
59            } else {
60                console.error('No boundary found for the specified village.');
61            }
62        })
63        .catch(error => {
64            console.error('Error fetching village boundary:', error);
65        });
66});