企业🤖AI智能体构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
## 一、增加 基于Graphic模块实现的点、线、面绘制 官方示例:https://developers.arcgis.com/javascript/latest/sample-code/sandbox/index.html?sample=intro-graphics ![](https://box.kancloud.cn/db092c51e36de41e4061d0d2acb4c59f_373x445.jpg) ~~~ require([ 'esri/Map', 'esri/views/MapView', 'esri/Graphic', 'dojo/domReady!' ], function(Map, MapView, Graphic) { var map = new Map({ basemap: 'streets' }); var mapView = new MapView({ map: map, container: 'js_map', center: [102.9331224074, 25.1049040686], zoom: 14, rotation: -127.7 }); // 点 var pointGraphic = new Graphic({ geometry: { type: "point", longitude: 102.91835013921454, latitude: 25.07329419928656 }, symbol: { type: "simple-marker", color: [226, 119, 40], outline: { color: [255, 255, 255], width: 2 } } }); // 线段 var polylineGraphic = new Graphic({ geometry: { type: "polyline", paths: [ [102.910162764106, 25.07018272862779], [102.8930867806804, 25.059832030816985] ] }, symbol: { type: "simple-line", color: [226, 119, 40], width: 4 } }); // 区域 var polygonGraphic = new Graphic({ geometry: { type: "polygon", rings: [ [102.91178510742334, 25.084669232147803], [102.90360000141197, 25.07418752854951], [102.89444740470826, 25.080496392692318], [102.90322231110693, 25.092431310556876] ] }, symbol: { type: "simple-fill", color: [227, 139, 79, 0.8], outline: { color: [255, 255, 255], width: 1 } }, attributes: { Name: "Keystone Pipeline", Owner: "TransCanada", Length: "3,456 km" }, popupTemplate: { // 点击区域的弹出层模板 title: "{Name}", content: [ { type: "fields", fieldInfos: [ {fieldName: "Name"}, {fieldName: "Owner"}, {fieldName: "Length"} ] } ] } }); mapView.graphics.addMany([pointGraphic, polylineGraphic, polygonGraphic]); // mapView.graphics.add(pointGraphic); // 单独添加 }); ~~~ ## 二、删除 ~~~ // 删除所有 mapView.graphics.removeAll(); // 删除多个 mapView.graphics.removeMany([pointGraphic, polylineGraphic]); // 删除一个 mapView.graphics.remove(pointGraphic); ~~~