CoordinateConversion widget - Custom Formats

Explore in the sandboxView live

This sample demonstrates how to add a custom format to the Coordinate Conversion widget. In the sample, two custom formats are added:

  1. A format representing a WGS84 point, with the addition of a z-value in meters.
  2. A format representing a NAD 1983 HARN StatePlane California I point, described by wkid 102241.

The Scene View in this sample is clipped to an extent where the StatePlane California I spatial reference is useful.

User defined custom formats need to define a convert function and a reverse convert function or a Spatial Reference and a reverse convert function. If a SpatialReference is provided, a convert function is not required; the Geometry Service will be used to project as needed.

// Regular expression to find a number
var numberSearchPattern = /-?\d+[\.]?\d*/;

var newFormat = new Format({
  // The format's name should be unique with respect to other formats used by the widget
  name: "XYZ",
  conversionInfo: {
    // Define a convert function
    // Point -> Position
    convert: function(point) {
      var returnPoint = point.spatialReference.isWGS84
        ? point
        : webMercatorUtils.webMercatorToGeographic(point);
      var x = returnPoint.x.toFixed(4);
      var y = returnPoint.y.toFixed(4);
      var z = returnPoint.z.toFixed(4);
      return {
        location: returnPoint,
        coordinate: `${x}, ${y}, ${z}`
    // Define a reverse convert function
    // String -> Point
    reverseConvert: function(string) {
      var parts = string.split(",");
      return new Point({
        x: parseFloat(parts[0]),
        y: parseFloat(parts[1]),
        z: parseFloat(parts[2]),
        spatialReference: { wkid: 4326 }
  // Define each segment of the coordinate
  coordinateSegments: [
      alias: "X",
      description: "Longitude",
      searchPattern: numberSearchPattern
      alias: "Y",
      description: "Latitude",
      searchPattern: numberSearchPattern
      alias: "Z",
      description: "Elevation",
      searchPattern: numberSearchPattern
  defaultPattern: "X°, Y°, Z"

Additional resources