Introduction to utility networks

With the ArcGIS Maps SDK for JavaScript, you can display a utility network, view associations, and configure traces in your applications.

The UtilityNetwork contains metadata such as domain network names and shared named trace configurations, along with methods to obtain tier names and terminal configurations. See What is a utility network? for more information on utility networks.

view-utility-network

Load the WebMap

A UtilityNetwork can be obtained from a WebMap containing a utility network layer. See Publish a utility network layer to for more information on configuring and publishing a utility network layer. The first step is to load the webmap. The following code snippet demonstrates how to load a webmap hosted on ArcGIS Enterprise.

Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
require([
  "esri/WebMap",
  "esri/views/MapView",
  "esri/config"
], (WebMap, MapView, esriConfig) => {
  // set the hostname to the portal instance
  esriConfig.portalUrl = "https://myHostName.domain.com/arcgis";

  // initialize the WebMap with the webmap id
  const webMap = new WebMap({
    portalItem: {
      id: "MyWebmapId"
    }
  });

  const view = new MapView({
    map: webMap
  });
});

Load the utility network

The webmap must finish loading before accessing the utility network from the WebMap.utilityNetworks property. Use the load() method to access the UtilityNetwork and its properties. The following document may help as it provides detailed Object Model Diagrams (OMDs) of the Utility Network classes, interfaces and enumerations exposed in the ArcGIS Maps SDK for JavaScript: Utility Network OMD

Expand
Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
        webMap.when(async () => {
          // check if webMap contains utility networks
          if (webMap.utilityNetworks.length > 0) {
            // assign the utility network at index 0
            utilityNetwork = webMap.utilityNetworks.getItemAt(0);

            // trigger the loading of the UtilityNetwork instance
            await utilityNetwork.load();
          }
        });
Expand

Additional topics

View associations

Learn how to obtain and visualize associations.

Trace a utility network

Learn how to configure trace configurations and run shared named trace configurations programmatically or with a widget.

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.