From f28f3eb4ab706f80bdfb4ef459c6248be7a862bd Mon Sep 17 00:00:00 2001 From: kashaudhan Date: Mon, 29 May 2023 13:19:34 +0530 Subject: [PATCH 1/2] added custom marker support --- dist/MapPicker.d.ts | 1 + dist/index.js | 6 ++- dist/index.js.map | 2 +- dist/index.modern.js | 97 +++++++++++++++++----------------------- dist/index.modern.js.map | 2 +- example/.eslintcache | 2 +- example/src/App.js | 1 + src/MapPicker.tsx | 12 ++--- 8 files changed, 55 insertions(+), 68 deletions(-) diff --git a/dist/MapPicker.d.ts b/dist/MapPicker.d.ts index a48e10b..eef66c8 100644 --- a/dist/MapPicker.d.ts +++ b/dist/MapPicker.d.ts @@ -18,6 +18,7 @@ declare type Props = { style?: any; className?: string; mapTypeId?: MapTypeId; + icon: any; }; declare const MapPicker: FC; export default MapPicker; diff --git a/dist/index.js b/dist/index.js index 43d38dc..10f0b60 100644 --- a/dist/index.js +++ b/dist/index.js @@ -75,7 +75,8 @@ var MapPicker = function MapPicker(_ref) { onChangeZoom = _ref.onChangeZoom, style = _ref.style, className = _ref.className, - mapTypeId = _ref.mapTypeId; + mapTypeId = _ref.mapTypeId, + icon = _ref.icon; var MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9); var map = React.useRef(null); var marker = React.useRef(null); @@ -108,7 +109,8 @@ var MapPicker = function MapPicker(_ref) { marker.current = new Google.maps.Marker({ position: validLocation, map: map.current, - draggable: true + draggable: true, + icon: icon }); Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation); } else { diff --git a/dist/index.js.map b/dist/index.js.map index e3a9990..806abb4 100644 --- a/dist/index.js.map +++ b/dist/index.js.map @@ -1 +1 @@ -{"version":3,"file":"index.js","sources":["../src/MapPicker.tsx"],"sourcesContent":["import React, { FC } from 'react';\r\n\r\nfunction isGoogleMapScriptLoaded(id: string): boolean {\r\n const scripts: HTMLCollectionOf = document.head.getElementsByTagName('script');\r\n for (let i: number = 0; i < scripts.length; i++) {\r\n if (scripts[i].getAttribute('id') === id) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n}\r\n\r\nfunction loadScript(src: string, id: string) {\r\n if (isGoogleMapScriptLoaded(id)) {\r\n // Make sure the script is loaded\r\n return new Promise((resolve) => setTimeout(resolve, 500));\r\n }\r\n\r\n const script = document.createElement('script');\r\n script.setAttribute('async', '');\r\n script.setAttribute('id', id);\r\n script.src = src;\r\n (document.querySelector('head') as any).appendChild(script);\r\n\r\n return new Promise((resolve) => {\r\n script.onload = () => {\r\n resolve();\r\n };\r\n });\r\n}\r\n\r\ntype Location = {\r\n lat: number,\r\n lng: number\r\n}\r\n\r\nenum MapTypeId {\r\n Roadmap = 'roadmap',\r\n Satellite = 'satellite',\r\n Hybrid = 'hybrid',\r\n Terrain = 'terrain'\r\n}\r\n\r\ntype Props = {\r\n apiKey: string,\r\n defaultLocation: Location;\r\n zoom?: number;\r\n onChangeLocation?(lat: number, lng: number): void;\r\n onChangeZoom?(zoom: number): void;\r\n style?: any;\r\n className?: string;\r\n mapTypeId?: MapTypeId\r\n}\r\n\r\nfunction isValidLocation(location: Location) {\r\n return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180;\r\n}\r\n\r\nconst GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key=';\r\n\r\nconst MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId }) => {\r\n const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9);\r\n const map = React.useRef(null);\r\n const marker = React.useRef(null);\r\n\r\n function handleChangeLocation() {\r\n if (onChangeLocation) {\r\n const currentLocation = marker.current.getPosition();\r\n onChangeLocation(currentLocation.lat(), currentLocation.lng());\r\n }\r\n }\r\n\r\n function handleChangeZoom() {\r\n onChangeZoom && onChangeZoom(map.current.getZoom());\r\n }\r\n\r\n function loadMap() {\r\n const Google = (window as any).google;\r\n const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 };\r\n\r\n map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID),\r\n {\r\n center: validLocation,\r\n zoom: zoom,\r\n ...(mapTypeId && { mapTypeId })\r\n });\r\n\r\n if (!marker.current) {\r\n marker.current = new Google.maps.Marker({\r\n position: validLocation,\r\n map: map.current,\r\n draggable: true\r\n });\r\n Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation);\r\n } else {\r\n marker.current.setPosition(validLocation);\r\n }\r\n\r\n map.current.addListener('click', function (event: any) {\r\n const clickedLocation = event.latLng;\r\n\r\n marker.current.setPosition(clickedLocation);\r\n handleChangeLocation();\r\n });\r\n\r\n map.current.addListener('zoom_changed', handleChangeZoom);\r\n }\r\n\r\n React.useEffect(() => {\r\n loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap);\r\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n React.useEffect(() => {\r\n if (marker.current) {\r\n map.current.setCenter(defaultLocation);\r\n marker.current.setPosition(defaultLocation);\r\n }\r\n }, [defaultLocation]);\r\n\r\n React.useEffect(() => {\r\n if (map.current) {\r\n map.current.setZoom(zoom);\r\n }\r\n }, [zoom]);\r\n\r\n const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {});\r\n\r\n return (\r\n
\r\n );\r\n};\r\nexport default MapPicker;"],"names":["isGoogleMapScriptLoaded","id","scripts","document","head","getElementsByTagName","i","length","getAttribute","loadScript","src","Promise","resolve","setTimeout","script","createElement","setAttribute","querySelector","appendChild","onload","MapTypeId","isValidLocation","location","Math","abs","lat","lng","GOOGLE_SCRIPT_URL","MapPicker","apiKey","defaultLocation","zoom","onChangeLocation","onChangeZoom","style","className","mapTypeId","MAP_VIEW_ID","random","toString","substr","map","React","useRef","marker","handleChangeLocation","currentLocation","current","getPosition","handleChangeZoom","getZoom","loadMap","Google","window","google","validLocation","maps","Map","getElementById","center","Marker","position","draggable","event","addListener","setPosition","clickedLocation","latLng","useEffect","then","setCenter","setZoom","componentStyle","Object","assign","width","height"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"index.js","sources":["../src/MapPicker.tsx"],"sourcesContent":["import React, { FC } from 'react';\r\n\r\nfunction isGoogleMapScriptLoaded(id: string): boolean {\r\n const scripts: HTMLCollectionOf = document.head.getElementsByTagName('script');\r\n for (let i: number = 0; i < scripts.length; i++) {\r\n if (scripts[i].getAttribute('id') === id) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n}\r\n\r\nfunction loadScript(src: string, id: string) {\r\n if (isGoogleMapScriptLoaded(id)) {\r\n // Make sure the script is loaded\r\n return new Promise((resolve) => setTimeout(resolve, 500));\r\n }\r\n\r\n const script = document.createElement('script');\r\n script.setAttribute('async', '');\r\n script.setAttribute('id', id);\r\n script.src = src;\r\n (document.querySelector('head') as any).appendChild(script);\r\n\r\n return new Promise((resolve) => {\r\n script.onload = () => {\r\n resolve();\r\n };\r\n });\r\n}\r\n\r\ntype Location = {\r\n lat: number,\r\n lng: number\r\n}\r\n\r\nenum MapTypeId {\r\n Roadmap = 'roadmap',\r\n Satellite = 'satellite',\r\n Hybrid = 'hybrid',\r\n Terrain = 'terrain'\r\n}\r\n\r\ntype Props = {\r\n apiKey: string,\r\n defaultLocation: Location;\r\n zoom?: number;\r\n onChangeLocation?(lat: number, lng: number): void;\r\n onChangeZoom?(zoom: number): void;\r\n style?: any;\r\n className?: string;\r\n mapTypeId?: MapTypeId;\r\n icon: any; // https://developers.google.com/maps/documentation/javascript/markers#icons\r\n}\r\n\r\nfunction isValidLocation(location: Location) {\r\n return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180;\r\n}\r\n\r\nconst GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key=';\r\n\r\nconst MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId, icon }) => {\r\n const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9);\r\n const map = React.useRef(null);\r\n const marker = React.useRef(null);\r\n\r\n function handleChangeLocation() {\r\n if (onChangeLocation) {\r\n const currentLocation = marker.current.getPosition();\r\n onChangeLocation(currentLocation.lat(), currentLocation.lng());\r\n }\r\n }\r\n\r\n function handleChangeZoom() {\r\n onChangeZoom && onChangeZoom(map.current.getZoom());\r\n }\r\n\r\n function loadMap() {\r\n const Google = (window as any).google;\r\n const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 };\r\n\r\n map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID),\r\n {\r\n center: validLocation,\r\n zoom: zoom,\r\n ...(mapTypeId && { mapTypeId })\r\n });\r\n\r\n if (!marker.current) {\r\n marker.current = new Google.maps.Marker({\r\n position: validLocation,\r\n map: map.current,\r\n draggable: true,\r\n icon\r\n });\r\n Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation);\r\n } else {\r\n marker.current.setPosition(validLocation);\r\n }\r\n\r\n map.current.addListener('click', function (event: any) {\r\n const clickedLocation = event.latLng;\r\n\r\n marker.current.setPosition(clickedLocation);\r\n handleChangeLocation();\r\n });\r\n\r\n map.current.addListener('zoom_changed', handleChangeZoom);\r\n }\r\n\r\n React.useEffect(() => {\r\n loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap);\r\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n React.useEffect(() => {\r\n if (marker.current) {\r\n map.current.setCenter(defaultLocation);\r\n marker.current.setPosition(defaultLocation);\r\n }\r\n }, [defaultLocation]);\r\n\r\n React.useEffect(() => {\r\n if (map.current) {\r\n map.current.setZoom(zoom);\r\n }\r\n }, [zoom]);\r\n\r\n const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {});\r\n\r\n return
\r\n};\r\nexport default MapPicker;"],"names":["isGoogleMapScriptLoaded","id","scripts","document","head","getElementsByTagName","i","length","getAttribute","loadScript","src","Promise","resolve","setTimeout","script","createElement","setAttribute","querySelector","appendChild","onload","MapTypeId","isValidLocation","location","Math","abs","lat","lng","GOOGLE_SCRIPT_URL","MapPicker","apiKey","defaultLocation","zoom","onChangeLocation","onChangeZoom","style","className","mapTypeId","icon","MAP_VIEW_ID","random","toString","substr","map","React","useRef","marker","handleChangeLocation","currentLocation","current","getPosition","handleChangeZoom","getZoom","loadMap","Google","window","google","validLocation","maps","Map","getElementById","center","Marker","position","draggable","event","addListener","setPosition","clickedLocation","latLng","useEffect","then","setCenter","setZoom","componentStyle","Object","assign","width","height"],"mappings":"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"} \ No newline at end of file diff --git a/dist/index.modern.js b/dist/index.modern.js index 2ffb0b4..30f9706 100644 --- a/dist/index.modern.js +++ b/dist/index.modern.js @@ -1,27 +1,9 @@ import React from 'react'; -function _extends() { - _extends = Object.assign || function (target) { - for (var i = 1; i < arguments.length; i++) { - var source = arguments[i]; - - for (var key in source) { - if (Object.prototype.hasOwnProperty.call(source, key)) { - target[key] = source[key]; - } - } - } - - return target; - }; - - return _extends.apply(this, arguments); -} - function isGoogleMapScriptLoaded(id) { - var scripts = document.head.getElementsByTagName('script'); + const scripts = document.head.getElementsByTagName('script'); - for (var i = 0; i < scripts.length; i++) { + for (let i = 0; i < scripts.length; i++) { if (scripts[i].getAttribute('id') === id) { return true; } @@ -32,18 +14,16 @@ function isGoogleMapScriptLoaded(id) { function loadScript(src, id) { if (isGoogleMapScriptLoaded(id)) { - return new Promise(function (resolve) { - return setTimeout(resolve, 500); - }); + return new Promise(resolve => setTimeout(resolve, 500)); } - var script = document.createElement('script'); + const script = document.createElement('script'); script.setAttribute('async', ''); script.setAttribute('id', id); script.src = src; document.querySelector('head').appendChild(script); - return new Promise(function (resolve) { - script.onload = function () { + return new Promise(resolve => { + script.onload = () => { resolve(); }; }); @@ -62,25 +42,26 @@ function isValidLocation(location) { return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180; } -var GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key='; - -var MapPicker = function MapPicker(_ref) { - var apiKey = _ref.apiKey, - defaultLocation = _ref.defaultLocation, - _ref$zoom = _ref.zoom, - zoom = _ref$zoom === void 0 ? 7 : _ref$zoom, - onChangeLocation = _ref.onChangeLocation, - onChangeZoom = _ref.onChangeZoom, - style = _ref.style, - className = _ref.className, - mapTypeId = _ref.mapTypeId; - var MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9); - var map = React.useRef(null); - var marker = React.useRef(null); +const GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key='; + +const MapPicker = ({ + apiKey, + defaultLocation, + zoom: _zoom = 7, + onChangeLocation, + onChangeZoom, + style, + className, + mapTypeId, + icon +}) => { + const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9); + const map = React.useRef(null); + const marker = React.useRef(null); function handleChangeLocation() { if (onChangeLocation) { - var currentLocation = marker.current.getPosition(); + const currentLocation = marker.current.getPosition(); onChangeLocation(currentLocation.lat(), currentLocation.lng()); } } @@ -90,23 +71,25 @@ var MapPicker = function MapPicker(_ref) { } function loadMap() { - var Google = window.google; - var validLocation = isValidLocation(defaultLocation) ? defaultLocation : { + const Google = window.google; + const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 }; - map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID), _extends({ + map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID), { center: validLocation, - zoom: zoom - }, mapTypeId && { - mapTypeId: mapTypeId - })); + zoom: _zoom, + ...(mapTypeId && { + mapTypeId + }) + }); if (!marker.current) { marker.current = new Google.maps.Marker({ position: validLocation, map: map.current, - draggable: true + draggable: true, + icon }); Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation); } else { @@ -114,28 +97,28 @@ var MapPicker = function MapPicker(_ref) { } map.current.addListener('click', function (event) { - var clickedLocation = event.latLng; + const clickedLocation = event.latLng; marker.current.setPosition(clickedLocation); handleChangeLocation(); }); map.current.addListener('zoom_changed', handleChangeZoom); } - React.useEffect(function () { + React.useEffect(() => { loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap); }, []); - React.useEffect(function () { + React.useEffect(() => { if (marker.current) { map.current.setCenter(defaultLocation); marker.current.setPosition(defaultLocation); } }, [defaultLocation]); - React.useEffect(function () { + React.useEffect(() => { if (map.current) { - map.current.setZoom(zoom); + map.current.setZoom(_zoom); } - }, [zoom]); - var componentStyle = Object.assign({ + }, [_zoom]); + const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {}); diff --git a/dist/index.modern.js.map b/dist/index.modern.js.map index 1ee8a1d..8d6cce5 100644 --- a/dist/index.modern.js.map +++ b/dist/index.modern.js.map @@ -1 +1 @@ -{"version":3,"file":"index.modern.js","sources":["../src/MapPicker.tsx"],"sourcesContent":["import React, { FC } from 'react';\r\n\r\nfunction isGoogleMapScriptLoaded(id: string): boolean {\r\n const scripts: HTMLCollectionOf = document.head.getElementsByTagName('script');\r\n for (let i: number = 0; i < scripts.length; i++) {\r\n if (scripts[i].getAttribute('id') === id) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n}\r\n\r\nfunction loadScript(src: string, id: string) {\r\n if (isGoogleMapScriptLoaded(id)) {\r\n // Make sure the script is loaded\r\n return new Promise((resolve) => setTimeout(resolve, 500));\r\n }\r\n\r\n const script = document.createElement('script');\r\n script.setAttribute('async', '');\r\n script.setAttribute('id', id);\r\n script.src = src;\r\n (document.querySelector('head') as any).appendChild(script);\r\n\r\n return new Promise((resolve) => {\r\n script.onload = () => {\r\n resolve();\r\n };\r\n });\r\n}\r\n\r\ntype Location = {\r\n lat: number,\r\n lng: number\r\n}\r\n\r\nenum MapTypeId {\r\n Roadmap = 'roadmap',\r\n Satellite = 'satellite',\r\n Hybrid = 'hybrid',\r\n Terrain = 'terrain'\r\n}\r\n\r\ntype Props = {\r\n apiKey: string,\r\n defaultLocation: Location;\r\n zoom?: number;\r\n onChangeLocation?(lat: number, lng: number): void;\r\n onChangeZoom?(zoom: number): void;\r\n style?: any;\r\n className?: string;\r\n mapTypeId?: MapTypeId\r\n}\r\n\r\nfunction isValidLocation(location: Location) {\r\n return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180;\r\n}\r\n\r\nconst GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key=';\r\n\r\nconst MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId }) => {\r\n const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9);\r\n const map = React.useRef(null);\r\n const marker = React.useRef(null);\r\n\r\n function handleChangeLocation() {\r\n if (onChangeLocation) {\r\n const currentLocation = marker.current.getPosition();\r\n onChangeLocation(currentLocation.lat(), currentLocation.lng());\r\n }\r\n }\r\n\r\n function handleChangeZoom() {\r\n onChangeZoom && onChangeZoom(map.current.getZoom());\r\n }\r\n\r\n function loadMap() {\r\n const Google = (window as any).google;\r\n const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 };\r\n\r\n map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID),\r\n {\r\n center: validLocation,\r\n zoom: zoom,\r\n ...(mapTypeId && { mapTypeId })\r\n });\r\n\r\n if (!marker.current) {\r\n marker.current = new Google.maps.Marker({\r\n position: validLocation,\r\n map: map.current,\r\n draggable: true\r\n });\r\n Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation);\r\n } else {\r\n marker.current.setPosition(validLocation);\r\n }\r\n\r\n map.current.addListener('click', function (event: any) {\r\n const clickedLocation = event.latLng;\r\n\r\n marker.current.setPosition(clickedLocation);\r\n handleChangeLocation();\r\n });\r\n\r\n map.current.addListener('zoom_changed', handleChangeZoom);\r\n }\r\n\r\n React.useEffect(() => {\r\n loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap);\r\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n React.useEffect(() => {\r\n if (marker.current) {\r\n map.current.setCenter(defaultLocation);\r\n marker.current.setPosition(defaultLocation);\r\n }\r\n }, [defaultLocation]);\r\n\r\n React.useEffect(() => {\r\n if (map.current) {\r\n map.current.setZoom(zoom);\r\n }\r\n }, [zoom]);\r\n\r\n const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {});\r\n\r\n return (\r\n
\r\n );\r\n};\r\nexport default MapPicker;"],"names":["isGoogleMapScriptLoaded","id","scripts","document","head","getElementsByTagName","i","length","getAttribute","loadScript","src","Promise","resolve","setTimeout","script","createElement","setAttribute","querySelector","appendChild","onload","MapTypeId","isValidLocation","location","Math","abs","lat","lng","GOOGLE_SCRIPT_URL","MapPicker","apiKey","defaultLocation","zoom","onChangeLocation","onChangeZoom","style","className","mapTypeId","MAP_VIEW_ID","random","toString","substr","map","React","useRef","marker","handleChangeLocation","currentLocation","current","getPosition","handleChangeZoom","getZoom","loadMap","Google","window","google","validLocation","maps","Map","getElementById","center","Marker","position","draggable","event","addListener","setPosition","clickedLocation","latLng","useEffect","then","setCenter","setZoom","componentStyle","Object","assign","width","height"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"index.modern.js","sources":["../src/MapPicker.tsx"],"sourcesContent":["import React, { FC } from 'react';\r\n\r\nfunction isGoogleMapScriptLoaded(id: string): boolean {\r\n const scripts: HTMLCollectionOf = document.head.getElementsByTagName('script');\r\n for (let i: number = 0; i < scripts.length; i++) {\r\n if (scripts[i].getAttribute('id') === id) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n}\r\n\r\nfunction loadScript(src: string, id: string) {\r\n if (isGoogleMapScriptLoaded(id)) {\r\n // Make sure the script is loaded\r\n return new Promise((resolve) => setTimeout(resolve, 500));\r\n }\r\n\r\n const script = document.createElement('script');\r\n script.setAttribute('async', '');\r\n script.setAttribute('id', id);\r\n script.src = src;\r\n (document.querySelector('head') as any).appendChild(script);\r\n\r\n return new Promise((resolve) => {\r\n script.onload = () => {\r\n resolve();\r\n };\r\n });\r\n}\r\n\r\ntype Location = {\r\n lat: number,\r\n lng: number\r\n}\r\n\r\nenum MapTypeId {\r\n Roadmap = 'roadmap',\r\n Satellite = 'satellite',\r\n Hybrid = 'hybrid',\r\n Terrain = 'terrain'\r\n}\r\n\r\ntype Props = {\r\n apiKey: string,\r\n defaultLocation: Location;\r\n zoom?: number;\r\n onChangeLocation?(lat: number, lng: number): void;\r\n onChangeZoom?(zoom: number): void;\r\n style?: any;\r\n className?: string;\r\n mapTypeId?: MapTypeId;\r\n icon: any; // https://developers.google.com/maps/documentation/javascript/markers#icons\r\n}\r\n\r\nfunction isValidLocation(location: Location) {\r\n return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180;\r\n}\r\n\r\nconst GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key=';\r\n\r\nconst MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId, icon }) => {\r\n const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9);\r\n const map = React.useRef(null);\r\n const marker = React.useRef(null);\r\n\r\n function handleChangeLocation() {\r\n if (onChangeLocation) {\r\n const currentLocation = marker.current.getPosition();\r\n onChangeLocation(currentLocation.lat(), currentLocation.lng());\r\n }\r\n }\r\n\r\n function handleChangeZoom() {\r\n onChangeZoom && onChangeZoom(map.current.getZoom());\r\n }\r\n\r\n function loadMap() {\r\n const Google = (window as any).google;\r\n const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 };\r\n\r\n map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID),\r\n {\r\n center: validLocation,\r\n zoom: zoom,\r\n ...(mapTypeId && { mapTypeId })\r\n });\r\n\r\n if (!marker.current) {\r\n marker.current = new Google.maps.Marker({\r\n position: validLocation,\r\n map: map.current,\r\n draggable: true,\r\n icon\r\n });\r\n Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation);\r\n } else {\r\n marker.current.setPosition(validLocation);\r\n }\r\n\r\n map.current.addListener('click', function (event: any) {\r\n const clickedLocation = event.latLng;\r\n\r\n marker.current.setPosition(clickedLocation);\r\n handleChangeLocation();\r\n });\r\n\r\n map.current.addListener('zoom_changed', handleChangeZoom);\r\n }\r\n\r\n React.useEffect(() => {\r\n loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap);\r\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n React.useEffect(() => {\r\n if (marker.current) {\r\n map.current.setCenter(defaultLocation);\r\n marker.current.setPosition(defaultLocation);\r\n }\r\n }, [defaultLocation]);\r\n\r\n React.useEffect(() => {\r\n if (map.current) {\r\n map.current.setZoom(zoom);\r\n }\r\n }, [zoom]);\r\n\r\n const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {});\r\n\r\n return
\r\n};\r\nexport default MapPicker;"],"names":["isGoogleMapScriptLoaded","id","scripts","document","head","getElementsByTagName","i","length","getAttribute","loadScript","src","Promise","resolve","setTimeout","script","createElement","setAttribute","querySelector","appendChild","onload","MapTypeId","isValidLocation","location","Math","abs","lat","lng","GOOGLE_SCRIPT_URL","MapPicker","apiKey","defaultLocation","zoom","onChangeLocation","onChangeZoom","style","className","mapTypeId","icon","MAP_VIEW_ID","random","toString","substr","map","React","useRef","marker","handleChangeLocation","currentLocation","current","getPosition","handleChangeZoom","getZoom","loadMap","Google","window","google","validLocation","maps","Map","getElementById","center","Marker","position","draggable","event","addListener","setPosition","clickedLocation","latLng","useEffect","then","setCenter","setZoom","componentStyle","Object","assign","width","height"],"mappings":"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"} \ No newline at end of file diff --git a/example/.eslintcache b/example/.eslintcache index 2a13272..45b4768 100644 --- a/example/.eslintcache +++ b/example/.eslintcache @@ -1 +1 @@ -[{"D:\\Github\\react-google-map-picker\\example\\src\\index.js":"1","D:\\Github\\react-google-map-picker\\example\\src\\App.js":"2"},{"size":171,"mtime":1625231775038,"results":"3","hashOfConfig":"4"},{"size":1745,"mtime":1625238416551,"results":"5","hashOfConfig":"4"},{"filePath":"6","messages":"7","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"8"},"1koxxa8",{"filePath":"9","messages":"10","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"D:\\Github\\react-google-map-picker\\example\\src\\index.js",[],["11","12"],"D:\\Github\\react-google-map-picker\\example\\src\\App.js",[],{"ruleId":"13","replacedBy":"14"},{"ruleId":"15","replacedBy":"16"},"no-native-reassign",["17"],"no-negated-in-lhs",["18"],"no-global-assign","no-unsafe-negation"] \ No newline at end of file +[{"D:\\projects\\react-google-map-picker\\example\\src\\index.js":"1","D:\\projects\\react-google-map-picker\\example\\src\\App.js":"2"},{"size":171,"mtime":1685281093784,"results":"3","hashOfConfig":"4"},{"size":1854,"mtime":1685346501080,"results":"5","hashOfConfig":"4"},{"filePath":"6","messages":"7","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"8"},"iqlpn9",{"filePath":"9","messages":"10","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"D:\\projects\\react-google-map-picker\\example\\src\\index.js",[],["11","12"],"D:\\projects\\react-google-map-picker\\example\\src\\App.js",[],{"ruleId":"13","replacedBy":"14"},{"ruleId":"15","replacedBy":"16"},"no-native-reassign",["17"],"no-negated-in-lhs",["18"],"no-global-assign","no-unsafe-negation"] \ No newline at end of file diff --git a/example/src/App.js b/example/src/App.js index 7d988d0..fc99d5b 100644 --- a/example/src/App.js +++ b/example/src/App.js @@ -54,6 +54,7 @@ const App = () => { style={{height:'700px'}} onChangeLocation={handleChangeLocation} onChangeZoom={handleChangeZoom} + icon={"https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png"} apiKey='AIzaSyD07E1VvpsN_0FvsmKAj4nK9GnLq-9jtj8'/>
diff --git a/src/MapPicker.tsx b/src/MapPicker.tsx index 41ef917..719c6d3 100644 --- a/src/MapPicker.tsx +++ b/src/MapPicker.tsx @@ -50,7 +50,8 @@ type Props = { onChangeZoom?(zoom: number): void; style?: any; className?: string; - mapTypeId?: MapTypeId + mapTypeId?: MapTypeId; + icon: any; // https://developers.google.com/maps/documentation/javascript/markers#icons } function isValidLocation(location: Location) { @@ -59,7 +60,7 @@ function isValidLocation(location: Location) { const GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key='; -const MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId }) => { +const MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId, icon }) => { const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9); const map = React.useRef(null); const marker = React.useRef(null); @@ -90,7 +91,8 @@ const MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocat marker.current = new Google.maps.Marker({ position: validLocation, map: map.current, - draggable: true + draggable: true, + icon }); Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation); } else { @@ -126,8 +128,6 @@ const MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocat const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {}); - return ( -
- ); + return
}; export default MapPicker; \ No newline at end of file From 79d93571f1718c2dc9fc6db61144d9f60093ceb6 Mon Sep 17 00:00:00 2001 From: kashaudhan Date: Mon, 29 May 2023 16:11:44 +0530 Subject: [PATCH 2/2] marker icon type support --- dist/MapPicker.d.ts | 3 ++- dist/index.js.map | 2 +- dist/index.modern.js.map | 2 +- example/.eslintcache | 2 +- example/src/App.js | 6 +++--- package.json | 1 + src/MapPicker.tsx | 7 ++++--- yarn.lock | 5 +++++ 8 files changed, 18 insertions(+), 10 deletions(-) diff --git a/dist/MapPicker.d.ts b/dist/MapPicker.d.ts index eef66c8..82afc8f 100644 --- a/dist/MapPicker.d.ts +++ b/dist/MapPicker.d.ts @@ -1,3 +1,4 @@ +/// import { FC } from 'react'; declare type Location = { lat: number; @@ -18,7 +19,7 @@ declare type Props = { style?: any; className?: string; mapTypeId?: MapTypeId; - icon: any; + icon: string | google.maps.Icon | google.maps.Symbol | null | undefined; }; declare const MapPicker: FC; export default MapPicker; diff --git a/dist/index.js.map b/dist/index.js.map index 806abb4..02a23d2 100644 --- a/dist/index.js.map +++ b/dist/index.js.map @@ -1 +1 @@ -{"version":3,"file":"index.js","sources":["../src/MapPicker.tsx"],"sourcesContent":["import React, { FC } from 'react';\r\n\r\nfunction isGoogleMapScriptLoaded(id: string): boolean {\r\n const scripts: HTMLCollectionOf = document.head.getElementsByTagName('script');\r\n for (let i: number = 0; i < scripts.length; i++) {\r\n if (scripts[i].getAttribute('id') === id) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n}\r\n\r\nfunction loadScript(src: string, id: string) {\r\n if (isGoogleMapScriptLoaded(id)) {\r\n // Make sure the script is loaded\r\n return new Promise((resolve) => setTimeout(resolve, 500));\r\n }\r\n\r\n const script = document.createElement('script');\r\n script.setAttribute('async', '');\r\n script.setAttribute('id', id);\r\n script.src = src;\r\n (document.querySelector('head') as any).appendChild(script);\r\n\r\n return new Promise((resolve) => {\r\n script.onload = () => {\r\n resolve();\r\n };\r\n });\r\n}\r\n\r\ntype Location = {\r\n lat: number,\r\n lng: number\r\n}\r\n\r\nenum MapTypeId {\r\n Roadmap = 'roadmap',\r\n Satellite = 'satellite',\r\n Hybrid = 'hybrid',\r\n Terrain = 'terrain'\r\n}\r\n\r\ntype Props = {\r\n apiKey: string,\r\n defaultLocation: Location;\r\n zoom?: number;\r\n onChangeLocation?(lat: number, lng: number): void;\r\n onChangeZoom?(zoom: number): void;\r\n style?: any;\r\n className?: string;\r\n mapTypeId?: MapTypeId;\r\n icon: any; // https://developers.google.com/maps/documentation/javascript/markers#icons\r\n}\r\n\r\nfunction isValidLocation(location: Location) {\r\n return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180;\r\n}\r\n\r\nconst GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key=';\r\n\r\nconst MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId, icon }) => {\r\n const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9);\r\n const map = React.useRef(null);\r\n const marker = React.useRef(null);\r\n\r\n function handleChangeLocation() {\r\n if (onChangeLocation) {\r\n const currentLocation = marker.current.getPosition();\r\n onChangeLocation(currentLocation.lat(), currentLocation.lng());\r\n }\r\n }\r\n\r\n function handleChangeZoom() {\r\n onChangeZoom && onChangeZoom(map.current.getZoom());\r\n }\r\n\r\n function loadMap() {\r\n const Google = (window as any).google;\r\n const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 };\r\n\r\n map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID),\r\n {\r\n center: validLocation,\r\n zoom: zoom,\r\n ...(mapTypeId && { mapTypeId })\r\n });\r\n\r\n if (!marker.current) {\r\n marker.current = new Google.maps.Marker({\r\n position: validLocation,\r\n map: map.current,\r\n draggable: true,\r\n icon\r\n });\r\n Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation);\r\n } else {\r\n marker.current.setPosition(validLocation);\r\n }\r\n\r\n map.current.addListener('click', function (event: any) {\r\n const clickedLocation = event.latLng;\r\n\r\n marker.current.setPosition(clickedLocation);\r\n handleChangeLocation();\r\n });\r\n\r\n map.current.addListener('zoom_changed', handleChangeZoom);\r\n }\r\n\r\n React.useEffect(() => {\r\n loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap);\r\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n React.useEffect(() => {\r\n if (marker.current) {\r\n map.current.setCenter(defaultLocation);\r\n marker.current.setPosition(defaultLocation);\r\n }\r\n }, [defaultLocation]);\r\n\r\n React.useEffect(() => {\r\n if (map.current) {\r\n map.current.setZoom(zoom);\r\n }\r\n }, [zoom]);\r\n\r\n const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {});\r\n\r\n return
\r\n};\r\nexport default MapPicker;"],"names":["isGoogleMapScriptLoaded","id","scripts","document","head","getElementsByTagName","i","length","getAttribute","loadScript","src","Promise","resolve","setTimeout","script","createElement","setAttribute","querySelector","appendChild","onload","MapTypeId","isValidLocation","location","Math","abs","lat","lng","GOOGLE_SCRIPT_URL","MapPicker","apiKey","defaultLocation","zoom","onChangeLocation","onChangeZoom","style","className","mapTypeId","icon","MAP_VIEW_ID","random","toString","substr","map","React","useRef","marker","handleChangeLocation","currentLocation","current","getPosition","handleChangeZoom","getZoom","loadMap","Google","window","google","validLocation","maps","Map","getElementById","center","Marker","position","draggable","event","addListener","setPosition","clickedLocation","latLng","useEffect","then","setCenter","setZoom","componentStyle","Object","assign","width","height"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"index.js","sources":["../src/MapPicker.tsx"],"sourcesContent":["/* eslint-disable prettier/prettier */\r\nimport React, { FC } from 'react';\r\n\r\nfunction isGoogleMapScriptLoaded(id: string): boolean {\r\n const scripts: HTMLCollectionOf = document.head.getElementsByTagName('script');\r\n for (let i: number = 0; i < scripts.length; i++) {\r\n if (scripts[i].getAttribute('id') === id) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n}\r\n\r\nfunction loadScript(src: string, id: string) {\r\n if (isGoogleMapScriptLoaded(id)) {\r\n // Make sure the script is loaded\r\n return new Promise((resolve) => setTimeout(resolve, 500));\r\n }\r\n\r\n const script = document.createElement('script');\r\n script.setAttribute('async', '');\r\n script.setAttribute('id', id);\r\n script.src = src;\r\n (document.querySelector('head') as any).appendChild(script);\r\n\r\n return new Promise((resolve) => {\r\n script.onload = () => {\r\n resolve();\r\n };\r\n });\r\n}\r\n\r\ntype Location = {\r\n lat: number,\r\n lng: number\r\n}\r\n\r\nenum MapTypeId {\r\n Roadmap = 'roadmap',\r\n Satellite = 'satellite',\r\n Hybrid = 'hybrid',\r\n Terrain = 'terrain'\r\n}\r\n\r\ntype Props = {\r\n apiKey: string,\r\n defaultLocation: Location;\r\n zoom?: number;\r\n onChangeLocation?(lat: number, lng: number): void;\r\n onChangeZoom?(zoom: number): void;\r\n style?: any;\r\n className?: string;\r\n mapTypeId?: MapTypeId;\r\n icon: string | google.maps.Icon | google.maps.Symbol | null | undefined; // https://developers.google.com/maps/documentation/javascript/markers#icons\r\n}\r\n\r\nfunction isValidLocation(location: Location) {\r\n return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180;\r\n}\r\n\r\nconst GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key=';\r\n\r\nconst MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId, icon }) => {\r\n const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9);\r\n const map = React.useRef(null);\r\n const marker = React.useRef(null);\r\n\r\n function handleChangeLocation() {\r\n if (onChangeLocation) {\r\n const currentLocation = marker.current.getPosition();\r\n onChangeLocation(currentLocation.lat(), currentLocation.lng());\r\n }\r\n }\r\n\r\n function handleChangeZoom() {\r\n onChangeZoom && onChangeZoom(map.current.getZoom());\r\n }\r\n\r\n function loadMap() {\r\n const Google = window.google;\r\n const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 };\r\n\r\n map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID)!,\r\n {\r\n center: validLocation,\r\n zoom: zoom,\r\n ...(mapTypeId && { mapTypeId })\r\n });\r\n\r\n if (!marker.current) {\r\n marker.current = new Google.maps.Marker({\r\n position: validLocation,\r\n map: map.current,\r\n draggable: true,\r\n icon\r\n });\r\n Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation);\r\n } else {\r\n marker.current.setPosition(validLocation);\r\n }\r\n\r\n map.current.addListener('click', function (event: any) {\r\n const clickedLocation = event.latLng;\r\n\r\n marker.current.setPosition(clickedLocation);\r\n handleChangeLocation();\r\n });\r\n\r\n map.current.addListener('zoom_changed', handleChangeZoom);\r\n }\r\n\r\n React.useEffect(() => {\r\n loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap);\r\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n React.useEffect(() => {\r\n if (marker.current) {\r\n map.current.setCenter(defaultLocation);\r\n marker.current.setPosition(defaultLocation);\r\n }\r\n }, [defaultLocation]);\r\n\r\n React.useEffect(() => {\r\n if (map.current) {\r\n map.current.setZoom(zoom);\r\n }\r\n }, [zoom]);\r\n\r\n const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {});\r\n\r\n return
\r\n};\r\nexport default MapPicker;"],"names":["isGoogleMapScriptLoaded","id","scripts","document","head","getElementsByTagName","i","length","getAttribute","loadScript","src","Promise","resolve","setTimeout","script","createElement","setAttribute","querySelector","appendChild","onload","MapTypeId","isValidLocation","location","Math","abs","lat","lng","GOOGLE_SCRIPT_URL","MapPicker","apiKey","defaultLocation","zoom","onChangeLocation","onChangeZoom","style","className","mapTypeId","icon","MAP_VIEW_ID","random","toString","substr","map","React","useRef","marker","handleChangeLocation","currentLocation","current","getPosition","handleChangeZoom","getZoom","loadMap","Google","window","google","validLocation","maps","Map","getElementById","center","Marker","position","draggable","event","addListener","setPosition","clickedLocation","latLng","useEffect","then","setCenter","setZoom","componentStyle","Object","assign","width","height"],"mappings":"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"} \ No newline at end of file diff --git a/dist/index.modern.js.map b/dist/index.modern.js.map index 8d6cce5..88091ba 100644 --- a/dist/index.modern.js.map +++ b/dist/index.modern.js.map @@ -1 +1 @@ -{"version":3,"file":"index.modern.js","sources":["../src/MapPicker.tsx"],"sourcesContent":["import React, { FC } from 'react';\r\n\r\nfunction isGoogleMapScriptLoaded(id: string): boolean {\r\n const scripts: HTMLCollectionOf = document.head.getElementsByTagName('script');\r\n for (let i: number = 0; i < scripts.length; i++) {\r\n if (scripts[i].getAttribute('id') === id) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n}\r\n\r\nfunction loadScript(src: string, id: string) {\r\n if (isGoogleMapScriptLoaded(id)) {\r\n // Make sure the script is loaded\r\n return new Promise((resolve) => setTimeout(resolve, 500));\r\n }\r\n\r\n const script = document.createElement('script');\r\n script.setAttribute('async', '');\r\n script.setAttribute('id', id);\r\n script.src = src;\r\n (document.querySelector('head') as any).appendChild(script);\r\n\r\n return new Promise((resolve) => {\r\n script.onload = () => {\r\n resolve();\r\n };\r\n });\r\n}\r\n\r\ntype Location = {\r\n lat: number,\r\n lng: number\r\n}\r\n\r\nenum MapTypeId {\r\n Roadmap = 'roadmap',\r\n Satellite = 'satellite',\r\n Hybrid = 'hybrid',\r\n Terrain = 'terrain'\r\n}\r\n\r\ntype Props = {\r\n apiKey: string,\r\n defaultLocation: Location;\r\n zoom?: number;\r\n onChangeLocation?(lat: number, lng: number): void;\r\n onChangeZoom?(zoom: number): void;\r\n style?: any;\r\n className?: string;\r\n mapTypeId?: MapTypeId;\r\n icon: any; // https://developers.google.com/maps/documentation/javascript/markers#icons\r\n}\r\n\r\nfunction isValidLocation(location: Location) {\r\n return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180;\r\n}\r\n\r\nconst GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key=';\r\n\r\nconst MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId, icon }) => {\r\n const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9);\r\n const map = React.useRef(null);\r\n const marker = React.useRef(null);\r\n\r\n function handleChangeLocation() {\r\n if (onChangeLocation) {\r\n const currentLocation = marker.current.getPosition();\r\n onChangeLocation(currentLocation.lat(), currentLocation.lng());\r\n }\r\n }\r\n\r\n function handleChangeZoom() {\r\n onChangeZoom && onChangeZoom(map.current.getZoom());\r\n }\r\n\r\n function loadMap() {\r\n const Google = (window as any).google;\r\n const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 };\r\n\r\n map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID),\r\n {\r\n center: validLocation,\r\n zoom: zoom,\r\n ...(mapTypeId && { mapTypeId })\r\n });\r\n\r\n if (!marker.current) {\r\n marker.current = new Google.maps.Marker({\r\n position: validLocation,\r\n map: map.current,\r\n draggable: true,\r\n icon\r\n });\r\n Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation);\r\n } else {\r\n marker.current.setPosition(validLocation);\r\n }\r\n\r\n map.current.addListener('click', function (event: any) {\r\n const clickedLocation = event.latLng;\r\n\r\n marker.current.setPosition(clickedLocation);\r\n handleChangeLocation();\r\n });\r\n\r\n map.current.addListener('zoom_changed', handleChangeZoom);\r\n }\r\n\r\n React.useEffect(() => {\r\n loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap);\r\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n React.useEffect(() => {\r\n if (marker.current) {\r\n map.current.setCenter(defaultLocation);\r\n marker.current.setPosition(defaultLocation);\r\n }\r\n }, [defaultLocation]);\r\n\r\n React.useEffect(() => {\r\n if (map.current) {\r\n map.current.setZoom(zoom);\r\n }\r\n }, [zoom]);\r\n\r\n const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {});\r\n\r\n return
\r\n};\r\nexport default MapPicker;"],"names":["isGoogleMapScriptLoaded","id","scripts","document","head","getElementsByTagName","i","length","getAttribute","loadScript","src","Promise","resolve","setTimeout","script","createElement","setAttribute","querySelector","appendChild","onload","MapTypeId","isValidLocation","location","Math","abs","lat","lng","GOOGLE_SCRIPT_URL","MapPicker","apiKey","defaultLocation","zoom","onChangeLocation","onChangeZoom","style","className","mapTypeId","icon","MAP_VIEW_ID","random","toString","substr","map","React","useRef","marker","handleChangeLocation","currentLocation","current","getPosition","handleChangeZoom","getZoom","loadMap","Google","window","google","validLocation","maps","Map","getElementById","center","Marker","position","draggable","event","addListener","setPosition","clickedLocation","latLng","useEffect","then","setCenter","setZoom","componentStyle","Object","assign","width","height"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"index.modern.js","sources":["../src/MapPicker.tsx"],"sourcesContent":["/* eslint-disable prettier/prettier */\r\nimport React, { FC } from 'react';\r\n\r\nfunction isGoogleMapScriptLoaded(id: string): boolean {\r\n const scripts: HTMLCollectionOf = document.head.getElementsByTagName('script');\r\n for (let i: number = 0; i < scripts.length; i++) {\r\n if (scripts[i].getAttribute('id') === id) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n}\r\n\r\nfunction loadScript(src: string, id: string) {\r\n if (isGoogleMapScriptLoaded(id)) {\r\n // Make sure the script is loaded\r\n return new Promise((resolve) => setTimeout(resolve, 500));\r\n }\r\n\r\n const script = document.createElement('script');\r\n script.setAttribute('async', '');\r\n script.setAttribute('id', id);\r\n script.src = src;\r\n (document.querySelector('head') as any).appendChild(script);\r\n\r\n return new Promise((resolve) => {\r\n script.onload = () => {\r\n resolve();\r\n };\r\n });\r\n}\r\n\r\ntype Location = {\r\n lat: number,\r\n lng: number\r\n}\r\n\r\nenum MapTypeId {\r\n Roadmap = 'roadmap',\r\n Satellite = 'satellite',\r\n Hybrid = 'hybrid',\r\n Terrain = 'terrain'\r\n}\r\n\r\ntype Props = {\r\n apiKey: string,\r\n defaultLocation: Location;\r\n zoom?: number;\r\n onChangeLocation?(lat: number, lng: number): void;\r\n onChangeZoom?(zoom: number): void;\r\n style?: any;\r\n className?: string;\r\n mapTypeId?: MapTypeId;\r\n icon: string | google.maps.Icon | google.maps.Symbol | null | undefined; // https://developers.google.com/maps/documentation/javascript/markers#icons\r\n}\r\n\r\nfunction isValidLocation(location: Location) {\r\n return location && Math.abs(location.lat) <= 90 && Math.abs(location.lng) <= 180;\r\n}\r\n\r\nconst GOOGLE_SCRIPT_URL = 'https://maps.googleapis.com/maps/api/js?libraries=places&key=';\r\n\r\nconst MapPicker: FC = ({ apiKey, defaultLocation, zoom = 7, onChangeLocation, onChangeZoom, style, className, mapTypeId, icon }) => {\r\n const MAP_VIEW_ID = 'google-map-view-' + Math.random().toString(36).substr(2, 9);\r\n const map = React.useRef(null);\r\n const marker = React.useRef(null);\r\n\r\n function handleChangeLocation() {\r\n if (onChangeLocation) {\r\n const currentLocation = marker.current.getPosition();\r\n onChangeLocation(currentLocation.lat(), currentLocation.lng());\r\n }\r\n }\r\n\r\n function handleChangeZoom() {\r\n onChangeZoom && onChangeZoom(map.current.getZoom());\r\n }\r\n\r\n function loadMap() {\r\n const Google = window.google;\r\n const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 };\r\n\r\n map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID)!,\r\n {\r\n center: validLocation,\r\n zoom: zoom,\r\n ...(mapTypeId && { mapTypeId })\r\n });\r\n\r\n if (!marker.current) {\r\n marker.current = new Google.maps.Marker({\r\n position: validLocation,\r\n map: map.current,\r\n draggable: true,\r\n icon\r\n });\r\n Google.maps.event.addListener(marker.current, 'dragend', handleChangeLocation);\r\n } else {\r\n marker.current.setPosition(validLocation);\r\n }\r\n\r\n map.current.addListener('click', function (event: any) {\r\n const clickedLocation = event.latLng;\r\n\r\n marker.current.setPosition(clickedLocation);\r\n handleChangeLocation();\r\n });\r\n\r\n map.current.addListener('zoom_changed', handleChangeZoom);\r\n }\r\n\r\n React.useEffect(() => {\r\n loadScript(GOOGLE_SCRIPT_URL + apiKey, 'google-maps-' + apiKey).then(loadMap);\r\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n React.useEffect(() => {\r\n if (marker.current) {\r\n map.current.setCenter(defaultLocation);\r\n marker.current.setPosition(defaultLocation);\r\n }\r\n }, [defaultLocation]);\r\n\r\n React.useEffect(() => {\r\n if (map.current) {\r\n map.current.setZoom(zoom);\r\n }\r\n }, [zoom]);\r\n\r\n const componentStyle = Object.assign({ width: '100%', height: '600px' }, style || {});\r\n\r\n return
\r\n};\r\nexport default MapPicker;"],"names":["isGoogleMapScriptLoaded","id","scripts","document","head","getElementsByTagName","i","length","getAttribute","loadScript","src","Promise","resolve","setTimeout","script","createElement","setAttribute","querySelector","appendChild","onload","MapTypeId","isValidLocation","location","Math","abs","lat","lng","GOOGLE_SCRIPT_URL","MapPicker","apiKey","defaultLocation","zoom","onChangeLocation","onChangeZoom","style","className","mapTypeId","icon","MAP_VIEW_ID","random","toString","substr","map","React","useRef","marker","handleChangeLocation","currentLocation","current","getPosition","handleChangeZoom","getZoom","loadMap","Google","window","google","validLocation","maps","Map","getElementById","center","Marker","position","draggable","event","addListener","setPosition","clickedLocation","latLng","useEffect","then","setCenter","setZoom","componentStyle","Object","assign","width","height"],"mappings":"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"} \ No newline at end of file diff --git a/example/.eslintcache b/example/.eslintcache index 45b4768..bcc3e90 100644 --- a/example/.eslintcache +++ b/example/.eslintcache @@ -1 +1 @@ -[{"D:\\projects\\react-google-map-picker\\example\\src\\index.js":"1","D:\\projects\\react-google-map-picker\\example\\src\\App.js":"2"},{"size":171,"mtime":1685281093784,"results":"3","hashOfConfig":"4"},{"size":1854,"mtime":1685346501080,"results":"5","hashOfConfig":"4"},{"filePath":"6","messages":"7","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"8"},"iqlpn9",{"filePath":"9","messages":"10","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"D:\\projects\\react-google-map-picker\\example\\src\\index.js",[],["11","12"],"D:\\projects\\react-google-map-picker\\example\\src\\App.js",[],{"ruleId":"13","replacedBy":"14"},{"ruleId":"15","replacedBy":"16"},"no-native-reassign",["17"],"no-negated-in-lhs",["18"],"no-global-assign","no-unsafe-negation"] \ No newline at end of file +[{"D:\\projects\\react-google-map-picker\\example\\src\\index.js":"1","D:\\projects\\react-google-map-picker\\example\\src\\App.js":"2"},{"size":171,"mtime":1685281093784,"results":"3","hashOfConfig":"4"},{"size":1866,"mtime":1685356655149,"results":"5","hashOfConfig":"4"},{"filePath":"6","messages":"7","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"8"},"iqlpn9",{"filePath":"9","messages":"10","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"D:\\projects\\react-google-map-picker\\example\\src\\index.js",[],["11","12"],"D:\\projects\\react-google-map-picker\\example\\src\\App.js",[],{"ruleId":"13","replacedBy":"14"},{"ruleId":"15","replacedBy":"16"},"no-native-reassign",["17"],"no-negated-in-lhs",["18"],"no-global-assign","no-unsafe-negation"] \ No newline at end of file diff --git a/example/src/App.js b/example/src/App.js index fc99d5b..8aa537e 100644 --- a/example/src/App.js +++ b/example/src/App.js @@ -33,9 +33,9 @@ const App = () => { -
+
-
+

Map 1 (roadmap)

{ apiKey='AIzaSyD07E1VvpsN_0FvsmKAj4nK9GnLq-9jtj8'/>
-
+

Map 2 (satellite)

= ({ apiKey, defaultLocation, zoom = 7, onChangeLocat } function loadMap() { - const Google = (window as any).google; + const Google = window.google; const validLocation = isValidLocation(defaultLocation) ? defaultLocation : { lat: 0, lng: 0 }; - map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID), + map.current = new Google.maps.Map(document.getElementById(MAP_VIEW_ID)!, { center: validLocation, zoom: zoom, diff --git a/yarn.lock b/yarn.lock index cd39a27..e37c70f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1895,6 +1895,11 @@ "@types/minimatch" "*" "@types/node" "*" +"@types/google.maps@^3.53.2": + version "3.53.2" + resolved "https://registry.yarnpkg.com/@types/google.maps/-/google.maps-3.53.2.tgz#ba921cc7900b72d4f58538a770a99bfadd9952a2" + integrity sha512-rgTa3R5DyFTcjX4hmuGs0XR+kD4M5tZ14lcyYzDDJGr5h0JYj7DbbNZRZNJKDzZOGH3fOXWpIbZGj3BxZbpmjw== + "@types/graceful-fs@^4.1.2": version "4.1.4" resolved "https://registry.yarnpkg.com/@types/graceful-fs/-/graceful-fs-4.1.4.tgz#4ff9f641a7c6d1a3508ff88bc3141b152772e753"