---
title: ImageAnnotation
framework: mapkitjs
role: symbol
role_heading: Class
path: mapkitjs/imageannotation
---

# ImageAnnotation

A customized annotation with image resources that you provide.

## Declaration

```data
class ImageAnnotation extends Annotation
```

## Mentioned in

MapKit JS 6 Migrating from Version 5 to Version 6

## Overview

Overview There are times when you want to customize the look of an annotation. To do this, use an ImageAnnotation object, which lets you specify your own image resources by providing a URL to your asset (such as a PNG or JPEG image), an ImageSource like an HTMLCanvasElement or ImageBitmap, or a Promise that resolves to an ImageSource. To make your image look crisp on Retina displays, provide URLs to the Retina versions of your asset, or use an ImageDelegate to dynamically return the appropriate image. You may want to define the anchor of your asset with anchorOffset. The shape of your icon might affect the placement of the callout. You can modify the position of the callout with calloutOffset.

## Topics

### Creating an image annotation

- [new ImageAnnotation(location, options)](mapkitjs/imageannotation/imageannotationconstructor.md)
- [ImageAnnotationConstructorOptions](mapkitjs/imageannotationconstructoroptions.md)

### Setting the image

- [image](mapkitjs/imageannotation/image.md)
- [url](mapkitjs/imageannotation/url.md)

## Relationships

### Inherits From

- [Annotation](mapkitjs/annotation.md)

## See Also

### Annotations

- [Clustering annotations](mapkitjs/clustering-annotations.md)
- [Annotation](mapkitjs/annotation.md)
- [MarkerAnnotation](mapkitjs/markerannotation.md)
- [PlaceAnnotation](mapkitjs/placeannotation.md)
- [MapFeatureAnnotation](mapkitjs/mapfeatureannotation.md)
- [UserLocationAnnotation](mapkitjs/userlocationannotation.md)