2

Please pardon my ignorance in advance, but is it possible to style a layer(polygon) using the plugin leaflet-omnivore? All of the examples I've encountered are using the MapBox API

I have the layer rendering default colors with the following line, omnivore.topojson('./data/bmw_parcels_4326.json').addTo(map);

Something like the Leaflet tutorial example as follows would be nice. I just can't figure out how to call the function:

function getColor(d) {
    return d > 1000 ? '#800026' :
           d > 500  ? '#BD0026' :
           d > 200  ? '#E31A1C' :
           d > 100  ? '#FC4E2A' :
           d > 50   ? '#FD8D3C' :
           d > 20   ? '#FEB24C' :
           d > 10   ? '#FED976' :
                      '#FFEDA0';
}

function style(feature) {
return {
    fillColor: getColor(feature.properties.density),
    weight: 2,
    opacity: 1,
    color: 'white',
    dashArray: '3',
    fillOpacity: 0.7
};
}

L.geoJson(statesData, {style: style}).addTo(map);
5

Read the documentation of Leaflet-omnivore here: https://github.com/mapbox/leaflet-omnivore You can pass a custom layer as a third parameter of omnivore.topojson(). By default, it is simply L.geoJson(). In your case, you should use something like this:

var customLayer = L.geoJson(null, {style: style});
omnivore.topojson('./data/bmw_parcels_4326.json', null, customLayer).addTo(map);

The other option is L.GeoJSON.setStyle(style) function called on your omnivore layer:

var layer = omnivore.topojson('./data/bmw_parcels_4326.json');
layer.setStyle(style);
layer.addTo(map);

Not tested, hope this helps.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.