https://github.com/onekiloparsec/vue-apple-maps

A modern Vue.js component for (Apple) MapKit JS
https://github.com/onekiloparsec/vue-apple-maps

apple map maps vite vitejs vue vuejs

Last synced: 1 day ago
JSON representation

A modern Vue.js component for (Apple) MapKit JS

• Host: GitHub
• URL: https://github.com/onekiloparsec/vue-apple-maps
• Owner: onekiloparsec
• License: mit
• Created: 2022-02-12T10:49:39.000Z (almost 3 years ago)
• Default Branch: master
• Last Pushed: 2022-02-12T16:01:21.000Z (almost 3 years ago)
• Last Synced: 2024-12-18T01:44:21.734Z (about 2 months ago)
• Topics: apple, map, maps, vite, vitejs, vue, vuejs
• Language: Vue
• Homepage:
• Size: 27.3 KB
• Stars: 1
• Watchers: 4
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# vue-apple-maps

A modern [Vue](https://vuejs.org) component for Apple (MapKit JS) built with

[Vite](https://vitejs.dev).

Initially inspired by [MapkitVue](https://github.com/thomas-alrek/MapkitVue)

# Installation

```bash

npm install --save vue-apple-maps

```

## Usage

Please follow the official [MapkitJS documentation](https://developer.apple.com/maps/mapkitjs/) 

to setup your API credentials.

Once you have a token, place it inside a file `.env`:

```.env(.development|.prod)

VITE_APP_APPLEMAPS_TOKEN=

```

Then, in your Vue3 app, install the plugin (not the plural, the plugin

being named like the lib):

``` js

import { createApp } from 'vue'

import App from './App.vue'

// import VueAppleMaps plugin

import VueAppleMaps from 'vue-apple-maps'

createApp(App)

  .use(VueAppleMaps, {

    authorizationCallback (done) {

      done(import.meta.env.VITE_APP_APPLEMAPS_TOKEN)

    }

  })

  .mount('#app')

```

Finally, in one of your components (note the singular to indicate the 

Map component):

```vue

  

  import { VueAppleMap } from 'VueAppleMaps'

  export default {

    components: { VueAppleMap }

  }

```