react-native-maps 1.18.2 → 1.18.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -302,43 +302,10 @@ render() {
|
|
|
302
302
|
}
|
|
303
303
|
```
|
|
304
304
|
|
|
305
|
-
### Customizing the map style
|
|
305
|
+
### Customizing the map style (Google Maps Only)
|
|
306
306
|
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
```jsx
|
|
310
|
-
// The generated json object
|
|
311
|
-
mapStyle = [ ... ]
|
|
312
|
-
|
|
313
|
-
render() {
|
|
314
|
-
return (
|
|
315
|
-
<MapView
|
|
316
|
-
region={this.state.region}
|
|
317
|
-
onRegionChange={this.onRegionChange}
|
|
318
|
-
customMapStyle={mapStyle}
|
|
319
|
-
/>
|
|
320
|
-
);
|
|
321
|
-
}
|
|
322
|
-
```
|
|
323
|
-
|
|
324
|
-
For iOS, in addition to providing the `mapStyle` you will need to do the following
|
|
325
|
-
|
|
326
|
-
```jsx
|
|
327
|
-
import MapView, { PROVIDER_GOOGLE } from 'react-native-maps'
|
|
328
|
-
|
|
329
|
-
// ...
|
|
330
|
-
|
|
331
|
-
<MapView
|
|
332
|
-
provider={PROVIDER_GOOGLE}
|
|
333
|
-
customMapStyle={MapStyle}
|
|
334
|
-
>
|
|
335
|
-
```
|
|
336
|
-
|
|
337
|
-
Then add the AirGoogleMaps directory:
|
|
338
|
-
|
|
339
|
-
https://github.com/react-native-maps/react-native-maps/blob/1e71a21f39e7b88554852951f773c731c94680c9/docs/installation.md#ios
|
|
340
|
-
|
|
341
|
-
An unofficial step-by-step guide is also available at https://gist.github.com/heron2014/e60fa003e9b117ce80d56bb1d5bfe9e0
|
|
307
|
+
The `<MapView provider="google" googleMapId="yourStyledMapId" />` Google Maps on iOS and Android supports styling via google cloud platform, the styled maps are published under a googleMapId, by simply setting the property googleMapId to the MapView you can use that styled map
|
|
308
|
+
more info here: [google map id](https://developers.google.com/maps/documentation/get-map-id)
|
|
342
309
|
|
|
343
310
|
### MapView Events
|
|
344
311
|
|
|
@@ -152,7 +152,7 @@ public class MapManager extends ViewGroupManager<MapView> {
|
|
|
152
152
|
|
|
153
153
|
@ReactProp(name = "initialCamera")
|
|
154
154
|
public void setInitialCamera(MapView view, ReadableMap initialCamera) {
|
|
155
|
-
|
|
155
|
+
view.setInitialCamera(initialCamera);
|
|
156
156
|
}
|
|
157
157
|
|
|
158
158
|
@ReactProp(name = "mapType")
|
|
@@ -96,19 +96,21 @@ public class MapView extends com.google.android.gms.maps.MapView implements Goog
|
|
|
96
96
|
private Boolean isMapLoaded = false;
|
|
97
97
|
private Integer loadingBackgroundColor = null;
|
|
98
98
|
private Integer loadingIndicatorColor = null;
|
|
99
|
-
private final int baseMapPadding = 50;
|
|
100
99
|
|
|
101
100
|
private LatLngBounds boundsToMove;
|
|
102
101
|
private CameraUpdate cameraToSet;
|
|
102
|
+
private boolean setPaddingDeferred = false;
|
|
103
103
|
private boolean showUserLocation = false;
|
|
104
104
|
private boolean handlePanDrag = false;
|
|
105
105
|
private boolean moveOnMarkerPress = true;
|
|
106
106
|
private boolean cacheEnabled = false;
|
|
107
107
|
private ReadableMap initialRegion;
|
|
108
108
|
private ReadableMap region;
|
|
109
|
+
private ReadableMap initialCamera;
|
|
109
110
|
private ReadableMap camera;
|
|
110
111
|
private String customMapStyleString;
|
|
111
112
|
private boolean initialRegionSet = false;
|
|
113
|
+
private boolean initialCameraSet = false;
|
|
112
114
|
private LatLngBounds cameraLastIdleBounds;
|
|
113
115
|
private int cameraMoveReason = 0;
|
|
114
116
|
private MapMarker selectedMarker;
|
|
@@ -536,13 +538,24 @@ public class MapView extends com.google.android.gms.maps.MapView implements Goog
|
|
|
536
538
|
}
|
|
537
539
|
}
|
|
538
540
|
|
|
541
|
+
public void setInitialCamera(ReadableMap initialCamera) {
|
|
542
|
+
this.initialCamera = initialCamera;
|
|
543
|
+
if (!initialCameraSet && map != null) {
|
|
544
|
+
moveToCamera(initialCamera);
|
|
545
|
+
initialCameraSet = true;
|
|
546
|
+
}
|
|
547
|
+
}
|
|
548
|
+
|
|
539
549
|
private void applyBridgedProps() {
|
|
540
550
|
if(initialRegion != null) {
|
|
541
551
|
moveToRegion(initialRegion);
|
|
542
552
|
initialRegionSet = true;
|
|
543
553
|
} else if(region != null) {
|
|
544
554
|
moveToRegion(region);
|
|
545
|
-
} else {
|
|
555
|
+
} else if (initialCamera != null) {
|
|
556
|
+
moveToCamera(initialCamera);
|
|
557
|
+
initialCameraSet = true;
|
|
558
|
+
} else if (camera != null) {
|
|
546
559
|
moveToCamera(camera);
|
|
547
560
|
}
|
|
548
561
|
if(customMapStyleString != null) {
|
|
@@ -845,6 +858,21 @@ public static CameraPosition cameraPositionFromMap(ReadableMap camera){
|
|
|
845
858
|
}
|
|
846
859
|
|
|
847
860
|
public void updateExtraData(Object extraData) {
|
|
861
|
+
if (setPaddingDeferred && super.getHeight() > 0 && super.getWidth() > 0) {
|
|
862
|
+
CameraUpdate cu = CameraUpdateFactory.newCameraPosition(map.getCameraPosition());
|
|
863
|
+
|
|
864
|
+
map.setPadding(edgeLeftPadding + baseLeftMapPadding,
|
|
865
|
+
edgeTopPadding + baseTopMapPadding,
|
|
866
|
+
edgeRightPadding + baseRightMapPadding,
|
|
867
|
+
edgeBottomPadding + baseBottomMapPadding);
|
|
868
|
+
map.moveCamera(cu);
|
|
869
|
+
|
|
870
|
+
// Move the google logo to the default base padding value.
|
|
871
|
+
map.setPadding(baseLeftMapPadding, baseTopMapPadding, baseRightMapPadding, baseBottomMapPadding);
|
|
872
|
+
|
|
873
|
+
setPaddingDeferred = false;
|
|
874
|
+
}
|
|
875
|
+
|
|
848
876
|
// if boundsToMove is not null, we now have the MapView's width/height, so we can apply
|
|
849
877
|
// a proper camera move
|
|
850
878
|
if (boundsToMove != null) {
|
|
@@ -922,10 +950,10 @@ public static CameraPosition cameraPositionFromMap(ReadableMap camera){
|
|
|
922
950
|
}
|
|
923
951
|
if (addedPosition) {
|
|
924
952
|
LatLngBounds bounds = builder.build();
|
|
925
|
-
CameraUpdate cu = CameraUpdateFactory.newLatLngBounds(bounds,
|
|
953
|
+
CameraUpdate cu = CameraUpdateFactory.newLatLngBounds(bounds, 0);
|
|
926
954
|
|
|
927
955
|
if (edgePadding != null) {
|
|
928
|
-
|
|
956
|
+
appendMapPadding(edgePadding.getInt("left"), edgePadding.getInt("top"),
|
|
929
957
|
edgePadding.getInt("right"), edgePadding.getInt("bottom"));
|
|
930
958
|
}
|
|
931
959
|
|
|
@@ -934,6 +962,8 @@ public static CameraPosition cameraPositionFromMap(ReadableMap camera){
|
|
|
934
962
|
} else {
|
|
935
963
|
map.moveCamera(cu);
|
|
936
964
|
}
|
|
965
|
+
// Move the google logo to the default base padding value.
|
|
966
|
+
map.setPadding(baseLeftMapPadding, baseTopMapPadding, baseRightMapPadding, baseBottomMapPadding);
|
|
937
967
|
}
|
|
938
968
|
}
|
|
939
969
|
|
|
@@ -964,10 +994,10 @@ public static CameraPosition cameraPositionFromMap(ReadableMap camera){
|
|
|
964
994
|
|
|
965
995
|
if (addedPosition) {
|
|
966
996
|
LatLngBounds bounds = builder.build();
|
|
967
|
-
CameraUpdate cu = CameraUpdateFactory.newLatLngBounds(bounds,
|
|
997
|
+
CameraUpdate cu = CameraUpdateFactory.newLatLngBounds(bounds, 0);
|
|
968
998
|
|
|
969
999
|
if (edgePadding != null) {
|
|
970
|
-
|
|
1000
|
+
appendMapPadding(edgePadding.getInt("left"), edgePadding.getInt("top"),
|
|
971
1001
|
edgePadding.getInt("right"), edgePadding.getInt("bottom"));
|
|
972
1002
|
}
|
|
973
1003
|
|
|
@@ -976,20 +1006,54 @@ public static CameraPosition cameraPositionFromMap(ReadableMap camera){
|
|
|
976
1006
|
} else {
|
|
977
1007
|
map.moveCamera(cu);
|
|
978
1008
|
}
|
|
1009
|
+
// Move the google logo to the default base padding value.
|
|
1010
|
+
map.setPadding(baseLeftMapPadding, baseTopMapPadding, baseRightMapPadding, baseBottomMapPadding);
|
|
979
1011
|
}
|
|
980
1012
|
}
|
|
981
1013
|
|
|
1014
|
+
// padding configured by 'mapPadding' property
|
|
982
1015
|
int baseLeftMapPadding;
|
|
983
1016
|
int baseRightMapPadding;
|
|
984
1017
|
int baseTopMapPadding;
|
|
985
1018
|
int baseBottomMapPadding;
|
|
1019
|
+
// extra padding specified by 'edgePadding' option of fitToElements/fitToSuppliedMarkers/fitToCoordinates
|
|
1020
|
+
int edgeLeftPadding;
|
|
1021
|
+
int edgeRightPadding;
|
|
1022
|
+
int edgeTopPadding;
|
|
1023
|
+
int edgeBottomPadding;
|
|
986
1024
|
|
|
987
1025
|
public void applyBaseMapPadding(int left, int top, int right, int bottom){
|
|
988
|
-
|
|
1026
|
+
if (super.getHeight() <= 0 || super.getWidth() <= 0) {
|
|
1027
|
+
// the map is not laid out yet and calling setPadding() now has no effect
|
|
1028
|
+
baseLeftMapPadding = left;
|
|
1029
|
+
baseRightMapPadding = right;
|
|
1030
|
+
baseTopMapPadding = top;
|
|
1031
|
+
baseBottomMapPadding = bottom;
|
|
1032
|
+
setPaddingDeferred = true;
|
|
1033
|
+
return;
|
|
1034
|
+
}
|
|
1035
|
+
|
|
1036
|
+
// retrieve current camera with current edge paddings configured
|
|
1037
|
+
map.setPadding(edgeLeftPadding + baseLeftMapPadding,
|
|
1038
|
+
edgeTopPadding + baseTopMapPadding,
|
|
1039
|
+
edgeRightPadding + baseRightMapPadding,
|
|
1040
|
+
edgeBottomPadding + baseBottomMapPadding);
|
|
1041
|
+
CameraUpdate cu = CameraUpdateFactory.newCameraPosition(map.getCameraPosition());
|
|
1042
|
+
|
|
989
1043
|
baseLeftMapPadding = left;
|
|
990
1044
|
baseRightMapPadding = right;
|
|
991
1045
|
baseTopMapPadding = top;
|
|
992
1046
|
baseBottomMapPadding = bottom;
|
|
1047
|
+
|
|
1048
|
+
// apply base paddings and restore center position of the map
|
|
1049
|
+
map.setPadding(edgeLeftPadding + left,
|
|
1050
|
+
edgeTopPadding + top,
|
|
1051
|
+
edgeRightPadding + right,
|
|
1052
|
+
edgeBottomPadding + bottom);
|
|
1053
|
+
map.moveCamera(cu);
|
|
1054
|
+
|
|
1055
|
+
// Move the google logo to the default base padding value.
|
|
1056
|
+
map.setPadding(left, top, right, bottom);
|
|
993
1057
|
}
|
|
994
1058
|
|
|
995
1059
|
public void fitToCoordinates(ReadableArray coordinatesArray, ReadableMap edgePadding,
|
|
@@ -1006,7 +1070,7 @@ public static CameraPosition cameraPositionFromMap(ReadableMap camera){
|
|
|
1006
1070
|
}
|
|
1007
1071
|
|
|
1008
1072
|
LatLngBounds bounds = builder.build();
|
|
1009
|
-
CameraUpdate cu = CameraUpdateFactory.newLatLngBounds(bounds,
|
|
1073
|
+
CameraUpdate cu = CameraUpdateFactory.newLatLngBounds(bounds, 0);
|
|
1010
1074
|
|
|
1011
1075
|
if (edgePadding != null) {
|
|
1012
1076
|
appendMapPadding(edgePadding.getInt("left"), edgePadding.getInt("top"), edgePadding.getInt("right"), edgePadding.getInt("bottom"));
|
|
@@ -1022,21 +1086,17 @@ public static CameraPosition cameraPositionFromMap(ReadableMap camera){
|
|
|
1022
1086
|
}
|
|
1023
1087
|
|
|
1024
1088
|
private void appendMapPadding(int iLeft,int iTop, int iRight, int iBottom) {
|
|
1025
|
-
int left;
|
|
1026
|
-
int top;
|
|
1027
|
-
int right;
|
|
1028
|
-
int bottom;
|
|
1029
1089
|
double density = getResources().getDisplayMetrics().density;
|
|
1030
1090
|
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1091
|
+
edgeLeftPadding = (int) (iLeft * density);
|
|
1092
|
+
edgeTopPadding = (int) (iTop * density);
|
|
1093
|
+
edgeRightPadding = (int) (iRight * density);
|
|
1094
|
+
edgeBottomPadding = (int) (iBottom * density);
|
|
1035
1095
|
|
|
1036
|
-
map.setPadding(
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
|
|
1096
|
+
map.setPadding(edgeLeftPadding + baseLeftMapPadding,
|
|
1097
|
+
edgeTopPadding + baseTopMapPadding,
|
|
1098
|
+
edgeRightPadding + baseRightMapPadding,
|
|
1099
|
+
edgeBottomPadding + baseBottomMapPadding);
|
|
1040
1100
|
}
|
|
1041
1101
|
|
|
1042
1102
|
public double[][] getMapBoundaries() {
|
|
@@ -272,7 +272,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
|
|
|
272
272
|
@"latitude": @(marker.coordinate.latitude),
|
|
273
273
|
@"longitude": @(marker.coordinate.longitude)
|
|
274
274
|
},
|
|
275
|
-
@"
|
|
275
|
+
@"position": @{
|
|
276
276
|
@"x": @(touchPointReal.x),
|
|
277
277
|
@"y": @(touchPointReal.y),
|
|
278
278
|
}
|
package/package.json
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"author": "Leland Richardson <leland.m.richardson@gmail.com>",
|
|
7
7
|
"homepage": "https://github.com/react-native-maps/react-native-maps#readme",
|
|
8
|
-
"version": "1.18.
|
|
8
|
+
"version": "1.18.4",
|
|
9
9
|
"license": "MIT",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"lint": "eslint . --max-warnings 0",
|