Interactive viewshed analysis

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
  // Create the viewshed shape programmatically
  const viewshed = new Viewshed({
    observer: {
      spatialReference: {
        latestWkid: 3857,
        wkid: 102100
      },
      x: -9754426,
      y: 5143111,
      z: 330
    },
    farDistance: 900, // In meters
    tilt: 80, // Tilt of 0 looks down, tilt of 90 looks parallel to the ground, tilt of 180 looks up to the sky
    heading: 60, // Counted clockwise from North
    horizontalFieldOfView: 85,
    verticalFieldOfView: 45
  });
  // Initialize viewshed analysis with the created viewshed shape and add it to the view.
  const viewshedAnalysis = new ViewshedAnalysis({
    viewsheds: [viewshed]
  });
  view.analyses.add(viewshedAnalysis);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

// Add interactivity to the custom UI component's buttons.
  const createButton = document.getElementById("createButton");
  const cancelButton = document.getElementById("cancelButton");

  // Controller which allows to cancel an ongoing viewshed creation operation.
  let abortController = null;

  createButton.addEventListener("click", () => {
    view.whenAnalysisView(viewshedAnalysis).then((viewshedAnalysisView) => {
      // Create a new abort controller for the new operation.
      abortController = new AbortController();
      // Pass the controller as an argument to the interactive creation method.
      viewshedAnalysisView.createViewsheds(abortController);
    });
  });

  cancelButton.addEventListener("click", () => {
    // Pressing the Cancel button stops the viewshed creation process.
    abortController.abort();
  });