diff --git a/android/src/main/java/com/rnmaps/maps/MapManager.java b/android/src/main/java/com/rnmaps/maps/MapManager.java index 4f7dfd6ab..8e63a14c2 100644 --- a/android/src/main/java/com/rnmaps/maps/MapManager.java +++ b/android/src/main/java/com/rnmaps/maps/MapManager.java @@ -419,7 +419,7 @@ public void receiveCommand(@NonNull MapView view, String commandId, @Nullable Re if (args == null) { break; } - view.fitToCoordinates(args.getArray(0), args.getMap(1), args.getBoolean(2)); + view.fitToCoordinates(args.getArray(0), args.getMap(1), args.getBoolean(2),args.getInt(3)); break; case "setMapBoundaries": diff --git a/android/src/main/java/com/rnmaps/maps/MapView.java b/android/src/main/java/com/rnmaps/maps/MapView.java index b3f9b9035..58967c072 100644 --- a/android/src/main/java/com/rnmaps/maps/MapView.java +++ b/android/src/main/java/com/rnmaps/maps/MapView.java @@ -1011,7 +1011,7 @@ public void applyBaseMapPadding(int left, int top, int right, int bottom){ } public void fitToCoordinates(ReadableArray coordinatesArray, ReadableMap edgePadding, - boolean animated) { + boolean animated,int duration) { if (map == null) return; LatLngBounds.Builder builder = new LatLngBounds.Builder(); @@ -1031,7 +1031,7 @@ public void fitToCoordinates(ReadableArray coordinatesArray, ReadableMap edgePad } if (animated) { - map.animateCamera(cu); + map.animateCamera(cu,duration,null); } else { map.moveCamera(cu); } diff --git a/ios/AirGoogleMaps/AIRGoogleMapManager.m b/ios/AirGoogleMaps/AIRGoogleMapManager.m index 1a88842f9..a219d2692 100644 --- a/ios/AirGoogleMaps/AIRGoogleMapManager.m +++ b/ios/AirGoogleMaps/AIRGoogleMapManager.m @@ -303,7 +303,8 @@ - (UIView *)view RCT_EXPORT_METHOD(fitToCoordinates:(nonnull NSNumber *)reactTag coordinates:(nonnull NSArray *)coordinates edgePadding:(nonnull NSDictionary *)edgePadding - animated:(BOOL)animated) + animated:(BOOL)animated + duration:(NSInteger)duration) { [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary *viewRegistry) { id view = viewRegistry[reactTag]; @@ -327,7 +328,10 @@ - (UIView *)view GMSCameraUpdate *cameraUpdate = [GMSCameraUpdate fitBounds:bounds withEdgeInsets:UIEdgeInsetsMake(top, left, bottom, right)]; if (animated) { - [mapView animateWithCameraUpdate: cameraUpdate]; + [CATransaction begin]; + [CATransaction setAnimationDuration:duration / 1000.0]; // Convert milliseconds to seconds + [mapView animateWithCameraUpdate:cameraUpdate]; + [CATransaction commit]; } else { [mapView moveCamera: cameraUpdate]; } diff --git a/lib/Geojson.d.ts b/lib/Geojson.d.ts index c6b20a3d5..87efdc8f0 100644 --- a/lib/Geojson.d.ts +++ b/lib/Geojson.d.ts @@ -5,6 +5,33 @@ import { MapPolygonProps as PolygonProps } from './MapPolygon'; import { MapPolylineProps as PolylineProps } from './MapPolyline'; import { LatLng } from './sharedTypes'; export type GeojsonProps = { + /** + * Sets the anchor point for the marker. + * The anchor specifies the point in the icon image that is anchored to the marker's position on the Earth's surface. + * + * The anchor point is specified in the continuous space [0.0, 1.0] x [0.0, 1.0], + * where (0, 0) is the top-left corner of the image, and (1, 1) is the bottom-right corner. + * + * The anchoring point in a W x H image is the nearest discrete grid point in a (W + 1) x (H + 1) grid, obtained by scaling the then rounding. + * For example, in a 4 x 2 image, the anchor point (0.7, 0.6) resolves to the grid point at (3, 1). + * + * @default {x: 0.5, y: 1.0} + * @platform iOS: Google Maps only. For Apple Maps, see the `centerOffset` prop + * @platform Android: Supported + */ + anchor?: MarkerProps['anchor']; + /** + * The offset (in points) at which to display the annotation view. + * + * By default, the center point of an annotation view is placed at the coordinate point of the associated annotation. + * + * Positive offset values move the annotation view down and to the right, while negative values move it up and to the left. + * + * @default {x: 0.0, y: 0.0} + * @platform iOS: Apple Maps only. For Google Maps, see the `anchor` prop + * @platform Android: Not supported. See see the `anchor` prop + */ + centerOffset?: MarkerProps['centerOffset']; /** * The pincolor used on markers * @@ -55,7 +82,7 @@ export type GeojsonProps = { * @platform iOS: Supported * @platform Android: Supported */ - lineDashPattern?: PolylineProps['lineDashPattern']; + lineDashPattern?: PolygonProps['lineDashPattern'] | PolylineProps['lineDashPattern']; /** * The offset (in points) at which to start drawing the dash pattern. * diff --git a/lib/Geojson.js b/lib/Geojson.js index 5e104d8ac..1aa085940 100644 --- a/lib/Geojson.js +++ b/lib/Geojson.js @@ -31,7 +31,7 @@ const MapMarker_1 = __importDefault(require("./MapMarker")); const MapPolyline_1 = __importDefault(require("./MapPolyline")); const MapPolygon_1 = __importDefault(require("./MapPolygon")); const Geojson = (props) => { - const { geojson, strokeColor, fillColor, strokeWidth, color, title, image, zIndex, onPress, lineCap, lineJoin, tappable, tracksViewChanges, miterLimit, lineDashPhase, lineDashPattern, markerComponent, } = props; + const { anchor, centerOffset, geojson, strokeColor, fillColor, strokeWidth, color, title, image, zIndex, onPress, lineCap, lineJoin, tappable, tracksViewChanges, miterLimit, lineDashPhase, lineDashPattern, markerComponent, } = props; const pointOverlays = makePointOverlays(geojson.features); const lineOverlays = makeLineOverlays(geojson.features); const polygonOverlays = makePolygonOverlays(geojson.features); @@ -39,7 +39,7 @@ const Geojson = (props) => { {pointOverlays.map((overlay, index) => { const markerColor = getColor(color, overlay, 'marker-color'); const pointOverlayTracksViewChanges = overlay.feature.properties?.tracksViewChanges || tracksViewChanges; - return ( onPress && onPress(overlay)}> + return ( onPress && onPress(overlay)}> {markerComponent} ); })} @@ -52,7 +52,7 @@ const Geojson = (props) => { const polygonFillColor = getColor(fillColor, overlay, 'fill'); const lineStrokeColor = getColor(strokeColor, overlay, 'stroke'); const lineStrokeWidth = getStrokeWidth(strokeWidth, overlay); - return ( onPress && onPress(overlay)} zIndex={zIndex}/>); + return ( onPress && onPress(overlay)} zIndex={zIndex}/>); })} ); }; diff --git a/lib/MapPolygon.d.ts b/lib/MapPolygon.d.ts index add7592d2..f1189e7c4 100644 --- a/lib/MapPolygon.d.ts +++ b/lib/MapPolygon.d.ts @@ -51,7 +51,7 @@ export type MapPolygonProps = ViewProps & { * followed by the first gap length, followed by the second line segment length, and so on. * * @platform iOS: Apple Maps only - * @platform Android: Not supported + * @platform Android: Supported */ lineDashPattern?: number[]; /** diff --git a/lib/MapPolyline.d.ts b/lib/MapPolyline.d.ts index 2b233febe..358c3c42f 100644 --- a/lib/MapPolyline.d.ts +++ b/lib/MapPolyline.d.ts @@ -139,7 +139,7 @@ export declare class MapPolyline extends React.Component { } declare const _default: typeof MapPolyline; export default _default; -type PolylinePressEvent = NativeSyntheticEvent<{ +export type PolylinePressEvent = NativeSyntheticEvent<{ action: 'polyline-press'; /** * @platform iOS: Google Maps diff --git a/lib/MapView.js b/lib/MapView.js index 5f661a4c9..54ced6c17 100644 --- a/lib/MapView.js +++ b/lib/MapView.js @@ -134,8 +134,8 @@ class MapView extends React.Component { } fitToCoordinates(coordinates = [], options = {}) { if (this.map.current) { - const { edgePadding = { top: 0, right: 0, bottom: 0, left: 0 }, animated = true, } = options; - MapViewNativeComponent_1.Commands.fitToCoordinates(this.map.current, coordinates, edgePadding, animated); + const { edgePadding = { top: 0, right: 0, bottom: 0, left: 0 }, animated = true, duration = 400, } = options; + MapViewNativeComponent_1.Commands.fitToCoordinates(this.map.current, coordinates, edgePadding, animated, duration); } } /** diff --git a/lib/MapView.types.d.ts b/lib/MapView.types.d.ts index ac232d880..1e9508c4f 100644 --- a/lib/MapView.types.d.ts +++ b/lib/MapView.types.d.ts @@ -122,6 +122,7 @@ export type ChangeEvent = NativeSyntheticEvent<{ export type FitToOptions = { edgePadding?: EdgePadding; animated?: boolean; + duration?: number; }; export type BoundingBox = { northEast: LatLng; diff --git a/lib/MapViewNativeComponent.d.ts b/lib/MapViewNativeComponent.d.ts index 558a6443e..fb1f0d579 100644 --- a/lib/MapViewNativeComponent.d.ts +++ b/lib/MapViewNativeComponent.d.ts @@ -10,7 +10,7 @@ interface NativeCommands { animateCamera: (viewRef: NonNullable['current']>, camera: Partial, duration: number) => void; fitToElements: (viewRef: NonNullable['current']>, edgePadding: EdgePadding, animated: boolean) => void; fitToSuppliedMarkers: (viewRef: NonNullable['current']>, markers: string[], edgePadding: EdgePadding, animated: boolean) => void; - fitToCoordinates: (viewRef: NonNullable['current']>, coordinates: LatLng[], edgePadding: EdgePadding, animated: boolean) => void; + fitToCoordinates: (viewRef: NonNullable['current']>, coordinates: LatLng[], edgePadding: EdgePadding, animated: boolean, duration: number) => void; setMapBoundaries: (viewRef: NonNullable['current']>, northEast: LatLng, southWest: LatLng) => void; setIndoorActiveLevelIndex: (viewRef: NonNullable['current']>, activeLevelIndex: number) => void; scrollMap: (viewRef: NonNullable['current']>, xPixel: number, YPixel: number, animated: boolean) => void; diff --git a/src/MapView.tsx b/src/MapView.tsx index d4b41608c..d5c82eb77 100644 --- a/src/MapView.tsx +++ b/src/MapView.tsx @@ -765,7 +765,7 @@ class MapView extends React.Component { onMapReady(); } }); - }, 100) + }, 100); } setNativeProps(props: Partial) { @@ -774,7 +774,7 @@ class MapView extends React.Component { } private _onMapReady() { - if(this.callMapReady) { + if (this.callMapReady) { clearTimeout(this.mapReadytimerId); const {onMapReady} = this.props; this.setState({isReady: true}, () => { @@ -867,6 +867,7 @@ class MapView extends React.Component { const { edgePadding = {top: 0, right: 0, bottom: 0, left: 0}, animated = true, + duration = 400, } = options; Commands.fitToCoordinates( @@ -874,6 +875,7 @@ class MapView extends React.Component { coordinates, edgePadding, animated, + duration, ); } } diff --git a/src/MapView.types.ts b/src/MapView.types.ts index 33c058ae6..50114b80c 100644 --- a/src/MapView.types.ts +++ b/src/MapView.types.ts @@ -156,6 +156,7 @@ export type ChangeEvent = NativeSyntheticEvent<{ export type FitToOptions = { edgePadding?: EdgePadding; animated?: boolean; + duration?: number; }; export type BoundingBox = {northEast: LatLng; southWest: LatLng}; diff --git a/src/MapViewNativeComponent.ts b/src/MapViewNativeComponent.ts index a6ccae90d..a88b78bff 100644 --- a/src/MapViewNativeComponent.ts +++ b/src/MapViewNativeComponent.ts @@ -54,6 +54,7 @@ interface NativeCommands { coordinates: LatLng[], edgePadding: EdgePadding, animated: boolean, + duration: number, ) => void; setMapBoundaries: (