地图控件 - Widget
约 247 字小于 1 分钟
地图控件 - Widget
指南针
import Map from "@arcgis/core/Map"
import MapView from "@arcgis/core/views/MapView"
import Compass from "@arcgis/core/widgets/Compass"
const map = new Map({
basemap: 'dark-gray',
})
const mapView = new MapView({
map,
container: 'js_map',
center: [102.92934063304513, 25.102234987110343],
zoom: 3,
})
const compass = new Compass({
view: mapView,
})
mapView.ui.add(compass, {
position: "top-right"
})
打印
import print from "@arcgis/core/widgets/print"
const print = new Print({
view: mapView,
printServiceUrl:
"https://utility.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task",
})
mapView.ui.add(print, {
position: "top-right",
})
缩放
缩放是默认地图UI控件,初始化 MapView 即存在,不过也可以修改其显示位置。
mapView.ui.move('zoom', 'bottom-right')
删除控件
删除指定位置指定控件
如:删除左下脚的缩放控件
mapView.ui.move("zoom", "bottom-left")
删除指定位置所有控件
如:删除左上方所有控件
mapView.ui.empty('top-left')
移动控件
移动多个控件到指定位置
// compass 和 toggle 是实例控件,zoom是默认控件
mapView.ui.move([ compass, toggle, "zoom" ], "bottom-right")
移动指定控件到指定索引位置
// legend图例控件是实例控件
mapView.ui.move({component: legend, position: "top-right", index: 0})