diff --git a/docs/Components.md b/docs/Components.md
index 3074648a..53eefaf1 100644
--- a/docs/Components.md
+++ b/docs/Components.md
@@ -81,6 +81,7 @@ This is the top-level component that must be mounted for children ones to be ren
- `className: string` (optional): className property of the `
` container for the map.
- `maxBounds: bounds` (optional)
- `style: object` (optional): style property of the `
` container for the map.
+- `useFlyTo: boolean` (optional): boolean to control whether to use flyTo functions for bounds and center. If false `map.fitBounds` and `map.setView` will be used. If true `map.flyToBounds` and `map.flyTo` will be used. Defaults to false.
- `zoom: number` (optional)
**Other properties**
diff --git a/src/Map.js b/src/Map.js
index beff5cf4..f256a5ae 100644
--- a/src/Map.js
+++ b/src/Map.js
@@ -38,11 +38,13 @@ export default class Map extends MapComponent {
maxZoom: PropTypes.number,
minZoom: PropTypes.number,
style: PropTypes.object,
+ useFlyTo: PropTypes.bool,
zoom: PropTypes.number,
};
static defaultProps = {
animate: false,
+ useFlyTo: false,
};
static childContextTypes = {
@@ -66,20 +68,31 @@ export default class Map extends MapComponent {
}
componentDidUpdate (prevProps: Object) {
- const { bounds, boundsOptions, center, maxBounds, zoom, animate } = this.props
+ const { animate, bounds, boundsOptions, center, maxBounds, useFlyTo, zoom } = this.props
+
if (center && this.shouldUpdateCenter(center, prevProps.center)) {
- this.leafletElement.setView(center, zoom, {animate})
+ if (useFlyTo) {
+ this.leafletElement.flyTo(center, zoom, {animate})
+ } else {
+ this.leafletElement.setView(center, zoom, {animate})
+ }
} else if (zoom && zoom !== prevProps.zoom) {
this.leafletElement.setZoom(zoom)
}
+
if (maxBounds && this.shouldUpdateBounds(maxBounds, prevProps.maxBounds)) {
this.leafletElement.setMaxBounds(maxBounds)
}
+
if (bounds && (
this.shouldUpdateBounds(bounds, prevProps.bounds) ||
boundsOptions !== prevProps.boundsOptions
)) {
- this.leafletElement.fitBounds(bounds, boundsOptions)
+ if (useFlyTo) {
+ this.leafletElement.flyToBounds(bounds, boundsOptions)
+ } else {
+ this.leafletElement.fitBounds(bounds, boundsOptions)
+ }
}
}