Coordinate Conversion

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

A collection of conversions that the component is currently displaying. Each row in the component displaying a coordinate is a conversion.

Example

Conversions can be set with an array of strings where each string is a format's name.

1
coordinateConversionComponent.conversions = ["mgrs"];

Describes the location of the coordinates currently displayed by the component as a Point. Setting this property will update all conversions.

Example

Set the current location.

1
coordinateConversionComponent.currentLocation = { x: 77.0369, y: 38.9072, spatialReference: { wkid: 4326 } };

Describes whether the component is expanded or not. If true, the component is expanded and all conversions are visible.

Example

Expand the component.

1
coordinateConversionComponent.expanded = true;

Attribute

expanded

Default value

false

A collection containing every coordinate format that the component is capable of displaying.

The default formats are basemap, dd, ddm, dms, mgrs, usng, utm, and xy.

Examples

Only show the "xy" format.

1
2
3
const coordinateConversionComponent = document.getElementsByTagName("arcgis-coordinate-conversion")[0];
const toRemove = coordinateConversionComponent.formats.filter(format => format.name !== "xy");
coordinateConversionComponent.formats.removeMany(toRemove);

Show every format except "xy".

1
2
3
const coordinateConversionComponent = document.getElementsByTagName("arcgis-coordinate-conversion")[0];
const toRemove = coordinateConversionComponent.formats.filter(format => format.name === "xy");
coordinateConversionComponent.formats.removeMany(toRemove);

This function provides the ability to override either the MapView goTo() or SceneView goTo() methods.

Read more...

Indicates the heading level to use for the coordinate input and coordinate settings headings. By default, these headings are rendered as level 4 headings (e.g. <h4>Input coordinate</h4>). Depending on the coordinate conversion component's placement in your app, you may need to adjust this heading for proper semantics. This is important for meeting accessibility standards.

Attribute

heading-level

Default value

4

Determines whether the capture button will be shown in the component. If true, the capture button will be hidden.

Example

Hide the capture button.

1
2
3
<arcgis-map item-id="45b3b2fb35e94ab09381d0caa0da5946">
  <arcgis-coordinate-conversion hide-capture-button slot="bottom-left"></arcgis-coordinate-conversion>
</arcgis-map>

Attribute

hide-capture-button

Default value

false

Determines whether the expand button will be shown in the component. If true, the expand button will be hidden.

Example

Hide the expand button.

1
2
3
<arcgis-map item-id="45b3b2fb35e94ab09381d0caa0da5946">
  <arcgis-coordinate-conversion hide-expand-button slot="bottom-left"></arcgis-coordinate-conversion>
</arcgis-map>

Attribute

hide-expand-button

Default value

false

Determines whether the input coordinate button will be shown in the component. If true, the input button will be hidden.

Example

Hide the input button.

1
2
3
<arcgis-map item-id="45b3b2fb35e94ab09381d0caa0da5946">
  <arcgis-coordinate-conversion hide-input-button slot="bottom-left"></arcgis-coordinate-conversion>
</arcgis-map>

Attribute

hide-input-button

Default value

false

Determines whether the settings button will be shown in the component. If true, the settings button will be hidden.

Example

Hide the settings button.

1
2
3
<arcgis-map item-id="45b3b2fb35e94ab09381d0caa0da5946">
  <arcgis-coordinate-conversion hide-settings-button slot="bottom-left"></arcgis-coordinate-conversion>
</arcgis-map>

Attribute

hide-settings-button

Default value

false

Icon which represents the component. Typically used when the component is controlled by another component (e.g. by the Expand component). Search Calcite Icons for possible values.

Attribute

icon

Default value

"coordinate-system"

The component's default label.

Attribute

label

Default value

"Coordinate conversion"

This symbol is used to visualize the location currently described by the component when capture mode is active.

This property should be set to a point symbol, typically a Simple Marker Symbol.

Example

Set the location symbol to be an 'x'.

1
2
const coordinateConversionComponent = document.getElementsByTagName("arcgis-coordinate-conversion")[0];
coordinateConversionComponent.locationSymbol = { type: "simple-marker", style: "x" };

Describes the current mode of the component.

• While in live mode, the component will update as the cursor moves.
• While in capture mode, the component will update on mouse click and display a graphic marking the current location.

Example

Programmatically set the component to capture mode.

1
2
const coordinateConversionComponent = document.getElementsByTagName("arcgis-coordinate-conversion")[0];
coordinateConversionComponent.mode = "capture";

Attribute

mode

Default value

"live"

If this property is set to true, multiple conversions will be disabled, and only a single conversion will be displayed. Otherwise, multiple conversions will be shown.

Attribute

multiple-conversions-disabled

Default value

false

Determines whether the component should expand up or down. If set to auto, the component will be oriented based on its position in the view.

Attribute

orientation

Default value

"auto"

Attribute

position

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

The current state of the component.

Attribute

state

Default value

"disabled"

If this property is set to true, sessionStorage or localStorage (depending on storageType) will not be used to hydrate and persist the component's state.

Attribute

storage-disabled

Default value

false

This property determines whether sessionStorage or localStorage will be used to store component's state.

See also

• Window.sessionStorage
• Window.localStorage

Attribute

storage-type

Default value

"session"

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 Coordinate Conversion component will be associated with a map or scene component rather than using the view property.

Create a promise that resolves once component is fully loaded.

Example

1
2
3
4
const arcgisCoordinateConversion = document.querySelector("arcgis-coordinate-conversion");
document.body.append(arcgisCoordinateConversion);
await arcgisCoordinateConversion.componentOnReady();
console.log("arcgis-coordinate-conversion is ready to go!");

Returns

Promise<void>

Permanently destroy the component.

Returns

Promise<void>

Attempt to convert a string into a point. The format of the string must be specified. A collection of available formats can be obtained from the formats property.

Parameters

Returns

Promise<Point | null | undefined>

Emitted when a conversion is added or removed, or when the order of conversions changes.

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

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