diff --git a/node_modules/react-native-web-maps/dist/Circle.js b/node_modules/react-native-web-maps/dist/Circle.js
new file mode 100644
index 0000000..af06596
--- /dev/null
+++ b/node_modules/react-native-web-maps/dist/Circle.js
@@ -0,0 +1,20 @@
+import React, { Component } from "react";
+import { Circle } from "react-google-maps";
+
+class MapViewCircle extends Component {
+ render() {
+ return (
+
+ );
+ }
+}
+
+export default MapViewCircle;
\ No newline at end of file
diff --git a/node_modules/react-native-web-maps/dist/Geojson.js b/node_modules/react-native-web-maps/dist/Geojson.js
new file mode 100644
index 0000000..63deb4a
--- /dev/null
+++ b/node_modules/react-native-web-maps/dist/Geojson.js
@@ -0,0 +1,119 @@
+import React from 'react';
+import MapView from './index';
+
+export const makeOverlays = features => {
+ const points = features
+ .filter(f => f.geometry && (f.geometry.type === 'Point' || f.geometry.type === 'MultiPoint'))
+ .map(feature => makeCoordinates(feature).map(coordinates => makeOverlay(coordinates, feature)))
+ .reduce(flatten, [])
+ .map(overlay => ({ ...overlay, type: 'point' }));
+
+ const lines = features
+ .filter(
+ f => f.geometry && (f.geometry.type === 'LineString' || f.geometry.type === 'MultiLineString')
+ )
+ .map(feature => makeCoordinates(feature).map(coordinates => makeOverlay(coordinates, feature)))
+ .reduce(flatten, [])
+ .map(overlay => ({ ...overlay, type: 'polyline' }));
+
+ const multipolygons = features
+ .filter(f => f.geometry && f.geometry.type === 'MultiPolygon')
+ .map(feature => makeCoordinates(feature).map(coordinates => makeOverlay(coordinates, feature)))
+ .reduce(flatten, []);
+
+ const polygons = features
+ .filter(f => f.geometry && f.geometry.type === 'Polygon')
+ .map(feature => makeOverlay(makeCoordinates(feature), feature))
+ .reduce(flatten, [])
+ .concat(multipolygons)
+ .map(overlay => ({ ...overlay, type: 'polygon' }));
+
+ return points.concat(lines).concat(polygons);
+};
+
+const flatten = (prev, curr) => prev.concat(curr);
+
+const makeOverlay = (coordinates, feature) => {
+ let overlay = {
+ feature,
+ };
+ if (feature.geometry.type === 'Polygon' || feature.geometry.type === 'MultiPolygon') {
+ overlay.coordinates = coordinates[0];
+ if (coordinates.length > 1) {
+ overlay.holes = coordinates.slice(1);
+ }
+ } else {
+ overlay.coordinates = coordinates;
+ }
+ return overlay;
+};
+
+const makePoint = c => ({ lat: c[1], lng: c[0] });
+
+const makeLine = l => l.map(makePoint);
+
+const makeCoordinates = feature => {
+ const g = feature.geometry;
+ if (g.type === 'Point') {
+ return [makePoint(g.coordinates)];
+ } else if (g.type === 'MultiPoint') {
+ return g.coordinates.map(makePoint);
+ } else if (g.type === 'LineString') {
+ return [makeLine(g.coordinates)];
+ } else if (g.type === 'MultiLineString') {
+ return g.coordinates.map(makeLine);
+ } else if (g.type === 'Polygon') {
+ return g.coordinates.map(makeLine);
+ } else if (g.type === 'MultiPolygon') {
+ return g.coordinates.map(p => p.map(makeLine));
+ } else {
+ return [];
+ }
+};
+
+const Geojson = props => {
+ const overlays = makeOverlays(props.geojson.features);
+ return (
+
+ {overlays.map((overlay, index) => {
+ if (overlay.type === 'point') {
+ return (
+
+ );
+ }
+ if (overlay.type === 'polygon') {
+ return (
+
+ );
+ }
+ if (overlay.type === 'polyline') {
+ return (
+
+ );
+ }
+ })}
+
+ );
+};
+
+export default Geojson;
\ No newline at end of file
diff --git a/node_modules/react-native-web-maps/dist/Marker.js b/node_modules/react-native-web-maps/dist/Marker.js
index 6ee8f9f..5cae380 100644
--- a/node_modules/react-native-web-maps/dist/Marker.js
+++ b/node_modules/react-native-web-maps/dist/Marker.js
@@ -1 +1,32 @@
-Object.defineProperty(exports,"__esModule",{value:true});var _extends=Object.assign||function(target){for(var i=1;i=0)continue;if(!Object.prototype.hasOwnProperty.call(obj,i))continue;target[i]=obj[i];}return target;}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _possibleConstructorReturn(self,call){if(!self){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return call&&(typeof call==="object"||typeof call==="function")?call:self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:false,writable:true,configurable:true}});if(superClass)Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass;}var MapViewMarker=function(_Component){_inherits(MapViewMarker,_Component);function MapViewMarker(){var _ref;var _temp,_this,_ret;_classCallCheck(this,MapViewMarker);for(var _len=arguments.length,args=Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}return _ret=(_temp=(_this=_possibleConstructorReturn(this,(_ref=MapViewMarker.__proto__||Object.getPrototypeOf(MapViewMarker)).call.apply(_ref,[this].concat(args))),_this),_this.state={isOpen:false},_temp),_possibleConstructorReturn(_this,_ret);}_createClass(MapViewMarker,[{key:'showCallout',value:function showCallout(){this.setState({isOpen:true});}},{key:'hideCallout',value:function hideCallout(){this.setState({isOpen:false});}},{key:'render',value:function render(){var _this2=this;var _props=this.props,description=_props.description,title=_props.title,coordinate=_props.coordinate,onPress=_props.onPress,rest=_objectWithoutProperties(_props,['description','title','coordinate','onPress']);var childrenWithProps=_react2.default.Children.map(this.props.children,function(child){return _react2.default.cloneElement(child,{hideCallout:_this2.hideCallout.bind(_this2)});});return _react2.default.createElement(_reactGoogleMaps.Marker,_extends({},rest,{title:description?title+'\n'+description:title,position:{lat:coordinate.latitude,lng:coordinate.longitude},onClick:onPress,__source:{fileName:_jsxFileName,lineNumber:21}}),this.state.isOpen&&childrenWithProps);}}]);return MapViewMarker;}(_react.Component);exports.default=MapViewMarker;
\ No newline at end of file
+import React, { Component } from 'react';
+import { Marker } from 'react-google-maps';
+
+class MapViewMarker extends Component {
+ state = {
+ isOpen: false,
+ };
+ showCallout() {
+ this.setState({ isOpen: true });
+ }
+ hideCallout() {
+ this.setState({ isOpen: false });
+ }
+ render() {
+ const { description, title, coordinate, onPress, ...rest } = this.props;
+
+ const childrenWithProps = React.Children.map(this.props.children, child => {
+ return React.cloneElement(child, { hideCallout: this.hideCallout.bind(this) });
+ });
+ return (
+
+ {this.state.isOpen && childrenWithProps}
+
+ );
+ }
+}
+
+export default MapViewMarker;
diff --git a/node_modules/react-native-web-maps/dist/Polygon.js b/node_modules/react-native-web-maps/dist/Polygon.js
new file mode 100644
index 0000000..3136916
--- /dev/null
+++ b/node_modules/react-native-web-maps/dist/Polygon.js
@@ -0,0 +1,31 @@
+import React, { Component } from "react";
+import { Polygon } from "react-google-maps";
+
+class MapViewPolygon extends Component {
+ render() {
+ const {
+ coordinates,
+ fillColor,
+ strokeColor,
+ strokeWidth,
+ ...rest
+ } = this.props;
+
+ return (
+ ({
+ lat: x.latitude,
+ lng: x.longitude,
+ }))}
+ options={{
+ strokeColor: strokeColor,
+ strokeWeight: strokeWidth,
+ fillColor: fillColor,
+ }}
+ {...rest}
+ />
+ );
+ }
+}
+
+export default MapViewPolygon;
\ No newline at end of file
diff --git a/node_modules/react-native-web-maps/dist/index.js b/node_modules/react-native-web-maps/dist/index.js
index 47ed45f..9b36352 100755
--- a/node_modules/react-native-web-maps/dist/index.js
+++ b/node_modules/react-native-web-maps/dist/index.js
@@ -1 +1,157 @@
-Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i (
+
+));
+
+function googleToReact(point) {
+ return {
+ latitude: point.lat(),
+ longitude: point.lng(),
+ };
+}
+
+function reactToGoogle(point) {
+ return {
+ lat: point.latitude,
+ lng: point.longitude,
+ };
+}
+
+class MapView extends Component {
+ state = {
+ center: null,
+ };
+
+ handleMapMounted = map => {
+ this.map = map;
+ this.props.onMapReady && this.props.onMapReady();
+ };
+
+ getCamera = () => {
+ return {
+ zoom: this.map.getZoom(),
+ center: this.map.getCenter(),
+ heading: this.map.getHeading(),
+ };
+ };
+
+ animateCamera(camera) {
+ this.setState({ zoom: camera.zoom });
+ this.setState({ center: reactToGoogle(camera.center) });
+ }
+
+ animateToRegion(coordinates) {
+ this.setState({
+ center: reactToGoogle(coordinates),
+ });
+ }
+
+ async getMapBoundaries() {
+ const bounds = this.map.getBounds();
+ return {
+ northEast: googleToReact(bounds.getNorthEast()),
+ southWest: googleToReact(bounds.getSouthWest()),
+ };
+ }
+
+ fitToCoordinates(coordinates) {
+ var bounds = new window.google.maps.LatLngBounds();
+ for (var i = 0; i < coordinates.length; i++) {
+ bounds.extend(
+ new window.google.maps.LatLng(coordinates[i].latitude, coordinates[i].longitude)
+ );
+ }
+
+ this.map.fitBounds(bounds);
+ }
+
+ onDragEnd = () => {
+ const { onRegionChangeComplete } = this.props;
+ if (this.map && onRegionChangeComplete) {
+ const center = this.map.getCenter();
+ const bounds = this.map.getBounds();
+ onRegionChangeComplete({
+ ...googleToReact(center),
+ latitudeDelta: bounds.getNorthEast().lat() - bounds.getSouthWest().lat(),
+ longitudeDelta: bounds.getNorthEast().lng() - bounds.getSouthWest().lng(),
+ });
+ }
+ };
+
+ render() {
+ const { region, initialRegion, onRegionChange, onPress, options, defaultZoom } = this.props;
+ const { center } = this.state;
+ const style = this.props.style || styles.container;
+
+ const googleMapProps = center
+ ? { center }
+ : region
+ ? {
+ center: reactToGoogle(region),
+ }
+ : {
+ defaultCenter: reactToGoogle(initialRegion),
+ };
+ const zoom =
+ defaultZoom ||
+ (region && region.latitudeDelta
+ ? Math.round(Math.log(360 / region.latitudeDelta) / Math.LN2)
+ : initialRegion && initialRegion.latitudeDelta
+ ? Math.round(Math.log(360 / initialRegion.latitudeDelta) / Math.LN2)
+ : 15);
+ googleMapProps['zoom'] = this.state.zoom ? this.state.zoom : zoom;
+ return (
+
+ }
+ mapElement={}
+ onZoomChanged={() => {
+ this.setState({ zoom: this.map.getZoom() });
+ }}
+ {...googleMapProps}
+ onDragStart={onRegionChange}
+ onIdle={this.onDragEnd}
+ defaultZoom={zoom}
+ onClick={onPress}
+ options={options}
+ >
+ {this.props.children}
+
+
+ );
+ }
+}
+
+MapView.Marker = Marker;
+MapView.Polyline = Polyline;
+MapView.Callout = Callout;
+MapView.Polygon = Polygon;
+MapView.Circle = Circle;
+MapView.Geojson = Geojson;
+
+export {
+ Marker,
+ Polyline,
+ Callout,
+ Polygon,
+ Circle,
+ Geojson,
+};
+
+const styles = StyleSheet.create({
+ container: {
+ height: '100%',
+ },
+});
+
+export default MapView;
diff --git a/node_modules/react-native-web-maps/src/Circle.js b/node_modules/react-native-web-maps/src/Circle.js
new file mode 100644
index 0000000..412b953
--- /dev/null
+++ b/node_modules/react-native-web-maps/src/Circle.js
@@ -0,0 +1,21 @@
+import React, { Component } from "react";
+import { Circle } from "react-google-maps";
+
+class MapViewCircle extends Component {
+ render() {
+ return (
+
+ );
+ }
+}
+
+export default MapViewCircle;
\ No newline at end of file
diff --git a/node_modules/react-native-web-maps/src/Geojson.js b/node_modules/react-native-web-maps/src/Geojson.js
new file mode 100644
index 0000000..63deb4a
--- /dev/null
+++ b/node_modules/react-native-web-maps/src/Geojson.js
@@ -0,0 +1,119 @@
+import React from 'react';
+import MapView from './index';
+
+export const makeOverlays = features => {
+ const points = features
+ .filter(f => f.geometry && (f.geometry.type === 'Point' || f.geometry.type === 'MultiPoint'))
+ .map(feature => makeCoordinates(feature).map(coordinates => makeOverlay(coordinates, feature)))
+ .reduce(flatten, [])
+ .map(overlay => ({ ...overlay, type: 'point' }));
+
+ const lines = features
+ .filter(
+ f => f.geometry && (f.geometry.type === 'LineString' || f.geometry.type === 'MultiLineString')
+ )
+ .map(feature => makeCoordinates(feature).map(coordinates => makeOverlay(coordinates, feature)))
+ .reduce(flatten, [])
+ .map(overlay => ({ ...overlay, type: 'polyline' }));
+
+ const multipolygons = features
+ .filter(f => f.geometry && f.geometry.type === 'MultiPolygon')
+ .map(feature => makeCoordinates(feature).map(coordinates => makeOverlay(coordinates, feature)))
+ .reduce(flatten, []);
+
+ const polygons = features
+ .filter(f => f.geometry && f.geometry.type === 'Polygon')
+ .map(feature => makeOverlay(makeCoordinates(feature), feature))
+ .reduce(flatten, [])
+ .concat(multipolygons)
+ .map(overlay => ({ ...overlay, type: 'polygon' }));
+
+ return points.concat(lines).concat(polygons);
+};
+
+const flatten = (prev, curr) => prev.concat(curr);
+
+const makeOverlay = (coordinates, feature) => {
+ let overlay = {
+ feature,
+ };
+ if (feature.geometry.type === 'Polygon' || feature.geometry.type === 'MultiPolygon') {
+ overlay.coordinates = coordinates[0];
+ if (coordinates.length > 1) {
+ overlay.holes = coordinates.slice(1);
+ }
+ } else {
+ overlay.coordinates = coordinates;
+ }
+ return overlay;
+};
+
+const makePoint = c => ({ lat: c[1], lng: c[0] });
+
+const makeLine = l => l.map(makePoint);
+
+const makeCoordinates = feature => {
+ const g = feature.geometry;
+ if (g.type === 'Point') {
+ return [makePoint(g.coordinates)];
+ } else if (g.type === 'MultiPoint') {
+ return g.coordinates.map(makePoint);
+ } else if (g.type === 'LineString') {
+ return [makeLine(g.coordinates)];
+ } else if (g.type === 'MultiLineString') {
+ return g.coordinates.map(makeLine);
+ } else if (g.type === 'Polygon') {
+ return g.coordinates.map(makeLine);
+ } else if (g.type === 'MultiPolygon') {
+ return g.coordinates.map(p => p.map(makeLine));
+ } else {
+ return [];
+ }
+};
+
+const Geojson = props => {
+ const overlays = makeOverlays(props.geojson.features);
+ return (
+
+ {overlays.map((overlay, index) => {
+ if (overlay.type === 'point') {
+ return (
+
+ );
+ }
+ if (overlay.type === 'polygon') {
+ return (
+
+ );
+ }
+ if (overlay.type === 'polyline') {
+ return (
+
+ );
+ }
+ })}
+
+ );
+};
+
+export default Geojson;
\ No newline at end of file
diff --git a/node_modules/react-native-web-maps/src/Polygon.js b/node_modules/react-native-web-maps/src/Polygon.js
new file mode 100644
index 0000000..8b74b43
--- /dev/null
+++ b/node_modules/react-native-web-maps/src/Polygon.js
@@ -0,0 +1,32 @@
+import React, { Component } from "react";
+import { Polygon } from "react-google-maps";
+
+class MapViewPolygon extends Component {
+ render() {
+ const {
+ coordinates,
+ fillColor,
+ strokeColor,
+ strokeWidth,
+ ...rest
+ } = this.props;
+
+ return (
+ ({
+ lat: x.latitude,
+ lng: x.longitude,
+ }))}
+ options={{
+ strokeColor: strokeColor,
+ strokeWeight: strokeWidth,
+ fillColor: fillColor,
+ }}
+ {...rest}
+ onClick={this.props.onPress}
+ />
+ );
+ }
+}
+
+export default MapViewPolygon;
\ No newline at end of file
diff --git a/node_modules/react-native-web-maps/src/Polyline.js b/node_modules/react-native-web-maps/src/Polyline.js
index 4c42be2..c6c38b8 100644
--- a/node_modules/react-native-web-maps/src/Polyline.js
+++ b/node_modules/react-native-web-maps/src/Polyline.js
@@ -3,7 +3,7 @@ import { Polyline } from 'react-google-maps';
class MapViewPolyline extends Component {
render() {
- return ;
+ return ;
}
}
diff --git a/node_modules/react-native-web-maps/src/index.js b/node_modules/react-native-web-maps/src/index.js
index dab5f22..1bb59af 100755
--- a/node_modules/react-native-web-maps/src/index.js
+++ b/node_modules/react-native-web-maps/src/index.js
@@ -1,14 +1,31 @@
import React, { Component } from 'react';
-import { View, StyleSheet } from 'react-native';
-import { withGoogleMap, GoogleMap } from 'react-google-maps';
+import { GoogleMap, withGoogleMap } from 'react-google-maps';
+import { StyleSheet, View } from 'react-native';
+import Callout from './Callout';
+import Circle from './Circle';
+import Geojson from './Geojson';
import Marker from './Marker';
+import Polygon from './Polygon';
import Polyline from './Polyline';
-import Callout from './Callout';
const GoogleMapContainer = withGoogleMap(props => (
));
+function googleToReact(point) {
+ return {
+ latitude: point.lat(),
+ longitude: point.lng(),
+ };
+}
+
+function reactToGoogle(point) {
+ return {
+ lat: point.latitude,
+ lng: point.longitude,
+ };
+}
+
class MapView extends Component {
state = {
center: null,
@@ -29,22 +46,43 @@ class MapView extends Component {
animateCamera(camera) {
this.setState({ zoom: camera.zoom });
- this.setState({ center: camera.center });
+ this.setState({ center: reactToGoogle(camera.center) });
}
animateToRegion(coordinates) {
this.setState({
- center: { lat: coordinates.latitude, lng: coordinates.longitude },
+ center: reactToGoogle(coordinates),
});
}
+ async getMapBoundaries() {
+ const bounds = this.map.getBounds();
+ return {
+ northEast: googleToReact(bounds.getNorthEast()),
+ southWest: googleToReact(bounds.getSouthWest()),
+ };
+ }
+
+ fitToCoordinates(coordinates) {
+ var bounds = new window.google.maps.LatLngBounds();
+ for (var i = 0; i < coordinates.length; i++) {
+ bounds.extend(
+ new window.google.maps.LatLng(coordinates[i].latitude, coordinates[i].longitude)
+ );
+ }
+
+ this.map.fitBounds(bounds);
+ }
+
onDragEnd = () => {
const { onRegionChangeComplete } = this.props;
if (this.map && onRegionChangeComplete) {
const center = this.map.getCenter();
+ const bounds = this.map.getBounds();
onRegionChangeComplete({
- latitude: center.lat(),
- longitude: center.lng(),
+ ...googleToReact(center),
+ latitudeDelta: bounds.getNorthEast().lat() - bounds.getSouthWest().lat(),
+ longitudeDelta: bounds.getNorthEast().lng() - bounds.getSouthWest().lng(),
});
}
};
@@ -58,16 +96,10 @@ class MapView extends Component {
? { center }
: region
? {
- center: {
- lat: region.latitude,
- lng: region.longitude,
- },
+ center: reactToGoogle(region),
}
: {
- defaultCenter: {
- lat: initialRegion.latitude,
- lng: initialRegion.longitude,
- },
+ defaultCenter: reactToGoogle(initialRegion),
};
const zoom =
defaultZoom ||
@@ -78,7 +110,7 @@ class MapView extends Component {
: 15);
googleMapProps['zoom'] = this.state.zoom ? this.state.zoom : zoom;
return (
-
+
}
@@ -91,7 +123,8 @@ class MapView extends Component {
onIdle={this.onDragEnd}
defaultZoom={zoom}
onClick={onPress}
- options={options}>
+ options={options}
+ >
{this.props.children}
@@ -102,6 +135,18 @@ class MapView extends Component {
MapView.Marker = Marker;
MapView.Polyline = Polyline;
MapView.Callout = Callout;
+MapView.Polygon = Polygon;
+MapView.Circle = Circle;
+MapView.Geojson = Geojson;
+
+export {
+ Marker,
+ Polyline,
+ Callout,
+ Polygon,
+ Circle,
+ Geojson,
+};
const styles = StyleSheet.create({
container: {