/x5-gmaps

A lightweight Google Maps plugin for Vue

Primary LanguageTypeScriptMIT LicenseMIT

x5-gmaps (Docs)

---------------------------------------------------------------------------------------------------------------


WARNING: No longer maintained

As Vue 2 has reached end of life, and some of the Google Maps components that this uses are now depreciated, this will no longer be maintained.

Thank you for your support and using my thing 💖



---------------------------------------------------------------------------------------------------------------



This is a lightweight library to simplify the use of Google Maps in Vue 2 🤏🗺️🧩

For Vue 3 check out v3-gmaps 💪

Bundle size NPM downloads License


Guide / Demo / Tutorials


Installation

# npm
npm install x5-gmaps

Deployment

This plugin can be installed like any Vue plugin:

import x5GMaps from 'x5-gmaps';
// Option 1: Just your key
Vue.use(x5GMaps, 'YOUR_GOOGLE_KEY');
// Option 2: With libraries
Vue.use(x5GMaps, { key: 'YOUR_GOOGLE_KEY', libraries: ['places'] });

new Vue({
  el: '#app',
  render: h => h(App)
});

Usage

<template>
  <gmaps-map>
    <gmaps-marker :position="{ lat: -27, lng: 153 }" />
  </gmaps-map>
</template>
import { gmapsMap, gmapsMarker } from 'x5-gmaps';

export default {
  components: { gmapsMap, gmapsMarker }
};

Provided components


License

This project is licensed under the MIT License - see the LICENSE file for details

Authors

Support

Buy Me A Coffee

Star History

Star History Chart