====== Pick Location and other Basic Map Interactions ======

This page is about basic interactions that occur between the Viewer and the third-party map.

===== Pick location on Map =====

In some scenario's the viewer needs the third party viewer to provide a coordinate.\\ 
This is how that process works : 
  - The viewer dispatches the ''onPickPositionRequested'' signal.
  - You ask the user to provide a position in the third-party viewer.
  - You provide this position to the SDK.

This happens for example when the "Move" action is triggered for a specific viewer.

Note that when providing a coordinate to the SDK, it must be provided with an [[about_crs|EPSG crs code]].

<code javascript>
handlePickPositionRequested() {
  // Set a flag
  waitingForPickPosition = true;
  // Request the click from the user...  
}
handleUserPickedPosition(x,y,crs) {
  // Pass position to the viewer
  let coordinate = Coordinate.fromXY(crs,x,y);
  viewer.setPickPosition(coordinate);
}
viewer.onPickPositionRequested.add(handlePickPositionRequested);
</code>

===== Focus Viewer to a Position =====

One simple function exists to focus the viewer on a coordinate.  When called, the viewer will ask all views to focus on the given coordinate : 
  * 3D Views will pan, to bring the position into focus.
  * Photo Views will 
    * 1) open the best photo for the given coordinate and 
    * 2) bring the position into focus on the photo.

<code javascript>
var coordinate = Coordinate.fromXY("4326",longitude,latitude);
viewer.setFocusPosition(coordinate);
</code>

===== Zoom to Extent =====

Zooming to a specific extent is something the user can request from inside the Viewer.  One example is zooming to a resource extent.  It is up to you as an SDK developer to implement this action.

The provided extent will always be expressed in the [[about_crs|default crs]].

<code javascript>
function handleZoomToExtent(extent) {
  // Zoom third-party viewer to the given extent.
  // ...
}
// Listen to event.
viewer.onZoomToExtent.add(handleZoomToExtent);
</code>