New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
svelte-google-maps-api
Advanced tools
svelte-google-maps-api - npm Package Compare versions
Comparing version 0.0.9 to 0.0.10
@@ -5,27 +5,27 @@ /// <reference types="@types/google.maps" /> | ||
| props: { | ||
| position?: google.maps.LatLng | google.maps.LatLngLiteral | null | undefined; | ||
| options?: google.maps.MarkerOptions | null | undefined; | ||
| onClick?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onClickableChanged?: (() => void) | null | undefined; | ||
| onCursorChanged?: (() => void) | null | undefined; | ||
| onAnimationChanged?: (() => void) | null | undefined; | ||
| onDblClick?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onDrag?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onDragEnd?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onDraggableChanged?: (() => void) | null | undefined; | ||
| onDragStart?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onFlatChanged?: (() => void) | null | undefined; | ||
| onIconChanged?: (() => void) | null | undefined; | ||
| onMouseDown?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onMouseOut?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onMouseOver?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onMouseUp?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onPositionChanged?: (() => void) | null | undefined; | ||
| onRightClick?: ((e: google.maps.MapMouseEvent) => void) | null | undefined; | ||
| onShapeChanged?: (() => void) | null | undefined; | ||
| onTitleChanged?: (() => void) | null | undefined; | ||
| onVisibleChanged?: (() => void) | null | undefined; | ||
| onZindexChanged?: (() => void) | null | undefined; | ||
| onLoad?: ((marker: google.maps.Marker) => void) | null | undefined; | ||
| onUnmount?: ((marker: google.maps.Marker) => void) | null | undefined; | ||
| position: google.maps.LatLng | google.maps.LatLngLiteral; | ||
| options: google.maps.MarkerOptions; | ||
| onClick: (e: google.maps.MapMouseEvent) => void; | ||
| onClickableChanged: () => void; | ||
| onCursorChanged: () => void; | ||
| onAnimationChanged: () => void; | ||
| onDblClick: (e: google.maps.MapMouseEvent) => void; | ||
| onDrag: (e: google.maps.MapMouseEvent) => void; | ||
| onDragEnd: (e: google.maps.MapMouseEvent) => void; | ||
| onDraggableChanged: () => void; | ||
| onDragStart: (e: google.maps.MapMouseEvent) => void; | ||
| onFlatChanged: () => void; | ||
| onIconChanged: () => void; | ||
| onMouseDown: (e: google.maps.MapMouseEvent) => void; | ||
| onMouseOut: (e: google.maps.MapMouseEvent) => void; | ||
| onMouseOver: (e: google.maps.MapMouseEvent) => void; | ||
| onMouseUp: (e: google.maps.MapMouseEvent) => void; | ||
| onPositionChanged: () => void; | ||
| onRightClick: (e: google.maps.MapMouseEvent) => void; | ||
| onShapeChanged: () => void; | ||
| onTitleChanged: () => void; | ||
| onVisibleChanged: () => void; | ||
| onZindexChanged: () => void; | ||
| onLoad: (marker: google.maps.Marker) => void; | ||
| onUnmount: (marker: google.maps.Marker) => void; | ||
| }; | ||
@@ -32,0 +32,0 @@ events: { |
| { | ||
| "name": "svelte-google-maps-api", | ||
| "version": "0.0.9", | ||
| "version": "0.0.10", | ||
| "scripts": { | ||
@@ -5,0 +5,0 @@ "dev": "vite dev", |
103
README.md
@@ -5,5 +5,13 @@ ## svelte-google-maps-api | ||
| ・Google Map JavaScript API Wrapper for Svelte | ||
| ## Feature | ||
| ・Google Map JavaScript API Wrapper for Svelte<br> | ||
| ・Svelte 4 Supported | ||
| ## Install | ||
| ``` | ||
| npm install svelte-google-maps-api | ||
| ``` | ||
| ## Component | ||
| ### LoadScript | ||
@@ -28,20 +36,20 @@ | ||
| |-------------------------|----------|-------------| | ||
| | `id` | `string` | An identifier for the map container. | | ||
| | `options` | `google.maps.MapOptions` | Google Map options object. Default is `{}`. | | ||
| | `onDblClick` | `Function`| Callback function that is called when the map is double clicked. | | ||
| | `onDragEnd` | `Function`| Callback function that is called when the drag ends. | | ||
| | `onDragStart` | `Function`| Callback function that is called when the drag starts. | | ||
| | `onMouseDown` | `Function`| Callback function that is called when the mouse button is pressed. | | ||
| | `onMouseMove` | `Function`| Callback function that is called when the mouse pointer moves. | | ||
| | `onMouseOut` | `Function`| Callback function that is called when the mouse pointer moves out of the map. | | ||
| | `onMouseOver` | `Function`| Callback function that is called when the mouse pointer moves over the map. | | ||
| | `onMouseUp` | `Function`| Callback function that is called when the mouse button is released. | | ||
| | `onRightClick` | `Function`| Callback function that is called when the map is right clicked. | | ||
| | `onClick` | `Function`| Callback function that is called when the map is clicked. | | ||
| | `onDrag` | `Function`| Callback function that is called when the map is dragged. | | ||
| | `onCenterChanged` | `Function`| Callback function that is called when the center of the map changes. | | ||
| | `onLoad` | `Function`| Callback function that is called when the map is loaded. | | ||
| | `onUnmount` | `Function`| Callback function that is called when the map unmounts. | | ||
| | `mapContainerStyle` | `string` | Style for the map container. Default is 'width:100%;height:100%'. | | ||
| | `mapContainerClassName` | `string` | Class name for the map container. | | ||
| | id | `string` | An identifier for the map container. | | ||
| | options | `google.maps.MapOptions` | Google Map options object. | | ||
| | onClick | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the map is clicked. | | ||
| | onDblClick | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the map is double clicked. | | ||
| | onDragEnd | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the drag ends. | | ||
| | onDragStart | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the drag starts. | | ||
| | onMouseDown | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the mouse button is pressed. | | ||
| | onMouseMove | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the mouse pointer moves. | | ||
| | onMouseOut | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the mouse pointer moves out of the map. | | ||
| | onMouseOver | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the mouse pointer moves over the map. | | ||
| | onMouseUp | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the mouse button is released. | | ||
| | onRightClick | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the map is right clicked. | | ||
| | onDrag | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the map is dragged. | | ||
| | onCenterChanged | `(e: google.maps.MapMouseEvent) => void`| Callback function that is called when the center of the map changes. | | ||
| | onLoad | `(map: google.maps.Map) => void`| Callback function that is called when the map is loaded. | | ||
| | onUnmount | `(map: google.maps.Map) => void`| Callback function that is called when the map unmounts. | | ||
| | mapContainerStyle | `string` | Style for the map container. Default is 'width:100%;height:100%'. | | ||
| | mapContainerClassName | `string` | Class name for the map container. | | ||
@@ -54,4 +62,3 @@ ### Usage | ||
| <script lang="ts"> | ||
| // import the component and other necessary things | ||
| import LoadScript from 'svelte-google-maps-api/LoadScript.svelte'; | ||
| import LoadScript from 'svelte-google-maps-api/LoadScript.svelte'; | ||
| import GoogleMap from 'svelte-google-maps-api//GoogleMap.svelte'; | ||
@@ -80,27 +87,27 @@ | ||
| |---------------------|-----------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | ||
| | position | `google.maps.LatLng \| google.maps.LatLngLiteral \| null` | Specifies the position of the marker. | | ||
| | options | `google.maps.MarkerOptions \| null` | An object containing options for the marker, such as its icon, title, etc. | | ||
| | onClick | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the marker is clicked. | | ||
| | onClickableChanged | `(() => void) \| null` | Event handler for when the marker's 'clickable' property is changed. | | ||
| | onCursorChanged | `(() => void) \| null` | Event handler for when the marker's 'cursor' property is changed. | | ||
| | onAnimationChanged | `(() => void) \| null` | Event handler for when the marker's 'animation' property is changed. | | ||
| | onDblClick | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the marker is double-clicked. | | ||
| | onDrag | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the marker is dragged. | | ||
| | onDragEnd | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the dragging of the marker ends. | | ||
| | onDraggableChanged | `(() => void) \| null` | Event handler for when the marker's 'draggable' property is changed. | | ||
| | onDragStart | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the dragging of the marker starts. | | ||
| | onFlatChanged | `(() => void) \| null` | Event handler for when the marker's 'flat' property is changed. | | ||
| | onIconChanged | `(() => void) \| null` | Event handler for when the marker's 'icon' property is changed. | | ||
| | onMouseDown | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the mouse button is pressed on the marker. | | ||
| | onMouseOut | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the mouse leaves the area of the marker. | | ||
| | onMouseOver | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the mouse enters the area of the marker. | | ||
| | onMouseUp | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the mouse button is released on the marker. | | ||
| | onPositionChanged | `(() => void) \| null` | Event handler for when the marker's 'position' property is changed. | | ||
| | onRightClick | `((e: google.maps.MapMouseEvent) => void) \| null` | Event handler for when the marker is right-clicked. | | ||
| | onShapeChanged | `(() => void) \| null` | Event handler for when the marker's 'shape' property is changed. | | ||
| | onTitleChanged | `(() => void) \| null` | Event handler for when the marker's 'title' property is changed. | | ||
| | onVisibleChanged | `(() => void) \| null` | Event handler for when the marker's 'visible' property is changed. | | ||
| | onZindexChanged | `(() => void) \| null` | Event handler for when the marker's 'zIndex' property is changed. | | ||
| | onLoad | `((marker: google.maps.Marker) => void) \| null` | Event handler for when the marker is added to the map. This event fires after the marker's position has been changed for the first time, but before the marker's `click` event and the map's `mousemove` and `idle` events. | | ||
| | onUnmount | `((marker: google.maps.Marker) => void) \| null` | Event handler for when the marker is removed from the map. | | ||
| | position | `google.maps.LatLng \| google.maps.LatLngLiteral` | Specifies the position of the marker. | | ||
| | options | `google.maps.MarkerOptions` | An object containing options for the marker, such as its icon, title, etc. | | ||
| | onClick | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the marker is clicked. | | ||
| | onClickableChanged | `(() => void)` | Event handler for when the marker's 'clickable' property is changed. | | ||
| | onCursorChanged | `(() => void)` | Event handler for when the marker's 'cursor' property is changed. | | ||
| | onAnimationChanged | `(() => void)` | Event handler for when the marker's 'animation' property is changed. | | ||
| | onDblClick | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the marker is double-clicked. | | ||
| | onDrag | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the marker is dragged. | | ||
| | onDragEnd | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the dragging of the marker ends. | | ||
| | onDraggableChanged | `(() => void)` | Event handler for when the marker's 'draggable' property is changed. | | ||
| | onDragStart | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the dragging of the marker starts. | | ||
| | onFlatChanged | `(() => void)` | Event handler for when the marker's 'flat' property is changed. | | ||
| | onIconChanged | `(() => void)` | Event handler for when the marker's 'icon' property is changed. | | ||
| | onMouseDown | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the mouse button is pressed on the marker. | | ||
| | onMouseOut | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the mouse leaves the area of the marker. | | ||
| | onMouseOver | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the mouse enters the area of the marker. | | ||
| | onMouseUp | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the mouse button is released on the marker. | | ||
| | onPositionChanged | `(() => void)` | Event handler for when the marker's 'position' property is changed. | | ||
| | onRightClick | `((e: google.maps.MapMouseEvent) => void)` | Event handler for when the marker is right-clicked. | | ||
| | onShapeChanged | `(() => void)` | Event handler for when the marker's 'shape' property is changed. | | ||
| | onTitleChanged | `(() => void)` | Event handler for when the marker's 'title' property is changed. | | ||
| | onVisibleChanged | `(() => void)` | Event handler for when the marker's 'visible' property is changed. | | ||
| | onZindexChanged | `(() => void)` | Event handler for when the marker's 'zIndex' property is changed. | | ||
| | onLoad | `((marker: google.maps.Marker) => void)` | Event handler for when the marker is added to the map. This event fires after the marker's position has been changed for the first time, but before the marker's `click` event and the map's `mousemove` and `idle` events. | | ||
| | onUnmount | `((marker: google.maps.Marker) => void)` | Event handler for when the marker is removed from the map. | | ||
@@ -114,3 +121,3 @@ ### Usage | ||
| const position = {lat: 37.7749, lng: -122.4194}; // Coordinates for San Francisco | ||
| const position = {lat: 37.7749, lng: -122.4194}; | ||
| const options = { | ||
@@ -125,2 +132,2 @@ draggable: true, | ||
| </GoogleMap> | ||
| ``` | ||
| ``` |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
No alert changes
Improved metrics
- Number of lines in readme file
- increased by6.67%
128
Worsened metrics
- Total package byte prevSize
- decreased by-0.86%
164338
No dependency changes