Uncaught Type Error: t.addLayer is not a function

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: '&copy; <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>

error javascript json

Add your own answers!

Ask a Question

Get help from others!