arcgis for js 画点
时间: 2023-10-20 16:33:46 浏览: 132
ArcGIS for JS可以通过鼠标拖拽的方式绘制点。你可以使用ArcGIS API for JavaScript提供的绘图工具来实现这个功能。具体步骤如下:
1. 首先,引入ArcGIS API for JavaScript的库文件,并创建一个地图容器,用于显示地图。
2. 创建一个绘图工具对象,并指定绘制点的类型。
3. 监听鼠标点击事件,在鼠标点击时获取点击位置的坐标。
4. 在点击事件中,使用绘图工具对象的draw()方法绘制点,并将点添加到地图上。
下面是一个简单的示例代码,展示如何使用ArcGIS for JS绘制点:
```javascript
// 引入ArcGIS API for JavaScript的库文件
require([
"esri/Map",
"esri/views/MapView",
"esri/views/draw/Draw",
"esri/Graphic"
], function(Map, MapView, Draw, Graphic) {
// 创建地图对象
var map = new Map({
basemap: "topo-vector"
});
// 创建地图视图对象
var view = new MapView({
container: "viewDiv",
map: map,
center: [-118.805, 34.027],
zoom: 13
});
// 创建绘图工具对象,并指定绘制点的类型为点
var draw = new Draw({
view: view
});
var pointSymbol = {
type: "simple-marker",
color: [226, 119, 40],
outline: {
color: [255, 255, 255],
width: 1
}
};
// 监听鼠标点击事件
view.on("click", function(event) {
// 获取点击位置的坐标
var point = {
type: "point",
longitude: event.mapPoint.longitude,
latitude: event.mapPoint.latitude
};
// 创建点图形
var pointGraphic = new Graphic({
geometry: point,
symbol: pointSymbol
});
// 将点图形添加到地图上
view.graphics.add(pointGraphic);
});
});
```
这段示例代码可以在ArcGIS API for JavaScript的官方文档中找到。你可以根据需要进行修改和扩展,实现更复杂的功能。<span class="em">1</span><span class="em">2</span>
#### 引用[.reference_title]
- *1* [arcgis for javascript 3.18版本物体轨迹移动](https://download.csdn.net/download/qq_27751965/18933597)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* [17 ArcGIS API for JavaScript 4.18通过鼠标绘制点、线、面](https://blog.csdn.net/qq_35117024/article/details/111514850)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
阅读全文