<ScriptGoogleMapsPinElement>

Customizable pin marker. Place as a child of <ScriptGoogleMapsAdvancedMarkerElement>.

optionsOmit<google.maps.marker.PinElementOptions, 'map'>

Usage

<template>
  <ScriptGoogleMaps api-key="your-api-key">
    <ScriptGoogleMapsAdvancedMarkerElement
      :position="{ lat: -34.407, lng: 150.654 }"
    >
      <ScriptGoogleMapsPinElement
        :options="{
          scale: 1.5,
          background: '#FF0000',
          borderColor: '#CC0000',
          glyphColor: '#FFFFFF',
        }"
      />
    </ScriptGoogleMapsAdvancedMarkerElement>
  </ScriptGoogleMaps>
</template>

Edit this page

Markdown For LLMs

Modern advanced marker with HTML content support. This is the recommended marker type. Place inside a <ScriptGoogleMaps> component.

Information window that automatically opens on parent marker click. Place as a child of <ScriptGoogleMapsMarker> or <ScriptGoogleMapsAdvancedMarkerElement>.