这里由于需要引入文件，故无法运行，需要源码的话，直接上github
如下文件对映github上的arcgis_point.html
点击跳转github
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>ArcGIS JS加载高德地图</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.29/esri/css/esri.css" target="_blank" rel="external nofollow" >
<style>
html,body{
height: 100%;
}
#map{
height: 100%;
}
</style>
<script type="text/javascript">
/* dojoConfig 配制，如果引入外部js用于地图的话，需要packages打包引入路径，例如这里引入高德底图，就需要如下配制，
* packages:[{name:'js',location: location.pathname.replace(/\/[^/]*$/, '') + '/js'}],
* 方可reauire([ "js/gaodeLayer"],function(goadeLayer){})
* */
var dojoConfig = {
async: false, //是否异步
parseOnLoad: true,
packages: [{ //解释：require(["js/.."],function(){}) 中 js/ 即为 location的值
name: "js", //对应require引用包里的js
location: location.pathname.replace(/\/[^/]*$/, '') + '/js' //location.pathname表示当前文件位置
}]
};
// 配制参考 https://www.cnblogs.com/mytudousi/p/6166280.html
</script>
<!--<script src="https://js.arcgis.com/3.29/"></script>-->
<script type="text/javascript" src="js/init.js"></script>
<script>
//地图控件
var map;
require(["esri/map",
"esri/geometry/Extent",
"esri/geometry/Point",
"esri/SpatialReference",
"esri/dijit/Scalebar",
"js/gaodeLayer",
"esri/graphic",
"esri/layers/GraphicsLayer",
"esri/InfoTemplate",
"esri/dijit/Popup",
"dojo/domReady!"],
function (Map,Extent,Point,SpatialReference,Scalebar,gaodeLayer,Graphic,GraphicsLayer,InfoTemplate,Popup) {
//创建popup弹出层
var div = document.createElement('div');
var popup = new Popup(null, div);
var startExtent = new Extent(112.445306, 35.485907, 112.445376, 35.485997,new SpatialReference({ wkid:4326 }) );
map = new Map("map", {
// extent:startExtent,
basemap: "streets",
center: [116.397428, 39.90923],
zoom: 10,
logo :false, //logo
infoWindow: popup, //弹窗
slider : true //缩小按钮
});
// var baselayer = new gaodeLayer();//默认加载矢量 new gaodeLayer({layertype:"road"});也可以
// var baselayer = new gaodeLayer({layertype: "st"});//加载卫星图
//加载高德图层
var baselayer = new gaodeLayer({layertype: "road"});//加载标注图
map.addLayer(baselayer);//添加高德地图图层到map上
//初始化比例尺
var scalebar = new Scalebar({
map: map,
attachTo: "bottom-left",
scalebarUnit: "dual",
});
//显示比例尺
scalebar.show();
//车辆图层
var pointlayer = new GraphicsLayer();
map.addLayer(pointlayer,1);
//标注车辆位置
var lnglats = [
{
oldPosition:[116.397428, 39.90923],
position:[116.368904, 39.943423],
info:'沪H159327',
angle:30,
id:1,
},
{
oldPosition:[116.302122, 39.921176],
position:[116.382122, 39.921176],
info:'京J02364',
angle:35,
id:2
}
];
map.on("load", function() {
for(var i=0;i<lnglats.length;i++){
let x = lnglats[i].oldPosition[0],
y = lnglats[i].oldPosition[1],
desc = lnglats[i].info;
//加载车辆图标
ShowLocation(x,y,desc);
}
});
//点击车辆图层，弹出框信息
var popup_point = {x:0,y:0};
pointlayer.on("click", function(e) {
var dom = "<table>"+
"<tr><td>车牌</td><td>123</td></tr>"+
"<tr><td>经纬度</td><td>116 39</td></tr>"+
"</table>";
popup.setTitle('图形信息');
popup.setContent(dom);
popup.show(e.mapPoint);
//保存当前弹窗坐标，用以区别是哪个弹窗
let geometry = e.graphic.geometry;
popup_point.x = geometry.x;
popup_point.y = geometry.y;
});
var all_points = [];
//添加车辆图标到地图
function ShowLocation(x, y ,desc) {
//点坐标
var point = new Point(x, y, new SpatialReference({
wkid: 4326
}));
//标记图标
var symbol = new esri.symbol.PictureMarkerSymbol("./img/carLogo.png", 25, 20);
var graphic = new Graphic(point, symbol);
let attr = {x:x,y:y,desc:'old point'};
graphic.attr = attr;
//记录图层上已经填加的车辆坐标
all_points.push(graphic);
//增加点们到pointlayer图层
pointlayer.add(graphic);
};
//更新弹窗信息
function updatePopup(data){
var point = new Point(data.x,data.y,new SpatialReference({
wkid: 4326
}));
popup.hide();
var dom = "<table>"+
"<tr><td>车牌</td><td>12345</td></tr>"+
"<tr><td>经纬度</td><td>116.7 39.9</td></tr>"+
"</table>";
popup.setTitle('图形信息');
popup.setContent(dom);
popup.show(point)
}
//模拟车辆的运动
setTimeout(function(){
//修改坐标
let x_old = lnglats[0]['oldPosition'][0], y_old = lnglats[0]['oldPosition'][1];
let x = lnglats[0]['position'][0],y = lnglats[0]['position'][1];
var point = new Point(x,y,new SpatialReference({
wkid: 4326
}));
//移动车辆位置
all_points[0].setGeometry(point);
//修改弹窗绑定信息
let attr ={x:x,y:y,desc:'moved new points'};
all_points[0].attr = attr;
//修改弹窗信息
if(popup_point.x == x_old&popup_point.y == y_old){
updatePopup(attr);
}
},5000);
});
</script>
</head>
<body>
<!-- 地图div的id设为map -->
<div id="map"></div>
</body>
</html>
![ArcGIS操作系列10- Arcmap 中矢量图层面积的计算方法[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)