Geographic Information Systems Asked on February 18, 2021
I am trying to add a JSON file to my webmap in leaflet but I keep getting this error.
I am calling an external js file and adding it as a variable to my map
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Bunuba Heritage Map (BETA2)</title>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ=="
crossorigin=""/>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw=="
crossorigin=""></script>
<!-- esri -->
<script src="https://unpkg.com/[email protected]"></script>
<!--Stamen-->
<script src="http://maps.stamen.com/js/tile.stamen.js?v1.3.0" type="text/javascript"></script>
<!-- Boundary GeoJSON -->
<script type="text/javascript" src="JSON/BunubaNTarea.js"></script>
<!-- Plugin Mini Map -->
<link rel ="stylesheet" href= "/Minimap/src/Control.MiniMap.css"/>
<script type="text/javascript" src = "Minimap/src/Control.MiniMap.js"> </script>
<!-- Plugin Full screen -->
<link rel="stylesheet" href="FullScreen/Control.FullScreen.css" />
<script src="FullScreen/Control.FullScreen.js"></script>
<style>
#map {
width: 1800px;
height: 800px;
}
</style>
</head>
<body>
<h1>Bunuba Heritage Map (BETA) </h1>
<div id="map"><div>
<script>
var map = L.map('map',{center: [-17.723, 125.409], zoom: 10, attributionControl :
false});
var ESRI = L.esri.basemapLayer('Imagery').addTo(map);
var osm = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' });
var Stamen = new L.StamenTileLayer("terrain");
L.geoJSON(Boundary).addTo(Map);
var capas_base = {"ESRI Satellite": ESRI, "Open Street Maps": osm, "Terrain": Stamen};
var overlay = {"Bunuba Country": Boundary};
L.control.layers(capas_base, overlay).addTo(map);
L.control.scale({position:'bottomright',metric:true, imperial: false, maxWidth: 500}).addTo(map);
L.control.attribution({position:'bottomleft',prefix:false}).addTo(map);
var capa_mp = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png');
var miniMap = new L.Control.MiniMap(capa_mp, { toggleDisplay: true }).addTo(map);
L.control.fullscreen
({position: 'topleft',title: 'fullscreen', titleCancel: 'Exit', content: null, forceSeparateButton: true, forcePseudoFullscreen: false, fullscreenElement: false
}).addTo(map);
map.on('enterFullscreen', function(){
console.log('entered fullscreen');
});
map.on('exitFullscreen', function(){
console.log('exited fullscreen');
});
</script>
</body>
</html>
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP