Creating choropleth map with geojson polygon features- leaflet map

This post will demonstrate how to create a choropleth map of geojson polygon features in a leaflet map.

Our geojson features comprises of polygon features that represent electoral districts. Our goal is to use the choropleth to illustrate the fraction ratio of males in each district.


k

See source code below:
Document2-001

Then we create the choropleth map using the property density and add
 to the map. Replace the L.geojson(spaces.. above with the one below. 
We also add interactivity to the features.

L.geoJson(spaces, { style: function(feature, layer){ var fillColor, D = feature.properties.density; if ( D > 0.7) fillColor = ‘#FED976’; else if (D > 0.5) fillColor = ‘#e9b50b’; else if (D > 0.2) fillColor = ‘#ea7’; return {color: ‘black’, fillColor:fillColor,fillOpacity:0.8, weight: 1, dashArray: ‘5’}}, onEachFeature: function(feature, layer){ layer.bindPopup(feature.properties.density); }}).addTo(map);


j
 See live map of this example by clicking this link below:
https://htmlpreview.github.io/?https://github.com/mayotunde/geojsonpoints/blob/gh-pages/choropleth.html
Source code for example in the screenshot above:
Document1-001

Thank you for following our blog. 

Your comments and feedback are welcome.
Advertisements

2 responses to “Creating choropleth map with geojson polygon features- leaflet map

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s