You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
55 lines
1.6 KiB
55 lines
1.6 KiB
<!DOCTYPE html> |
|
<html lang="en"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" |
|
integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" |
|
crossorigin=""/> |
|
|
|
<style> |
|
#myMap { |
|
height: 1000px; |
|
} |
|
</style> |
|
|
|
<title>Map</title> |
|
</head> |
|
<body> |
|
<div id="myMap"></div> |
|
</body> |
|
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" |
|
integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" |
|
crossorigin=""></script> |
|
<script> |
|
const tilesProvider = 'https://{s}.tile.openstreetmap.de/{z}/{x}/{y}.png' |
|
let myMap = L.map ('myMap').setView([41.41,2.13],12) |
|
L.tileLayer (tilesProvider, { |
|
maxzoom: 18, |
|
}).addTo (myMap) |
|
/*DEfinim les propietats del marcador*/ |
|
let iconMarker = L.icon({ |
|
iconUrl:'marker.png', |
|
iconSize:[30,30], |
|
iconAnchor:[15,30] /*A quin punt en píxels de la imatge es clva el marcador al mapa */ |
|
}) |
|
/*Definim el marcador amb les coordenades i l'objecte iconMarker definit*/ |
|
|
|
/*carregar els arxius geojson*/ |
|
|
|
function fetchJSON(url){ |
|
return fetch(url) |
|
.then(function(response){ |
|
return response.json(); |
|
}); |
|
} |
|
var data=fetchJSON ('cadastre/constru.geojson').then(function(data){ |
|
return data; |
|
}); |
|
|
|
L.geoJSON(data).addTo(myMap); |
|
|
|
|
|
</script> |
|
</html>
|
|
|