arcgis-oriented-imagery-viewer | References | ArcGIS Maps SDK for JavaScript

ESM

import "@arcgis/map-components/components/arcgis-oriented-imagery-viewer";

Inheritance:: ArcgisOrientedImageryViewer→PublicLitElement

Since: ArcGIS Maps SDK for JavaScript 4.31

The Oriented Imagery Viewer component allows the user to explore and use their oriented images.

Demo

Properties

Property	Attribute	Type
`autoDestroyDisabled`	`auto-destroy-disabled`	`boolean`
`currentCoverageVisible`	`current-coverage-visible`	`boolean`
`dataCaptureEnabled`	`data-capture-enabled`	`boolean`
`disabled`	`disabled`	`boolean`
`galleryOpened`	`gallery-opened`	`boolean`
`icon`	`icon`	`Icon["icon"]`
`imageEnhancementToolActive`	`image-enhancement-tool-active`	`boolean`
`imageGalleryEnabled` readonly		`boolean`
`imageOverlaysOpened`	`image-overlays-opened`	`boolean`
`isAdditionalCoverageVisible`	`is-additional-coverage-visible`	`boolean`
`isAdditionalPointSourcesVisible`	`is-additional-point-sources-visible`	`boolean`
`label`	`label`	`string \| null \| undefined`
`layer`		`OrientedImageryLayer \| null \| undefined`
`mapImageConversionToolState`	`map-image-conversion-tool-state`	`boolean`
`navigationToolActive`	`navigation-tool-active`	`boolean`
`orientedImageryLayerItemId`	`oriented-imagery-layer-item-id`	`string \| undefined`
`preloadMedia`	`preload-media`	`boolean`
`referenceElement`	`reference-element`	`ArcgisReferenceElement \| string \| undefined`
`referencePoint` readonly		`Point \| null`
`view`		`MapViewOrSceneView \| null \| undefined`

autoDestroyDisabled

Property

Type: boolean

If true, the component will not be destroyed automatically when it is disconnected from the document. This is useful when you want to move the component to a different place on the page, or temporarily hide it. If this is set, make sure to call the destroy() method when you are done to prevent memory leaks.

Attribute: auto-destroy-disabled
Default value: false

currentCoverageVisible

Property

Type: boolean

Toggles the visibility of the current footprint polygon associated with the selected image loaded in the viewer. Current footprint coverage allows you to better understand how the images in the oriented imagery layer relate to the map. The footprint of the image is symbolized with red fill on the map. If you zoom or pan in the oriented imagery viewer, the footprint coverage graphic will update on the map to highlight the area on the map that is visible in the image.

Attribute: current-coverage-visible
Default value: false

dataCaptureEnabled

Property

Type: boolean

Since: ArcGIS Maps SDK for JavaScript 4.32

Indicates whether the data capture tools are enabled in the oriented imagery viewer for digitization. When set to true , the data capture (edit) option will be visible on the digitizable overlayed feature layers available in the image overlays tab. On clicking the data capture option, the digitization tools will appear at the bottom of the viewer once the overlay tab is closed.

Attribute: data-capture-enabled
Default value: false

disabled

Property

Type: boolean

When false, the view click interaction is enabled for the oriented imagery viewer component. This allows users to pick a location on the map and display the best image to the viewer. When true the view click interaction will be defaulted to map navigation.

Attribute: disabled
Default value: false

galleryOpened

Property

Type: boolean

Indicates if the image gallery functionality is available in the component. To visualize additional images of the same location, select the image gallery from the oriented imagery viewer. The galley is a carousel of low-resolution thumbnails of all images that depict the selected map location. Click a thumbnail to view the full-resolution image in the oriented imagery viewer.

Attribute: gallery-opened
Default value: false

icon

autocast Property

Type: Icon["icon"]

Icon which represents the component. Typically used when the component is controlled by another component (e.g. by the Expand component).

See also

Calcite Icons

Attribute: icon
Default value: "oriented-imagery-widget"

imageEnhancementToolActive

Property

Type: boolean

Indicates if the image enhancement tool is active. When true the component displays the functionalities to adjust the brightness, contrast, and sharpness of the image in the oriented imagery viewer using interactive sliders. Settings will be preserved for subsequent images loaded in the oriented imagery viewer.

Attribute: image-enhancement-tool-active
Default value: false

imageGalleryEnabled

readonly Property

Type: boolean

When true, the image gallery functionality is available in the component. Image gallery currently only supports MRF and Tif image formats.

Default value: false

imageOverlaysOpened

Property

Type: boolean

Since: ArcGIS Maps SDK for JavaScript 4.32

Indicates whether the image overlays tab in the oriented imagery viewer is open. When set to true , the overlays tab appears at the bottom of the viewer. It includes two toggle options: overlay camera locations and overlay map features. These options enable users to visualize and overlay map features that intersect with the image’s footprint within the viewer.

Attribute: image-overlays-opened
Default value: false

isAdditionalCoverageVisible

Property

Type: boolean

Indicates if the additional footprint polygons are visible for the selected image loaded in the viewer. The footprint graphics (appearing in blue) show the coverage footprints of all the additional images in the layer that depict the location selected by the user.

Attribute: is-additional-coverage-visible
Default value: false

isAdditionalPointSourcesVisible

Property

Type: boolean

Indicates if the additional camera locations are visible for the selected image loaded in the viewer. The point location graphics (appearing in blue) show the camera locations for additional images that depict the location the user selects.

Attribute: is-additional-point-sources-visible
Default value: false

label

Property

Type: string | null | undefined

The component's default label.

Attribute: label

layer

Property

Type: OrientedImageryLayer | null | undefined

Specifies the current OrientedImageryLayer to use. The layer is one the component connects to and utilizes to populate the image. The layer contains the feature data and oriented imagery properties required by the viewer to load the image and generate the associated graphics.

mapImageConversionToolState

Property

Type: boolean

Indicates if the map-image location tool is available in the component. When true, the user can select a point on the map and the corresponding location in pixel space will be displayed in the image, and vice versa.

Attribute: map-image-conversion-tool-state
Default value: false

navigationToolActive

Property

Type: boolean

When true, the navigation tool is available in the component. The navigation tool can be used to explore the images that contain the selected location on the map using a compass. To view a different image of the selected map location, click the camera locations (blue dots), or click a segment to view the best image from that segment (segments with images are shown in white; segments without images are gray).

Attribute: navigation-tool-active
Default value: false

orientedImageryLayerItemId

Property

Type: string | undefined

Attribute: oriented-imagery-layer-item-id

preloadMedia

Property

Type: boolean

Since: ArcGIS Maps SDK for JavaScript 5.0

When true, loading an image via directional or sequential navigation caches all neighboring images associated with that image. Navigating to adjacent images then uses the cached assets, reducing load times and improving viewer performance.

Attribute: preload-media
Default value: false

referenceElement

Property

Type: ArcgisReferenceElement | string | undefined

By assigning the id attribute of the Map or Scene component to this property, you can position a child component anywhere in the DOM while still maintaining a connection to the Map or Scene.

See also

Associate components with a Map or Scene component

Attribute: reference-element

referencePoint

readonly Property

Type: Point | null

This property provides the location of an image pixel in Map coordinates when using map-image conversion tool.

view

Property

Type: MapViewOrSceneView | null | undefined

The view associated with the component.

Note: The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this view property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-oriented-imagery-viewer component will be associated with a map or scene component rather than using the view property.

Methods

Method	Signature
`componentOnReady` inherited	`componentOnReady(): Promise<this>`
`destroy`	`destroy(): Promise<void>`

componentOnReady

inherited Method

Signature: componentOnReady (): Promise<this>

Inherited from: PublicLitElement

Creates a promise that resolves once the component is fully loaded.

Returns: Promise<this>

Example

const arcgisOrientedImageryViewer = document.querySelector("arcgis-oriented-imagery-viewer");
document.body.append(arcgisOrientedImageryViewer);
await arcgisOrientedImageryViewer.componentOnReady();
console.log("arcgis-oriented-imagery-viewer is ready to go!");

destroy

Method

Signature: destroy (): Promise<void>

Permanently destroy the component.

Returns: Promise<void>

Events

Name	Type
`arcgisPropertyChange`	CustomEvent<{ name: "imageGalleryEnabled" \| "layer"; }>
`arcgisReady`	CustomEvent<void>

arcgisPropertyChange

Event

arcgisPropertyChange: CustomEvent<{ name: "imageGalleryEnabled" | "layer"; }>

Emitted when the value of a property is changed. Use this to listen to changes to properties.

arcgisReady

Event

arcgisReady: CustomEvent<void>

Emitted when the component associated with a map or scene view is ready to be interacted with.