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 示例，以可视化与视图交互时触发的不同事件。