Map Types

MapKit ships four base styles. Set map.mapType on the live instance to switch between Standard, Muted, Hybrid, and Satellite. The map instance is exposed through a template ref.

MapTypes.vue

<script setup lang="ts">
  import { ref } from 'vue';
  import { VMap } from '@geoql/v-mapkit';

  const mapRef = ref();
  const active = ref('satellite');

  watch(active, () => {
    if (mapRef.value?.map) mapRef.value.map.mapType = active.value;
  });
</script>

<template>
  <VMap ref="mapRef" :access-token="token" />
  <!-- mapType: 'standard' | 'mutedStandard' | 'hybrid' | 'satellite' -->
</template>