docs: listening to map events

* Mention of listening to map events

Added a small section mentioning the option to listen for map events on the GoogleMap component

* added section about listening to events

* added section about listening to events

* added event listening example to advanced usage

README.md

@@ -59,6 +59,8 @@ All the map components are available on the `Vue3GoogleMap` global variable.
 To construct a map using `vue3-google-map` you'll need to use the base `GoogleMap` component which receives your [Google Maps API key](https://developers.google.com/maps/documentation/javascript/get-api-key), styles (e.g. setting width and height), and any [MapOptions](https://developers.google.com/maps/documentation/javascript/reference/map#MapOptions) to configure your map ([see this](https://github.com/inocan-group/vue3-google-map/blob/develop/src/components/GoogleMap.vue#L36-L230) for all the supported `MapOptions`).
 Other map features can be added to your map by passing map subcomponents ([Marker](#marker), [Polyline](#polyline), [Polygon](#polygon), [Rectangle](#rectangle), [Circle](#circle), [InfoWindow](#info-window), [CustomMarker](#custom-marker), [CustomControl](#custom-control), or [MarkerCluster](#marker-cluster)) to the default slot of the `GoogleMap` component.
 
+The [the following events](https://developers.google.com/maps/documentation/javascript/reference/map#Map-Events) will be emitted by the `GoogleMap` component and can be listened to by using `@event_name`.
+
 ```vue
 <script setup>
 import { GoogleMap, Marker } from 'vue3-google-map'

docs/advanced-usage/index.md

@@ -207,6 +207,17 @@ const center = { lat: 40.689247, lng: -74.044502 };
 </template>
 ```
 
+## Events
+
+You can listen for [the following events](https://developers.google.com/maps/documentation/javascript/reference/map#Map-Events) on the `GoogleMap` component by using `@event_name`. For example if you want to call a function whenever the zoom value is changed, you can use it like this: 
+
+```vue
+<GoogleMap
+  @zoom_changed="yourFunctionName"
+/>
+```
+
+
 <style scoped>
 .map {
   position: relative;

docs/getting-started/index.md

@@ -30,7 +30,9 @@ Include the following script tag in your `index.html` (make sure to include it a
 ## Your first map
 
 To construct a map using `vue3-google-map` you'll need to use the base `GoogleMap` component which receives your [Google Maps API key](https://developers.google.com/maps/documentation/javascript/get-api-key), styles (e.g. setting width and height), and any [MapOptions](https://developers.google.com/maps/documentation/javascript/reference/map#MapOptions) to configure your map ([see this](https://github.com/inocan-group/vue3-google-map/blob/develop/src/components/GoogleMap.vue#L36-L230) for a all the supported `MapOptions`).
-Other map features can be added to your map by passing map subcomponents ([Marker](/components/marker), [Polyline](/components/polyline), [Polygon](/components/polygon), [Rectangle](/components/rectangle), [Circle](/components/circle), or [CustomControl](/components/custom-control)) to the default slot of the `GoogleMap` component.
+Other map features can be added to your map by passing map subcomponents ([Marker](/components/marker), [Polyline](/components/polyline), [Polygon](/components/polygon), [Rectangle](/components/rectangle), [Circle](/components/circle), or [CustomControl](/components/custom-control)) to the default slot of the `GoogleMap` component. 
+
+The [the following events](https://developers.google.com/maps/documentation/javascript/reference/map#Map-Events) will be emitted by the `GoogleMap` component and can be listened to by using `@event_name`.
 
 ```vue
 <script setup>
@@ -51,6 +53,9 @@ const center = { lat: 40.689247, lng: -74.044502 }
 </template>
 ```
 
+
+
+
 <ClientOnly>
   <GoogleMap
     :api-promise="apiPromise"