3

I need to hatch polygons (loaded from a GeoJSON) in a leaflet webmap. Until now I have this:

//Style of each polygon
function style(feature){
    return {
        opacity : 1,
        color: 'black',
        fillOpacity: 0.7,
        fillColor: getColorCode(feature.properties.Status)};
    }

My problem is that I have the fillColor as background color and the hatched color should be grey. Since the fillColor is a property, I am not sure how to inject the hatched color. By this I mean something like this:

enter image description here

The difference is however that I have for example a yellow fillColor and that on top of that the "hatched color" should be blue.

Improve this question
1
  • 1
    There is no native Leaflet solution for this. There also seems to be no Leaflet plugin for this functionality in the form of Leaflet style. The closest to this is leaflet-polygon-fillPattern plugin. You could use this plugin and create on the fly canvas patterns to use as hatch pattern, but it would have to be done polygon by polygon. If you are interested, I can answer and add simple example of that.
    – TomazicM
    Commented Jan 9, 2022 at 19:39

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.