mercredi 25 juillet 2018

"this.update is not a function" following Leaflet JS tutorial

I am copying this tutorial on the Leaflet JS website: https://leafletjs.com/examples/choropleth/

The code for adding control is this:

var info = L.control();

info.onAdd = function(mymap) {
//Create a div with a class of info
      this._div = L.DomUtil.create('div', 'info');
      this.update();
      return this._div;
};

But when I do this, I get the following error:
Uncaught TypeError: this.update is not a function.

Here is how I incorporated that code from the tutorial into my code:

var mymap = L.map('mapid').setView([41.850033, -87.6500523], 3.2);

L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
            attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
            maxZoom: 15,
            id: 'mapbox.mapbox-streets-v7',
            accessToken: 'pk.eyJ1IjoiYWxsYW5yaW1iYW4iLCJhIjoiZWEyYTc5NDhmZjdmYjQzM2I3MDdkN2I4OTQ3MjQyNWEifQ.U2GPM8lv7x--qHhbjNo5Ug'
        }).addTo(mymap);

        //control that shows county info
        var info = L.control();

        info.onAdd = function (mymap) {
            //Create a div with a class of info
            this._div = L.DomUtil.create('div', 'info');
            this.update();
            return this._div;
        };

        //method that will update the control based on feature properties passed

        info.udpate = function (props) {
            this._div.innerHTML = '<h4>US Election Result</h4>' + (props ? '<b>' + props.NAME + '</b>' : 'Hover over a county');
        };

        info.addTo(mymap);  

You can see my webpage and the error in the source code here: https://sushirittoman.github.io/maps/counties_project/index.html

Please help. Thank you.




Aucun commentaire:

Enregistrer un commentaire