<!--
{
  "availability" : [
    "MapKit JS: 5.0.0 -"
  ],
  "documentType" : "symbol",
  "framework" : "MapKitJS",
  "identifier" : "/documentation/MapKitJS/MarkerAnnotation/selectedGlyphImage",
  "metadataVersion" : "0.1.0",
  "role" : "Instance Property",
  "symbol" : {
    "kind" : "Instance Property",
    "modules" : [
      "MapKit JS"
    ],
    "preciseIdentifier" : "instp/mapkit.MarkerAnnotation/selectedGlyphImage"
  },
  "title" : "selectedGlyphImage"
}
-->

# selectedGlyphImage

The image to display in the marker balloon when the user selects the marker.

```
get selectedGlyphImage():
    | ImageSource
    | ImageHashObject
    | ImageDelegate
    | Promise<ImageSource>
    | null;
set selectedGlyphImage(
    value:
        | ImageSource
        | ImageHashObject
        | ImageDelegate
        | Promise<ImageSource>
        | null,
);
```

## Discussion

Glyph image values can be object literals that contain absolute or relative URLs to standard, `@2x`, and `@3x` assets, an [`ImageDelegate`](/documentation/MapKitJS/ImageDelegate), an [`ImageSource`](/documentation/MapKitJS/ImageSource) such as an `HTMLCanvasElement` or `ImageBitmap`, or a `Promise` that resolves to an [`ImageSource`](/documentation/MapKitJS/ImageSource). See [`ImageSource`](/documentation/MapKitJS/ImageSource) for cross-origin requirements.

The framework requires at least one image and displays the selected glyph image in the balloon when the marker is in the selected state. If you specify an image for this property, also specify an image in the [`glyphImage`](/documentation/MapKitJS/MarkerAnnotation/glyphImage) property.

Set the size of the selected glyph image to 40 x 40 pixels. Create glyph images as template images — a monochrome image with opacity, if needed — so that MapKit JS can apply the [`glyphColor`](/documentation/MapKitJS/MarkerAnnotation/glyphColor) to tint the image. MapKit JS scales glyph images to fit in the balloon. If you don’t set [`selectedGlyphImage`](/documentation/MapKitJS/MarkerAnnotation/selectedGlyphImage), the framework uses [`glyphImage`](/documentation/MapKitJS/MarkerAnnotation/glyphImage) when the user selects the marker. The default image is a pin.

---

Copyright &copy; 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)