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.
Aucun commentaire:
Enregistrer un commentaire