ImageryLayer - 影像坐标系

1
2
3
4
5
6
7
8
9
10
11
12
13
// imageId will be used to set the mosaic rule on the layer
// Initial value to be set when the app loads.
const imageId = 1599;

// new imagery layer
layer = new ImageryLayer({
  url: url,
  mosaicRule: {
    method: "lock-raster",
    operation: "first",
    lockRasterIds: [imageId]
  }
});

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
// This function is called when the app loads and
// when users makes a new selection for raster ids from
// the itemIds dropdown. It will recreate MapView using
// ics info returned for the specified raster
function setViewIcsInfo(imageId){
  // get the image coordinate system of the item in an image service.
  layer.getCatalogItemICSInfo(imageId).then((info) => {
    const icsInfo = document.getElementById("icsInfo");
    icsInfo.innerHTML = "Image id: <b>" + imageId
  + "</b><br/> North direction: <b>"
  + Math.round(info.northDirection) + "</b>";
    // use the short-handed ics representation
    // the server will lookup the spatialReference for the raster
    const spatialRef = {
      imageCoordinateSystem: { id: imageId }
    };

    // create an extent for the map view using extent info
    // returned in ics info
    const viewRect =  document.getElementById("viewDiv");
    const width = viewRect.getBoundingClientRect().width;
    const height = viewRect.getBoundingClientRect().height;

    const newExtent = info.icsExtent.clone();
    const scaleFactor = 8;
    newExtent.xmin = (newExtent.xmin + newExtent.xmax - width * scaleFactor) / 2;
    newExtent.xmax = newExtent.xmin + width * scaleFactor;
    newExtent.ymin = (newExtent.ymin + newExtent.ymax - height * scaleFactor) / 2;
    newExtent.ymax = newExtent.ymin + height * scaleFactor;
    newExtent.spatialReference = spatialRef;

    // set the view container to null so that we can display the selected raster
    if (view){
      view.container = null;
    }
    // set the view spatialReference and extent
    view = new MapView({
      container: "viewDiv",
      map: map,
      spatialReference: spatialRef,
      extent: newExtent
    });

    view.ui.add(selectDiv, "top-right");
  });
}