Improve docs for markers

docs/src/components/marker.md

@@ -1,34 +1,49 @@
 # Marker
 
-## Install
+With a marker, you can show specific locations on the map
-
-With marker you can show specific locations on the map
 ```vue
-  <GoogleMap>
+<template>
-    <Marker
+  <GmapMap>
-        :geoCoordinates="[
+    <GmapMarker
-          {
+      :key="index"
-            lat: 51.2432981,
+      v-for="(m, index) in markers"
-            lng: 6.7950981
-          }
-      ]"
     />
-  </GoogleMap>
+  </GmapMap>
+</template>
+<script>
+export default {
+  name: 'App',
+  data() {
+    return {
+      markers: [
+        {
+          position: {
+            lat: 51.093048, lng: 6.842120
+          },
+        }
+      ]
+    }
+  },
+}
+</script>
+
 ```
 
-## Center markers automatically
+## Enable/Disable events
-To center markers so that all the markers are visible, use:
+You can enable or disable map events by passing props.
+
 ```vue
-  <GoogleMap
+<template>
-    :centerGeoCoordinates="geoCoordinates">
+  <GmapMap
-    <Marker
+    ref="myMarker"
-        :centerAutomatically="false"
+  >
-        :geoCoordinates="[
+    <GmapMarker
-          {
+      :key="index"
-            lat: 51.2432981,
+      v-for="(m, index) in markers"
-            lng: 6.7950981
+      :position="m.position"
-          }
+      :clickable="true"
-      ]"
+      :draggable="true"
     />
-  </GoogleMap>
+  </GmapMap>
+</template>
 ```

package.json

@@ -1,7 +1,7 @@
 {
   "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": [