Vue-maps

Vue maps is vue component for usage simple Usage of Google Maps.

Demo

Installation

    npm install vue-maps

Import

import { GoogleMap } from 'vue-maps'

new Vue({
  components: {
    GoogleMap
  },

  data(){
      return{
        latitude: -33.950198,
        longitude: 151.259302,
        apiKey: "Google Api Key",
        locations: [
            {
                title: "Bondi Beach",
                latitude: -33.890542,
                longitude: 151.274856
            },
            {
                title: "Coogee Beach",
                latitude: -33.923036,
                longitude: 151.259052
            },
            {
                title: "Cronulla Beach",
                latitude: -34.028249,
                longitude: 151.157507
            },
            {
                title: "Manly Beach",
                latitude: -33.80010128657071,
                longitude: 151.28747820854187
            },
            {
                title: "Maroubra Beach",
                latitude: -33.950198,
                longitude: 151.259302
            }
        ]
    }
  }
})

Usage

For Google Maps Usage

   <GoogleMap
        :latitude="latitude"
        :longitude="longitude"
        :apiKey="apiKey"
        :zoom="8"
        with-marker
        :locations="locations"
      />

Available Props

| Props | Type | Description | | ----------- | ----------- |----------- | | latitude | Float/Integer | Latitude is a measurement on a globe or map of location north or south of the Equator.| | longitude | Float/Integer | Latitude is a measurement on a globe or map of location east or west of the Equator.| | zoom | Integer | The maximum zoom level found at the given LatLng. Default: 10| | apiKey | String | Generated on google developers website.| | with-marker | Boolean | Willing to show marker(s) on Google map. Default:true| | locations | Array | Latitude, Longitude and title of the address(es) you want to show on the map as marker|

Dependency

This package is dependent on Google Maps and laravel-mix