User:RandomnessofD

// function onEachFeature(feature, layer) { if (feature.properties && feature.properties.popupContent) { layer.bindPopup(feature.properties.popupContent); } } const geojsonMarkerOptions = { radius: 8, fillColor: "#ff7800", color: "#000", weight: 1, opacity: 1, fillOpacity: 0.8 }; const map = window.L.map('testmap', { crs: L.CRS.Simple, minZoom: -3, }); const bounds = [[0,0], [1000,1000]]; const image1 = L.imageOverlay('https://brightershoreswiki.org/images/Brighter_Shores_World_map.png?7c200', bounds).addTo(map); const image2 = L.imageOverlay('https://brightershoreswiki.org/images/Hopeport_background.png?9cf2e', bounds).addTo(map); const layerControl = L.control.layers({image1, image2}).addTo(map); const template_data = JSON.parse($('span.map-template-data').text()); map.fitBounds(template_data.coords); L.geoJSON(window.map_json, { onEachFeature: onEachFeature, pointToLayer: function (feature, latlng) { return L.circleMarker(latlng, geojsonMarkerOptions); }, }).addTo(map); map.on('click', function(ev){ var latlng = map.mouseEventToLatLng(ev.originalEvent); console.log(latlng.lat + ', ' + latlng.lng); }); //

.map {

   height: 600px;

}

// window.map_json = {"type":"Feature","properties":{"name":"Hello World","popupContent":"Test"},"geometry":{"type":"Point","coordinates":[104.99404,39.75621]}} //