Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add event coordinates to GeoJSON message #1228

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

lopezvoliver
Copy link
Contributor

@lopezvoliver lopezvoliver commented Aug 25, 2024

This pull request adds event coordinates to the message sent on click and mouseover on GeoJSON.ts.

For example, here we can open a popup on the feature clicked by the user (#1227):

ipyleaflet-popup-click-location

from ipyleaflet import Map, GeoJSON, Popup
from ipywidgets import HTML

# Create a map centered at a specific location
m = Map(center=(51.55, -0.09), zoom=10)

# Example GeoJSON data with two polygons
geojson_data = {
    "type": "FeatureCollection",
    "features": [
        {
            "type": "Feature",
            "properties": {
                "name": "Polygon A",
                "popup_content": "This is Polygon A."
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [[
                    [-0.1, 51.5],
                    [-0.1, 51.6],
                    [-0.05, 51.6],
                    [-0.05, 51.5],
                    [-0.1, 51.5]
                ]]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "name": "Polygon B",
                "popup_content": "This is Polygon B."
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [[
                    [-0.08, 51.48],
                    [-0.08, 51.52],
                    [-0.03, 51.52],
                    [-0.03, 51.48],
                    [-0.08, 51.48]
                ]]
            }
        }
    ]
}

# Create a GeoJSON layer
geojson_layer = GeoJSON(data=geojson_data)

# Popup
popup = Popup(
    close_button=True,
    auto_close=False,
    auto_pan=False,
    close_on_escape_key=False
)

def on_click_handler(**kwargs):
    properties = kwargs["properties"]
    popup.child = HTML(properties["popup_content"])
    popup.location = kwargs["coordinates"]  # This is what this PR provides.
    popup.open_popup()

geojson_layer.on_click(on_click_handler)

m.add(popup)
m.add(geojson_layer)

@giswqs
Copy link
Contributor

giswqs commented Aug 25, 2024

This is awesome! Thank you

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants