Add Layer Event

The add-layer event provides a mechanism to dynamically and programmatically add layers/data to Omni.

Properties

Property	Required	Type	Summary
zoomToExtent	No	boolean	Flag that determines if the app should zoom to the extent of the data being added
replaceExisting	No	boolean	If true, it will remove any existing layer with the same ID before adding the new one. Otherwise it will add the data to the existing layer (if it already exists)
layer	Yes	LayerProperties	Any valid properties of an ArcGIS Layer (see docs)
actions	No	Action[]	A list of actions to apply to the layer

Examples

Add Feature Layer from URL

Add a Feature Layer from an ArcGIS Map Server service.

postMessage(
  {
    source: 'SAM',
    eventName: 'add-layer',
    data: {
      zoomToExtent: true,
      replaceExisting: true,
      layer: {
        id: 'crashes',
        type: 'feature',
        title: 'Crash Data',
        url: 'https://arcgis.rizing.dev/server/rest/services/ProductTest/ProdTools_TestPro_SQL/MapServer/89',
        gdbVersion: 'sde.DEFAULT'
      }
    }
  },
  '*'
);

Add simple point data

Add a layer with hard-coded point data.

postMessage(
  {
    source: 'SAM',
    eventName: 'add-layer',
    data: {
      zoomToExtent: true,
      replaceExisting: true,
      layer: {
        id: 'sample-points',
        type: 'feature',
        title: 'Sample Point Data',
        geometryType: 'point',
        objectIdField: 'id',
        fields: [
          {
            name: 'id',
            type: 'string',
            alias: 'ID',
            length: 12
          },
          {
            name: 'name',
            type: 'string',
            alias: 'Name',
            length: 40
          }
        ],
        source: [
          {
            attributes: {
              id: '1',
              name: 'Point 1'
            },
            geometry: { type: 'point', x: -72, y: 42 }
          },
          {
            attributes: {
              id: '2',
              name: 'Point 2'
            },
            geometry: { type: 'point', x: -72.001, y: 42.001 }
          },
          {
            attributes: {
              id: '3',
              name: 'Point 3'
            },
            geometry: { type: 'point', x: -72.002, y: 42.002 }
          }
        ]
      }
    }
  },
  '*'
);

Add simple line (single-part polyline) data

Add a layer with hard-coded line data.

postMessage(
  {
    source: 'SAM',
    eventName: 'add-layer',
    data: {
      zoomToExtent: true,
      replaceExisting: true,
      layer: {
        id: 'sample-line',
        type: 'feature',
        title: 'Sample Line Data',
        geometryType: 'polyline',
        objectIdField: 'id',
        fields: [
          {
            name: 'id',
            type: 'string',
            alias: 'ID',
            length: 12
          },
          {
            name: 'name',
            type: 'string',
            alias: 'Name',
            length: 40
          }
        ],
        source: [
          {
            attributes: {
              id: '1',
              name: 'Point 1'
            },
            geometry: {
              type: 'polyline',
              paths: [
                [
                  [-76.85213327407835, 40.24920973652763],
                  [-76.85161828994751, 40.249373510162606],
                  [-76.85115694999695, 40.25007773227726],
                  [-76.85018062591553, 40.25167448783553],
                  [-76.84816360473631, 40.25240325092834]
                ]
              ]
            }
          }
        ]
      }
    }
  },
  '*'
);

Add multipart line (polyline) data

Add a layer with hard-coded multi-part line data.

postMessage(
  {
    source: 'SAM',
    eventName: 'add-layer',
    data: {
      zoomToExtent: true,
      replaceExisting: true,
      layer: {
        id: 'sample-multiline',
        type: 'feature',
        title: 'Sample Multiline Data',
        geometryType: 'polyline',
        objectIdField: 'id',
        fields: [
          {
            name: 'id',
            type: 'string',
            alias: 'ID',
            length: 12
          },
          {
            name: 'name',
            type: 'string',
            alias: 'Name',
            length: 40
          }
        ],
        source: [
          {
            attributes: {
              id: '1',
              name: 'Point 1'
            },
            geometry: {
              type: 'polyline',
              paths: [
                [
                  // first path
                  [-76.85213327407835, 40.24920973652763],
                  [-76.85161828994751, 40.249373510162606],
                  [-76.85115694999695, 40.25007773227726],
                  [-76.85018062591553, 40.25167448783553],
                  [-76.84816360473631, 40.25240325092834]
                ],
                [
                  // second path
                  [-76.84758424758911, 40.25255882854964],
                  [-76.84658646583557, 40.252755347139015],
                  [-76.84616804122925, 40.25134695130512],
                  [-76.84940814971924, 40.25073281603803],
                  [-76.85025572776794, 40.24882486692554]
                ]
              ]
            }
          }
        ]
      }
    }
  },
  '*'
);

Add simple polygon data

Add a layer with hard-coded polygon data.

postMessage(
  {
    source: 'SAM',
    eventName: 'add-layer',
    data: {
      zoomToExtent: true,
      replaceExisting: true,
      layer: {
        id: 'sample-polygon',
        type: 'feature',
        title: 'Sample Polygon Data',
        geometryType: 'polygon',
        objectIdField: 'id',
        fields: [
          {
            name: 'id',
            type: 'string',
            alias: 'ID',
            length: 12
          },
          {
            name: 'name',
            type: 'string',
            alias: 'Name',
            length: 40
          }
        ],
        source: [
          {
            attributes: {
              id: '1',
              name: 'Point 1'
            },
            geometry: {
              type: 'polygon',
              rings: [
                [-76.75054863095284, 40.29437678408931],
                [-76.75125941634178, 40.294755257161874],
                [-76.75132378935814, 40.294745028187805],
                [-76.75124600529671, 40.29443406663643],
                [-76.75082623958588, 40.29414458469555],
                [-76.75054863095284, 40.29437678408931] // same as first vertex
              ]
            }
          }
        ]
      }
    }
  },
  '*'
);

Add multi-ring polygon data

Add a layer with hard-coded multi-ring polygon data (ex: a donut).

postMessage(
  {
    source: 'SAM',
    eventName: 'add-layer',
    data: {
      zoomToExtent: true,
      replaceExisting: true,
      layer: {
        id: 'sample-polygon',
        type: 'feature',
        title: 'Sample Polygon Data',
        geometryType: 'polygon',
        objectIdField: 'id',
        fields: [
          {
            name: 'id',
            type: 'string',
            alias: 'ID',
            length: 12
          },
          {
            name: 'name',
            type: 'string',
            alias: 'Name',
            length: 40
          }
        ],
        source: [
          {
            attributes: {
              id: '1',
              name: 'Point 1'
            },
            geometry: {
              type: 'polygon',
              rings: [
                // part 1
                [
                  [-76.75054863095284, 40.29437678408931],
                  [-76.75125941634178, 40.294755257161874],
                  [-76.75132378935814, 40.294745028187805],
                  [-76.75124600529671, 40.29443406663643],
                  [-76.75082623958588, 40.29414458469555],
                  [-76.75054863095284, 40.29437678408931] // same as first vertex
                ],
                // part 2
                [
                  [-76.75075516104698, 40.29436450925147],
                  [-76.75108909606934, 40.29456806669092],
                  [-76.75113067030907, 40.29456704379075],
                  [-76.7510998249054, 40.29441156278442],
                  [-76.75083428621292, 40.29427551661042],
                  [-76.75075516104698, 40.29436450925147]
                ]
              ]
            }
          }
        ]
      }
    }
  },
  '*'
);

Add layer with actions

Add a layer with actions. See more on actions here.

postMessage(
  {
    source: 'SAM',
    eventName: 'add-layer',
    data: {
      actions: [
        {
          title: 'Google Search',
          type: 'link',
          url: 'https://google.com/search?q={name}'
        },
        {
          title: 'Post Message',
          type: 'post-message',
          eventName: 'my-test-post-message'
        },
        {
          title: 'Trigger NativeScript Event',
          type: 'native-script-event',
          eventName: 'my-custom-native-script-event'
        }
      ],
      zoomToExtent: true,
      replaceExisting: true,
      layer: {
        id: 'pa-cities',
        type: 'feature',
        title: 'PA Cities',
        geometryType: 'point',
        objectIdField: 'id',
        fields: [
          {
            name: 'id',
            type: 'string',
            alias: 'ID',
            length: 12
          },
          {
            name: 'name',
            type: 'string',
            alias: 'Name',
            length: 40
          }
        ],
        source: [
          {
            attributes: {
              id: '1',
              name: 'Harrisburg, PA'
            },
            geometry: { type: 'point', x: -76.890739, y: 40.26368 }
          },
          {
            attributes: {
              id: '2',
              name: 'Lancaster, PA'
            },
            geometry: { type: 'point', x: -76.306229, y: 40.044437 }
          },
          {
            attributes: {
              id: '3',
              name: 'York, PA'
            },
            geometry: { type: 'point', x: -76.727692, y: 39.962303 }
          }
        ]
      }
    }
  },
  '*'
);