https://github.com/nora-soderlund/markerbundle

A way to bundle Maps JavaScript API markers that are placed at the same coordinate.
https://github.com/nora-soderlund/markerbundle

google-maps google-maps-api map maps

Last synced: 26 days ago
JSON representation

A way to bundle Maps JavaScript API markers that are placed at the same coordinate.

• Host: GitHub
• URL: https://github.com/nora-soderlund/markerbundle
• Owner: nora-soderlund
• Created: 2023-03-02T21:04:35.000Z (almost 2 years ago)
• Default Branch: master
• Last Pushed: 2023-03-06T19:51:27.000Z (almost 2 years ago)
• Last Synced: 2024-12-12T00:37:21.466Z (29 days ago)
• Topics: google-maps, google-maps-api, map, maps
• Language: JavaScript
• Homepage:
• Size: 4.88 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Get Started

```bat

npm install @nora-soderlund/MarkerBundle

```

# Example

```js

import MarkerBundle from "@nora-soderlund/MarkerBundle";

const center = {

    lat: 58.3797077874133,

    lng: 12.324640529544448

};

const map = new google.maps.Map(document.getElementById("map"), {

    center,

    zoom: 12

});

MarkerBundle.getMarkerImage().then((image) => {

    const bundle = new MarkerBundle(map, center, image);

    const infowindow = new google.maps.InfoWindow({});

    

    for(let index = 1; index < 5; index++) {

        const marker = new google.maps.Marker({

            map: this.map,

            position: this.center

        });

    

        marker.addListener("click", (event) => {

            infowindow.setContent("Marker " + index);

    

            infowindow.open({

                map: this.map,

                anchor: bundle.marker

            });

        });

    

        bundle.addMarker(marker);

    }

});

```