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 © <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.
I don't even know what it is, but I figured out.
The tutorial page also show the final result , which is using exactly the same code.
And I started debugging, and got it.
You simply misspelt the word...
info.udpate → info.update
For your information.(just in case)
In this case, 'this' means 'info'.
So you just called own function in that part.(the name update is not important.)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.