arcgis for js 4.X 添加底图、图层标注、工具(点，面，线等)

最新推荐文章于 2024-04-22 14:56:12 发布

呼噜噜坤ñ

最新推荐文章于 2024-04-22 14:56:12 发布

阅读量4.9k

点赞数 1

分类专栏：地图

本文链接：https://blog.csdn.net/weixin_44629250/article/details/87892015

版权

这是一个使用ArcGIS for JavaScript API 4.8实现的地图应用示例，展示了如何添加OpenStreetMap底图，并添加图层标注。用户可以进行点、线、面、圆和矩形的绘制操作。示例中，通过监听鼠标事件，动态创建和更新图形，同时提供了图形的高亮和缓冲区分析功能。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>缓冲区分析划线画图。。。</title>
<link type="text/css" rel="stylesheet" href="http://localhost:65022/arcgis_js_api/library/4.8/4.8/esri/css/main.css" />
<script src="http://localhost:65022/arcgis_js_api/library/4.8/4.8/init.js"></script>

<body>
<div id="viewDiv">
<div id="line-button" class="esri-widget esri-widget--button esri-interactive" title="画线">
<span class="esri-icon-polyline"></span>
</div>
<div id="area-button" class="esri-widget esri-widget--button esri-interactive" title="画面">
<span class="esri-icon-polygon"></span>
</div>
<div id="point-button" class="esri-widget esri-widget--button esri-interactive" title="画点">
<span class="esri-icon-radio-checked"></span>
</div>
<div id="circle-button" class="esri-widget esri-widget--button esri-interactive" title="画圆">
<span class="esri-icon-radio-unchecked"></span>
</div>
<div id="rectangle-button" class="esri-widget esri-widget--button esri-interactive" title="画矩形">
<span class="esri-icon-checkbox-unchecked"></span>
</div>
</div>
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/views/2d/draw/Draw",
"esri/Graphic",
"esri/geometry/Polyline",
"esri/geometry/Polygon",
"esri/geometry/Point",
"esri/geometry/Circle",
"esri/geometry/geometryEngine",
"dojo/domReady!"
], function (
Map, MapView,
Draw, Graphic,
Polyline, Polygon, Point, Circle, geometryEngine
) {
var map = new Map({
basemap: "osm"
});

//二维视图
var view = new MapView({
map: map,
container: "viewDiv",
logo: false,
center: [98.01, 33.80],
zoom: 4,

});

//添加图层标注
let image = {
type: 'picture-marker',
url: 'http://localhost:65022/images/电子地图图标/炼化（故障）.png',
width: '32px',
height: '32px',
};
//设置点的位置
let position = {
type: 'point',
longitude: 98.01,
latitude: 33.80,
};
//将点的样式和位置放在Graphic里面
let Graphic1 = new Graphic({
geometry: position,
symbol: image,
});
//显示图标
view.graphics.add(Graphic1);

//添加工具(点面线等)
var highlight;<

最低0.47元/天解锁文章

呼噜噜坤ñ

关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
1
评论
arcgis for js 4.X 添加底图、图层标注、工具(点，面，线等)

&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;缓冲区分析划线画图。。。&lt;/title&gt; &lt;link type="text/css" rel="stylesheet"
复制链接

扫一扫