JS API模块之view
view
AMD:
require(["esri/views/View"], (View) => { /* code goes here */ });
ESM:
import View from "@arcgis/core/views/View";
视图有两种类型:MapView和SceneView。MapView以2D呈现地图及其层,SceneView以3D的方式呈现这些元素。
View是MapView和SceneView的基类,没有构造函数。要创建一个视图,你必须直接创建一个MapView或SceneView的实例。
MapView
map、extent、center、rotation、scale、zoom...
SceneView
map、center、scale、zoom、camera、viewingMode...
属性
container
:表示包含视图的DOM元素的id或节点。
map
:要在视图中显示的Map对象的实例。
spatialReference
:视图的空间参考。
center
:表示视图的中心点;当设置中心时,你可以传递一个Point实例或一个代表经度/纬度对的数字数组([-100.4593,36.9014])。
background
:MapView的背景颜色。
zoom
:表示视图中心的细节级别(LOD)。
scale
:表示视图中心的地图比例尺。
rotation
:正北相对于视图顶部的顺时针旋转度。
resolution
:表示地图单位中一个像素的大小。
orientation
:指示视图方向的方便属性。
constraints
:指定可能应用于MapView的缩放、缩放和旋转约束。
extent
:表示视图中映射的可见部分,作为区段的一个实例。
let ext = new Extent({
xmin: -13056650,
ymin: 6077558,
xmax: -13055709,
ymax: 6077938,
spatialReference: new SpatialReference({wkid:3857})
});
view.extent = ext; // Updates the view without animation
type
:视图的类型是2d(表示MapView)或3d(表示SceneView)。
ui
:显示视图中可用的默认小部件,并允许您打开和关闭它们。
size
:包含视图的宽度和高度(以像素为单位)的数组。
graphics
:允许直接添加图形到视图中的默认图形。
allLayerViews
:集合,其中包含与该视图中的基图、操作层和组层相关的所有创建的layerview的平面列表。
animation
:表示由goTo()初始化的正在进行的视图动画。
height
:从视图容器元素读取的视图高度(以像素为单位)。
width
:从视图容器元素读取的视图宽度(以像素为单位)。
方法
on()
:在实例上注册事件处理程序。
view.on("click", function(event){
// event is the event handle returned after the event fires.
console.log(event.mapPoint);
});
// Fires `pointer-move` event when user clicks on "Shift"
// key and moves the pointer on the view.
view.on('pointer-move', ["Shift"], function(event){
let point = view2d.toMap({x: event.x, y: event.y});
bufferPoint(point);
});
goTo()
:将视图设置为给定的目标。
hitTest()
:返回与指定屏幕坐标相交的图形。
toMap()
:将给定的屏幕点转换为地图点。
toScreen()
:将给定的映射点转换为屏幕点。
when()
:当类的实例创建后,可以使用When()。
whenLayerView()
:获取在视图上为给定层创建的LayerView。
takeScreenshot()
:创建当前视图的截图。
destroy()
:破坏视图和任何相关的资源,包括它的map、popup和UI元素。
emit()
:在实例上发出事件。
focus()
:在视图上设置焦点。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!