JavaScript ArcGIS SceneView用法及代碼示例

// create a SceneView instance (for 3D viewing)
const view = new SceneView({
  map: new Map({
    basemap: "topo-vector"
  }),
  container: "viewDiv"
});

view.when(function() {
  // SceneView is now ready for display and can be used. Here we will
  // use goTo to view a particular location at a given zoom level, camera
  // heading and tilt.
  view.goTo({
    center: [-112, 38],
    zoom: 13,
    heading: 30,
    tilt: 60
  })
})
.catch(function(err) {
  // A rejected view indicates a fatal error making it unable to display,
  // this usually means that WebGL is not available, or too old.
  console.error("SceneView rejected:", err);
});

有關 view.when() 的實時示例，請參閱 2D overview map in SceneView 和 Toggle elevation layer 示例。

要禁用SceneView 導航，您必須對觸發導航的指針或手勢事件的事件對象調用stopPropagation() 方法。

有關示例，請參閱我們在 disabling view navigation 上的示例。

動作形象	SpaceMouse 動作	SceneView 行為
	推(左/右/前/後)	Pan
	拉起	Ascend
	向下推	Descend
	順時針旋轉	順時針旋轉視圖
	逆時針旋轉	逆時針旋轉視圖
	Tilt	傾斜場景

要禁用遊戲手柄導航，您可以將 view.navigation.gamepad.enabled 設置為 false 。

// Compatibility with 2D viewing properties, such as center and zoom, allows
// convenient transitioning from the familiar use of the 2D MapView to the
// use of the SceneView for 3D viewing.
let view = new SceneView({
  map: new Map({
    basemap: "satellite"
  }),

  container: "viewDiv",

  // Sets the center point of the view at a specified lon/lat
  center: [-112, 38],

  // Sets the zoom LOD to 13
  zoom: 13
});

3D 查看的本質包括傾斜視圖、z-values 和旋轉，所有這些都增加了定義視圖中可見內容的複雜性。與主要由範圍或中心和比例定義的 2D MapView 相比，SceneView 的主要視圖規範是 Camera 實例。相機由 3D position 、 heading 和 tilt 定義。有關更多詳細信息，請參閱Camera 的文檔。

由於某些視圖屬性重疊(例如中心和相機)，因此在構建視圖期間(直到視圖準備好)應用這些屬性有一個設定的優先級。下表說明了哪些屬性在視圖構造期間具有優先級(被覆蓋的屬性在構造期間不會產生任何影響)。

定義用於在特定位置查看數據的相機可能很困難。 goTo 方法提供了一種便捷的方法，可以根據您想要查看的數據(幾何圖形、圖形)以及使用標題、傾斜、縮放或縮放從任何角度設置視圖的相機。此外，默認情況下，goTo 將提供到視圖新位置的平滑過渡。

// go to a location specified in geographic coordinates,
// from a 45 degree angle.
view.goTo({
  center: [-112, 38],
  heading: 45
});

// go to view all the graphics in view.graphics, while northing the
// the camera and tilting it to 60 degrees
view.goTo({
  target: view.graphics,
  heading: 0,
  tilt: 60
});

// Set the view to show an extent at a -20 degree heading, disabling the
// animated transition
view.goTo({
  target: new Extent(694942, 5596444, 1284090, 6163926, SpatialReference.WebMercator),
  heading: -20
}, {
  animate: false
});

請務必注意，某些事件是相互依賴的，並且用戶交互的時間可能會影響觸發的事件類型。例如，單擊一次會觸發一係列事件：當用戶按下鼠標按鈕時pointer-down，當用戶釋放鼠標按鈕時pointer-up。 immediate-click 事件在 pointer-up 事件之後立即觸發。 immediate-click 應用於立即響應用戶交互。隻有在確保用戶不會再次單擊後才會觸發單擊事件(在這種情況下會觸發雙擊事件)。

如果是雙擊，則在第一次單擊後會重複相同的事件鏈。但是，如果用戶在接近的時間範圍內第二次單擊，則不再發出單擊事件，但會再次觸發 pointer-down、pointer-up 和 immediate-click 事件。在兩個 immediate-click 事件之後，雙擊事件會與 immediate-double-click 事件一起觸發。兩者之間的區別在於，immediate-double-click 無法通過在 immediate-click 事件上使用 stopPropagation 來阻止，因此可用於對 double-clicking 做出反應，而與 immediate-click 事件的使用無關。

這些事件也在內部用於導航、彈出窗口或不同的交互工具，如測量或草圖。在某些用例中，添加額外的事件偵聽器可能會幹擾默認事件偵聽器。例如，添加immediate-click 事件來打開一個彈出窗口，將幹擾同樣打開一個彈出窗口的默認 click 事件。

請參閱Event explorer 示例，以可視化與視圖交互時觸發的不同事件。