Commit c4b05d25 authored by Fawad Mirzad's avatar Fawad Mirzad
Browse files

Improve docs for markers

parent bf970999

docs/src/components/marker.md

+41 −26
Original line number Diff line number Diff line 
# Marker



## Install



With marker you can show specific locations on the map

With a marker, you can show specific locations on the map

```vue

  <GoogleMap>

    <Marker

        :geoCoordinates="[

<template>

  <GmapMap>

    <GmapMarker

      :key="index"

      v-for="(m, index) in markers"

    />

  </GmapMap>

</template>

<script>

export default {

  name: 'App',

  data() {

    return {

      markers: [

        {

            lat: 51.2432981,

            lng: 6.7950981

          position: {

            lat: 51.093048, lng: 6.842120

          },

        }

      ]"

    />

  </GoogleMap>

      ]

    }

  },

}

</script>



```



## Center markers automatically

To center markers so that all the markers are visible, use:

## Enable/Disable events

You can enable or disable map events by passing props.



```vue

  <GoogleMap

    :centerGeoCoordinates="geoCoordinates">

    <Marker

        :centerAutomatically="false"

        :geoCoordinates="[

          {

            lat: 51.2432981,

            lng: 6.7950981

          }

      ]"

<template>

  <GmapMap

    ref="myMarker"

  >

    <GmapMarker

      :key="index"

      v-for="(m, index) in markers"

      :position="m.position"

      :clickable="true"

      :draggable="true"

    />

  </GoogleMap>

  </GmapMap>

</template>

```

package.json

+1 −1
Original line number Diff line number Diff line 
{

  "name": "@fawmi/vue-google-maps",

  "description": "Google Map components for Vue.js 3",

  "version": "0.7.0",

  "version": "0.7.1",

  "private": false,

  "main": "src/main.js",

  "keywords": [

docs/src/components/map.md

+4 −4

File changed.

Contains only whitespace changes.