LineOfSightViewModel

Provides the logic for the LineOfSight widget. Use it to create your own widget or to get access to the observer, targets and intersections.

Using the LineOfSightViewModel you can programmatically set the observer and targets for a line of sight analysis.

// instantiate a new view model
const losViewModel = new LineOfSightViewModel({
 view: view
});

// set an observer
losViewModel.observer = new Point({
  latitude: 42.3521,
  longitude: -71.0559,
  z: 147.139
});

// set a target by passing in a LineOfSightTarget to the targets collection
losViewModel.targets = [new LineOfSightTarget({
   location: new Point({
     latitude: 42.352,
     longitude: -71.051,
     z: 0
   })
})];

// when using JavaScript LineOfSightTarget can be autocast
losViewModel.targets = [{
   location: {
     latitude: 42.352,
     longitude: -71.051,
     z: 0
   }
}];

The view model can also be used to control the different states of the analysis: start() enters the creation state where the user can add the observer and targets. stop() enters the created state where the user can't add new targets but they can still move the observer and existing target.

viewModel.start();

The LineOfSightViewModel also allows you to watch for changes (for example when the user moves the observer or the targets) and gives you access to the intersected graphic and the location where the intersection occurred. The observer is just a Point, so you can simply watch the observer property on the view model to know when an observer gets added or moved.

reactiveUtils.watch(
  () => losViewModel.observer,
  (value) => {
    // do something with the value
  }
);

const highlightHandles = [];

reactiveUtils.watch(
  () => {
    // Watch the whole expression. The callback will be called if any target is added or removed
    // and also if any of the target's `intersectedGraphic` property changes.
    viewModel.targets
      .map((target) => target.intersectedGraphic)
      .map((graphic) => !!graphic)
      .toArray()
  },
  (intersectedGraphics) => {
    // Remove the previous highlights
    highlightHandles.forEach((handle) => handle.remove());

    // Highlight all the intersected graphics
    highlightHandles = intersectedGraphics.map((graphic) => {
      return layerView.highlight(graphic);
    });
  }
);

A target contains information about the location of the target, whether it's visible or not, which graphic it intersects and the location where it intersects that graphic, an integrated mesh or the ground. The LineOfSightTarget class is used to represent a target.