@lugg/maps 0.2.0-alpha.8 → 0.2.0-alpha.9
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.
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { Children, Component, isValidElement, useEffect, useRef } from 'react';
|
|
3
|
+
import { Children, Component, isValidElement, useEffect, useRef, useState } from 'react';
|
|
4
4
|
import { View } from 'react-native';
|
|
5
5
|
import { Map, useMap } from '@vis.gl/react-google-maps';
|
|
6
6
|
import { Marker } from "./components/Marker.web.js";
|
|
@@ -26,16 +26,58 @@ const createSyntheticEvent = nativeEvent => ({
|
|
|
26
26
|
timeStamp: Date.now(),
|
|
27
27
|
type: ''
|
|
28
28
|
});
|
|
29
|
+
const userLocationDotStyle = {
|
|
30
|
+
width: 16,
|
|
31
|
+
height: 16,
|
|
32
|
+
backgroundColor: '#4285F4',
|
|
33
|
+
border: '2px solid white',
|
|
34
|
+
borderRadius: '50%',
|
|
35
|
+
boxShadow: '0 1px 4px rgba(0,0,0,0.3)'
|
|
36
|
+
};
|
|
37
|
+
function UserLocationMarker({
|
|
38
|
+
enabled
|
|
39
|
+
}) {
|
|
40
|
+
const [coordinate, setCoordinate] = useState(null);
|
|
41
|
+
useEffect(() => {
|
|
42
|
+
if (!enabled) {
|
|
43
|
+
setCoordinate(null);
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
let watchId = null;
|
|
47
|
+
const updateLocation = position => {
|
|
48
|
+
setCoordinate({
|
|
49
|
+
latitude: position.coords.latitude,
|
|
50
|
+
longitude: position.coords.longitude
|
|
51
|
+
});
|
|
52
|
+
};
|
|
53
|
+
navigator.geolocation.getCurrentPosition(updateLocation, () => {});
|
|
54
|
+
watchId = navigator.geolocation.watchPosition(updateLocation, () => {});
|
|
55
|
+
return () => {
|
|
56
|
+
if (watchId !== null) {
|
|
57
|
+
navigator.geolocation.clearWatch(watchId);
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
}, [enabled]);
|
|
61
|
+
if (!coordinate) return null;
|
|
62
|
+
return /*#__PURE__*/_jsx(Marker, {
|
|
63
|
+
coordinate: coordinate,
|
|
64
|
+
anchor: {
|
|
65
|
+
x: 0.5,
|
|
66
|
+
y: 0.5
|
|
67
|
+
},
|
|
68
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
69
|
+
style: userLocationDotStyle
|
|
70
|
+
})
|
|
71
|
+
});
|
|
72
|
+
}
|
|
29
73
|
function MapController({
|
|
30
74
|
onMapReady,
|
|
31
75
|
onCameraMove,
|
|
32
76
|
onCameraIdle,
|
|
33
|
-
onReady
|
|
34
|
-
userLocationEnabled
|
|
77
|
+
onReady
|
|
35
78
|
}) {
|
|
36
79
|
const map = useMap();
|
|
37
80
|
const readyFired = useRef(false);
|
|
38
|
-
const userLocationMarker = useRef(null);
|
|
39
81
|
useEffect(() => {
|
|
40
82
|
if (!map) return;
|
|
41
83
|
onMapReady(map);
|
|
@@ -44,53 +86,6 @@ function MapController({
|
|
|
44
86
|
onReady?.();
|
|
45
87
|
}
|
|
46
88
|
}, [map, onMapReady, onReady]);
|
|
47
|
-
useEffect(() => {
|
|
48
|
-
if (!map || !userLocationEnabled) {
|
|
49
|
-
if (userLocationMarker.current) {
|
|
50
|
-
userLocationMarker.current.map = null;
|
|
51
|
-
userLocationMarker.current = null;
|
|
52
|
-
}
|
|
53
|
-
return;
|
|
54
|
-
}
|
|
55
|
-
let watchId = null;
|
|
56
|
-
const updateLocation = position => {
|
|
57
|
-
const {
|
|
58
|
-
latitude,
|
|
59
|
-
longitude
|
|
60
|
-
} = position.coords;
|
|
61
|
-
const pos = {
|
|
62
|
-
lat: latitude,
|
|
63
|
-
lng: longitude
|
|
64
|
-
};
|
|
65
|
-
if (!userLocationMarker.current) {
|
|
66
|
-
const dot = document.createElement('div');
|
|
67
|
-
dot.style.width = '16px';
|
|
68
|
-
dot.style.height = '16px';
|
|
69
|
-
dot.style.backgroundColor = '#4285F4';
|
|
70
|
-
dot.style.border = '2px solid white';
|
|
71
|
-
dot.style.borderRadius = '50%';
|
|
72
|
-
dot.style.boxShadow = '0 1px 4px rgba(0,0,0,0.3)';
|
|
73
|
-
userLocationMarker.current = new google.maps.marker.AdvancedMarkerElement({
|
|
74
|
-
map,
|
|
75
|
-
position: pos,
|
|
76
|
-
content: dot
|
|
77
|
-
});
|
|
78
|
-
} else {
|
|
79
|
-
userLocationMarker.current.position = pos;
|
|
80
|
-
}
|
|
81
|
-
};
|
|
82
|
-
navigator.geolocation.getCurrentPosition(updateLocation, () => {});
|
|
83
|
-
watchId = navigator.geolocation.watchPosition(updateLocation, () => {});
|
|
84
|
-
return () => {
|
|
85
|
-
if (watchId !== null) {
|
|
86
|
-
navigator.geolocation.clearWatch(watchId);
|
|
87
|
-
}
|
|
88
|
-
if (userLocationMarker.current) {
|
|
89
|
-
userLocationMarker.current.map = null;
|
|
90
|
-
userLocationMarker.current = null;
|
|
91
|
-
}
|
|
92
|
-
};
|
|
93
|
-
}, [map, userLocationEnabled]);
|
|
94
89
|
useEffect(() => {
|
|
95
90
|
if (!map) return;
|
|
96
91
|
const createPayload = gesture => {
|
|
@@ -151,11 +146,11 @@ export class MapView extends Component {
|
|
|
151
146
|
lat: coordinate.latitude,
|
|
152
147
|
lng: coordinate.longitude
|
|
153
148
|
};
|
|
154
|
-
if (duration
|
|
155
|
-
map.
|
|
149
|
+
if (duration === 0) {
|
|
150
|
+
map.setCenter(center);
|
|
156
151
|
map.setZoom(zoom);
|
|
157
152
|
} else {
|
|
158
|
-
map.
|
|
153
|
+
map.panTo(center);
|
|
159
154
|
map.setZoom(zoom);
|
|
160
155
|
}
|
|
161
156
|
}
|
|
@@ -253,8 +248,9 @@ export class MapView extends Component {
|
|
|
253
248
|
onMapReady: this.handleMapReady,
|
|
254
249
|
onCameraMove: onCameraMove,
|
|
255
250
|
onCameraIdle: onCameraIdle,
|
|
256
|
-
onReady: onReady
|
|
257
|
-
|
|
251
|
+
onReady: onReady
|
|
252
|
+
}), /*#__PURE__*/_jsx(UserLocationMarker, {
|
|
253
|
+
enabled: userLocationEnabled
|
|
258
254
|
}), mapChildren]
|
|
259
255
|
})
|
|
260
256
|
}), overlayChildren]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Children","Component","isValidElement","useEffect","useRef","View","Map","useMap","Marker","Polyline","jsx","_jsx","jsxs","_jsxs","MAP_COMPONENT_TYPES","Set","isMapComponent","child","has","type","createSyntheticEvent","nativeEvent","currentTarget","target","bubbles","cancelable","defaultPrevented","eventPhase","isTrusted","preventDefault","stopPropagation","isDefaultPrevented","isPropagationStopped","persist","timeStamp","Date","now","
|
|
1
|
+
{"version":3,"names":["Children","Component","isValidElement","useEffect","useRef","useState","View","Map","useMap","Marker","Polyline","jsx","_jsx","jsxs","_jsxs","MAP_COMPONENT_TYPES","Set","isMapComponent","child","has","type","createSyntheticEvent","nativeEvent","currentTarget","target","bubbles","cancelable","defaultPrevented","eventPhase","isTrusted","preventDefault","stopPropagation","isDefaultPrevented","isPropagationStopped","persist","timeStamp","Date","now","userLocationDotStyle","width","height","backgroundColor","border","borderRadius","boxShadow","UserLocationMarker","enabled","coordinate","setCoordinate","watchId","updateLocation","position","latitude","coords","longitude","navigator","geolocation","getCurrentPosition","watchPosition","clearWatch","anchor","x","y","children","style","MapController","onMapReady","onCameraMove","onCameraIdle","onReady","map","readyFired","current","createPayload","gesture","center","getCenter","lat","lng","zoom","getZoom","isDragging","dragStartListener","addListener","dragEndListener","centerListener","idleListener","google","maps","event","removeListener","MapView","defaultProps","provider","mapId","initialZoom","zoomEnabled","scrollEnabled","rotateEnabled","pitchEnabled","mapInstance","handleMapReady","moveCamera","options","duration","setCenter","setZoom","panTo","fitCoordinates","coordinates","first","padding","length","props","bounds","LatLngBounds","forEach","coord","extend","fitBounds","top","left","bottom","right","render","initialCoordinate","minZoom","maxZoom","userLocationEnabled","gestureHandling","defaultCenter","undefined","mapChildren","overlayChildren","push","mapContainerStyle","mapStyle","defaultZoom","disableDefaultUI","tilt"],"sourceRoot":"../../src","sources":["MapView.web.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MapView.web.d.ts","sourceRoot":"","sources":["../../../src/MapView.web.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,
|
|
1
|
+
{"version":3,"file":"MapView.web.d.ts","sourceRoot":"","sources":["../../../src/MapView.web.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EAQV,MAAM,OAAO,CAAC;AAOf,OAAO,KAAK,EACV,YAAY,EACZ,UAAU,EACV,iBAAiB,EACjB,qBAAqB,EAEtB,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAmJ1C,qBAAa,OAAQ,SAAQ,SAAS,CAAC,YAAY,CAAE,YAAW,UAAU;IACxE,MAAM,CAAC,YAAY,EAAE,OAAO,CAAC,YAAY,CAAC,CAQxC;IAEF,OAAO,CAAC,WAAW,CAAgC;IAEnD,OAAO,CAAC,cAAc,CAEpB;IAEF,UAAU,CAAC,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,iBAAiB;IAgB7D,cAAc,CAAC,WAAW,EAAE,UAAU,EAAE,EAAE,OAAO,CAAC,EAAE,qBAAqB;IA0BzE,MAAM;CAoFP"}
|
package/package.json
CHANGED
package/src/MapView.web.tsx
CHANGED
|
@@ -4,6 +4,7 @@ import {
|
|
|
4
4
|
isValidElement,
|
|
5
5
|
useEffect,
|
|
6
6
|
useRef,
|
|
7
|
+
useState,
|
|
7
8
|
type CSSProperties,
|
|
8
9
|
type ReactElement,
|
|
9
10
|
type ReactNode,
|
|
@@ -53,64 +54,37 @@ interface MapControllerProps {
|
|
|
53
54
|
onCameraMove?: (event: NativeSyntheticEvent<CameraEventPayload>) => void;
|
|
54
55
|
onCameraIdle?: (event: NativeSyntheticEvent<CameraEventPayload>) => void;
|
|
55
56
|
onReady?: () => void;
|
|
56
|
-
userLocationEnabled?: boolean;
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
onCameraIdle,
|
|
63
|
-
onReady,
|
|
64
|
-
userLocationEnabled,
|
|
65
|
-
}: MapControllerProps) {
|
|
66
|
-
const map = useMap();
|
|
67
|
-
const readyFired = useRef(false);
|
|
68
|
-
const userLocationMarker =
|
|
69
|
-
useRef<google.maps.marker.AdvancedMarkerElement | null>(null);
|
|
59
|
+
interface UserLocationMarkerProps {
|
|
60
|
+
enabled?: boolean;
|
|
61
|
+
}
|
|
70
62
|
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
63
|
+
const userLocationDotStyle: CSSProperties = {
|
|
64
|
+
width: 16,
|
|
65
|
+
height: 16,
|
|
66
|
+
backgroundColor: '#4285F4',
|
|
67
|
+
border: '2px solid white',
|
|
68
|
+
borderRadius: '50%',
|
|
69
|
+
boxShadow: '0 1px 4px rgba(0,0,0,0.3)',
|
|
70
|
+
};
|
|
74
71
|
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
onReady?.();
|
|
78
|
-
}
|
|
79
|
-
}, [map, onMapReady, onReady]);
|
|
72
|
+
function UserLocationMarker({ enabled }: UserLocationMarkerProps) {
|
|
73
|
+
const [coordinate, setCoordinate] = useState<Coordinate | null>(null);
|
|
80
74
|
|
|
81
75
|
useEffect(() => {
|
|
82
|
-
if (!
|
|
83
|
-
|
|
84
|
-
userLocationMarker.current.map = null;
|
|
85
|
-
userLocationMarker.current = null;
|
|
86
|
-
}
|
|
76
|
+
if (!enabled) {
|
|
77
|
+
setCoordinate(null);
|
|
87
78
|
return;
|
|
88
79
|
}
|
|
89
80
|
|
|
90
81
|
let watchId: number | null = null;
|
|
91
82
|
|
|
92
83
|
const updateLocation = (position: GeolocationPosition) => {
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
const dot = document.createElement('div');
|
|
98
|
-
dot.style.width = '16px';
|
|
99
|
-
dot.style.height = '16px';
|
|
100
|
-
dot.style.backgroundColor = '#4285F4';
|
|
101
|
-
dot.style.border = '2px solid white';
|
|
102
|
-
dot.style.borderRadius = '50%';
|
|
103
|
-
dot.style.boxShadow = '0 1px 4px rgba(0,0,0,0.3)';
|
|
104
|
-
|
|
105
|
-
userLocationMarker.current =
|
|
106
|
-
new google.maps.marker.AdvancedMarkerElement({
|
|
107
|
-
map,
|
|
108
|
-
position: pos,
|
|
109
|
-
content: dot,
|
|
110
|
-
});
|
|
111
|
-
} else {
|
|
112
|
-
userLocationMarker.current.position = pos;
|
|
113
|
-
}
|
|
84
|
+
setCoordinate({
|
|
85
|
+
latitude: position.coords.latitude,
|
|
86
|
+
longitude: position.coords.longitude,
|
|
87
|
+
});
|
|
114
88
|
};
|
|
115
89
|
|
|
116
90
|
navigator.geolocation.getCurrentPosition(updateLocation, () => {});
|
|
@@ -120,12 +94,36 @@ function MapController({
|
|
|
120
94
|
if (watchId !== null) {
|
|
121
95
|
navigator.geolocation.clearWatch(watchId);
|
|
122
96
|
}
|
|
123
|
-
if (userLocationMarker.current) {
|
|
124
|
-
userLocationMarker.current.map = null;
|
|
125
|
-
userLocationMarker.current = null;
|
|
126
|
-
}
|
|
127
97
|
};
|
|
128
|
-
}, [
|
|
98
|
+
}, [enabled]);
|
|
99
|
+
|
|
100
|
+
if (!coordinate) return null;
|
|
101
|
+
|
|
102
|
+
return (
|
|
103
|
+
<Marker coordinate={coordinate} anchor={{ x: 0.5, y: 0.5 }}>
|
|
104
|
+
<div style={userLocationDotStyle} />
|
|
105
|
+
</Marker>
|
|
106
|
+
);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
function MapController({
|
|
110
|
+
onMapReady,
|
|
111
|
+
onCameraMove,
|
|
112
|
+
onCameraIdle,
|
|
113
|
+
onReady,
|
|
114
|
+
}: MapControllerProps) {
|
|
115
|
+
const map = useMap();
|
|
116
|
+
const readyFired = useRef(false);
|
|
117
|
+
|
|
118
|
+
useEffect(() => {
|
|
119
|
+
if (!map) return;
|
|
120
|
+
onMapReady(map);
|
|
121
|
+
|
|
122
|
+
if (!readyFired.current) {
|
|
123
|
+
readyFired.current = true;
|
|
124
|
+
onReady?.();
|
|
125
|
+
}
|
|
126
|
+
}, [map, onMapReady, onReady]);
|
|
129
127
|
|
|
130
128
|
useEffect(() => {
|
|
131
129
|
if (!map) return;
|
|
@@ -195,11 +193,11 @@ export class MapView extends Component<MapViewProps> implements MapViewRef {
|
|
|
195
193
|
const { zoom, duration = -1 } = options;
|
|
196
194
|
const center = { lat: coordinate.latitude, lng: coordinate.longitude };
|
|
197
195
|
|
|
198
|
-
if (duration
|
|
199
|
-
map.
|
|
196
|
+
if (duration === 0) {
|
|
197
|
+
map.setCenter(center);
|
|
200
198
|
map.setZoom(zoom);
|
|
201
199
|
} else {
|
|
202
|
-
map.
|
|
200
|
+
map.panTo(center);
|
|
203
201
|
map.setZoom(zoom);
|
|
204
202
|
}
|
|
205
203
|
}
|
|
@@ -305,8 +303,8 @@ export class MapView extends Component<MapViewProps> implements MapViewRef {
|
|
|
305
303
|
onCameraMove={onCameraMove}
|
|
306
304
|
onCameraIdle={onCameraIdle}
|
|
307
305
|
onReady={onReady}
|
|
308
|
-
userLocationEnabled={userLocationEnabled}
|
|
309
306
|
/>
|
|
307
|
+
<UserLocationMarker enabled={userLocationEnabled} />
|
|
310
308
|
{mapChildren}
|
|
311
309
|
</Map>
|
|
312
310
|
</View>
|