		@@ -11,4 +11,24 @@ <!-- STORY -->

		Add this script tag to load the Google Maps JavaScript Api:
		### Load Google Maps dynamically (recommended)

		```jsx
		import React from "react";
		import { Pin } from "@trackcode/map";

		const MyMap = () => (
		<Map
		apiKey="YOU_API_KEY"
		libraries="places,geometry" // default "places"
		defaultZoom={14}
		defaultCenter={{ lat: 52.01525584, lng: 8.52046783 }}
		>
		<Pin label="A" position={{ lat: 52.02221556, lng: 8.53188536 }} />
		</Map>
		);
		```

		### Use script tag to load Google Maps

		Add this script tag to the `<head>` of your website:

		```html
		@@ -18,7 +38,7 @@ <script src="https://maps.googleapis.com/maps/api/js?key=API_KEY&libraries=places"></script>

		Full example:
		Example:

		```jsx
		import React from "react";
		import { MapWrapper, MarkerPin, MarkerDriver } from "@trackcode/map";
		import { Map, Pin, Driver } from "@trackcode/map";

		@@ -28,4 +48,4 @@ const MyMap = () => (
		<Map defaultZoom={14} defaultCenter={{ lat: 52.01525584, lng: 8.52046783 }}>
		<MarkerPin label="A" position={{ lat: 52.02221556, lng: 8.53188536 }} />
		<MarkerDriver position={{ lat: 52.01757214, lng: 8.52521203 }} />
		<Pin label="A" position={{ lat: 52.02221556, lng: 8.53188536 }} />
		<Driver position={{ lat: 52.01757214, lng: 8.52521203 }} />
		</Map>
		@@ -55,13 +75,16 @@ </div>

		\| Name \| Type \| Default \| Description \|
		\| :----------------------- \| :------ \| :------ \| :-------------------------------------------------------------------- \|
		\| children \| any \| \| `@trackcode/map` components e.g. `<Pin />`, `<Driver />` \|
		\| defaultZoom \* \| number \| \| Default zoom level \|
		\| defaultCenter \* \| object \| \| Default center \|
		\| defaultCenter.lat \| number \| \| Latitude \|
		\| defaultCenter.lng \| number \| \| Longitude \|
		\| defaultFullscreenControl \| boolean \| `true` \| The display options for the Fullscreen control. \|
		\| defaultMapTypeControl \| boolean \| `true` \| The initial enabled/disabled state of the Map type control. \|
		\| defaultStreetViewControl \| boolean \| `true` \| The initial enabled/disabled state of the Street View Pegman control. \|
		\| defaultZoomControl \| boolean \| `true` \| The enabled/disabled state of the Zoom control. \|
		\| Name \| Type \| Default \| Description \|
		\| :----------------------- \| :------ \| :------- \| :-------------------------------------------------------------------- \|
		\| apiKey \| string \| \| Google Maps api key. \|
		\| libraries \| string \| `places` \| Define libraries for Google Maps. \|
		\| version \| string \| `places` \| Use specific Google Maps version. \|
		\| children \| any \| \| `@trackcode/map` components e.g. `<Pin />`, `<Driver />` \|
		\| defaultZoom \* \| number \| \| Default zoom level \|
		\| defaultCenter \* \| object \| \| Default center \|
		\| defaultCenter.lat \| number \| \| Latitude \|
		\| defaultCenter.lng \| number \| \| Longitude \|
		\| defaultFullscreenControl \| boolean \| `true` \| The display options for the Fullscreen control. \|
		\| defaultMapTypeControl \| boolean \| `true` \| The initial enabled/disabled state of the Map type control. \|
		\| defaultStreetViewControl \| boolean \| `true` \| The initial enabled/disabled state of the Street View Pegman control. \|
		\| defaultZoomControl \| boolean \| `true` \| The enabled/disabled state of the Zoom control. \|

		@@ -68,0 +91,0 @@ \* required

dist/bundle.js

Sorry, the diff of this file is too big to display

@trackcode/map - npm Package Compare versions

Improved metrics