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.

Sign up for GitHub

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

Jump to bottom

Geojson zoom on click fixes #1349

Merged
merged 4 commits into from
Jun 7, 2020
Merged

Geojson zoom on click fixes #1349

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
bfa9a2b
Only zoom on click if method is available
Conengmo Jun 5, 2020
e442d52
Add zoom_on_click parameter
Conengmo Jun 5, 2020
ef68e20
Update GeoJSON_and_choropleth.ipynb
Conengmo Jun 6, 2020
e83eb16
Update GeoJSON_and_choropleth.ipynb
Conengmo Jun 6, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
218 changes: 95 additions & 123 deletions examples/GeoJSON_and_choropleth.ipynb
View file
Open in desktop

Large diffs are not rendered by default.

12 changes: 10 additions & 2 deletions folium/features.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -354,6 +354,8 @@ class GeoJson(Layer):
embed: bool, default True
Whether to embed the data in the html file or not. Note that disabling
embedding is only supported if you provide a file link or URL.
zoom_on_click: bool, default False
Set to True to enable zooming in on a geometry when clicking on it.

Examples
--------
Expand Down Expand Up @@ -409,9 +411,13 @@ class GeoJson(Layer):
e.target.setStyle({{ this.get_name() }}_highlighter(e.target.feature));
},
{%- endif %}
{%- if this.zoom_on_click %}
click: function(e) {
{{ this.parent_map.get_name() }}.fitBounds(e.target.getBounds());
if (typeof e.target.getBounds === 'function') {
{{ this.parent_map.get_name() }}.fitBounds(e.target.getBounds());
}
Copy link
Contributor

@jtbaker jtbaker Jun 5, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here, how about to handle zooming for point geometries as well? I'm not sure about best generalized options for the .fitBounds() method, it supports both padding and maxZoom options.

else {
    const targetLatLng = e.target.getLatLng()
    const bounds = L.latLngBounds([targetLatLng, targetLatLng])
    {{ this.parent_map.get_name() }}.fitBounds(bounds, {padding: [5,5], maxZoom: 8});
}

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think your code is fine but I'd rather not introduce more fragility here. This may work for point geometries but I'm unsure what new bugs it might introduce. I'll just merge the PR as is, let's consider any new functionality separately.

}
{%- endif %}
});
};
var {{ this.get_name() }} = L.geoJson(null, {
Expand All @@ -438,7 +444,8 @@ class GeoJson(Layer):

def __init__(self, data, style_function=None, highlight_function=None, # noqa
name=None, overlay=True, control=True, show=True,
smooth_factor=None, tooltip=None, embed=True, popup=None):
smooth_factor=None, tooltip=None, embed=True, popup=None,
zoom_on_click=False):
super(GeoJson, self).__init__(name=name, overlay=overlay,
control=control, show=show)
self._name = 'GeoJson'
Expand All @@ -449,6 +456,7 @@ def __init__(self, data, style_function=None, highlight_function=None, # noqa
self.smooth_factor = smooth_factor
self.style = style_function is not None
self.highlight = highlight_function is not None
self.zoom_on_click = zoom_on_click

self.data = self.process_data(data)

Expand Down