Skip to content

Styling points/circles differently from Polygons #280

Open
@SamG92

Description

Hi there,

I'm loading a protobuf layer of objects containing both polygons and points/circles.
At first load, points/circles are not displayed when creating the vectorGrid using:

vectorGrid = L.vectorGrid.protobuf("https://url/{z}/{x}/{y}.pbf", {
rendererFactory: L.svg.tile,
interactive: true,
minZoom: 15,
maxZoom: 19,
getFeatureId: (f) => {
return f.properties.id;
},
vectorTileLayerStyles: {
item: {
weight: 1,
fill: true,
fillColor: "LightBlue",
fillOpacity: 0.4,
color: 'Gray',
opacity: 0.5,
},
},
})

Capture d’écran 2023-02-03 à 11 06 03

But once the element styles are modified when hovering with mouseover/out event, the circles get styled like polygons and do appear on zoom change (not at the moment they are hovered).
Capture d’écran 2023-02-03 à 11 06 17

I use the following code to handle events:

vectorGrid.on('mouseover', function (e) {
var id = e.layer.properties.id
vectorGridParcelles.setFeatureStyle(id, {
weight: 2,
fillColor: '#999999',
fillOpacity: 1,
fill: true,
color: 'Black',
})
})
vectorGrid.on('mouseout', function (e) {
var id = e.layer.properties.idu
vectorGridParcelles.setFeatureStyle(id, {
weight: 1,
fill: true,
fillColor: "LightBlue",
fillOpacity: 0.4,
color: 'Gray',
opacity: 0.5,
})
})

I read the document which talks about having different set of L.Path options but I can't make it work.
Is there a way to handle that and not display points/circles?

Thanks a lot!

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions