Skip to content
mapkit-cn
v1.0.0

Beautiful Apple
Maps for Vue.

Theme-aware MapKit JS components for Vue 3. Drop them in, style them with Tailwind, ship them with shadcn-vue.

Browse examples View on GitHub
18 components·4 composables·23 examples

18 components

Maps, annotations, overlays, controls

Apple MapKit JS

The real Apple Maps engine

Vue 3

Composition API & <script setup>

TypeScript

Fully typed props & composables

Quick start

A map in five lines.

Import the components you need and pass your MapKit token. No wrappers, no boilerplate: annotations and overlays are just child components.

Explore all 23 examples
App.vue
<script setup lang="ts">
  import { VMap, VMarkerAnnotation } from '@geoql/v-mapkit';
</script>

<template>
  <VMap :access-token="token" color-scheme="dark">
    <VMarkerAnnotation
      :coordinates="[37.3349, -122.009]"
      :annotation="{ title: 'Apple Park' }"
    />
  </VMap>
</template>