1.点
const point = {//点的坐标信息
type: "point",
longitude: -49.97,
latitude: 41.73
};
const markerSymbol = {//点的样式
type: "simple-marker",
color: [226, 119, 40],
outline: {
color: [255, 255, 255],
2
}
};
const pointGraphic = new Graphic({//创建点图斑对象
geometry: point,
symbol: markerSymbol
});
2.线
const polyline = {//线的坐标信息
type: "polyline", // autocasts as new Polyline()
paths: [[-111.3, 52.68], [-98, 49.5], [-93.94, 29.89]]
};
const lineSymbol = {//线的样式
type: "simple-line",
color: [226, 119, 40],
4
};
const lineAtt = {//线的属性
Name: "Keystone Pipeline",
Owner: "TransCanada",
Length: "3,456 km"
};
const polylineGraphic = new Graphic({//创建线图斑对象并且绑定属性以及弹出框信息
geometry: polyline,
symbol: lineSymbol,
attributes: lineAtt,
popupTemplate: {
title: "{Name}",
content: [
{
type: "fields",
fieldInfos: [
{
fieldName: "Name"
},
{
fieldName: "Owner"
},
{
fieldName: "Length"
}
]
}
]
}
});
3.面
const polygon = {//面的坐标信息
type: "polygon",
rings: [[-64.78, 32.3], [-66.07, 18.45], [-80.21, 25.78], [-64.78, 32.3]]
};
const fillSymbol = {//面的样式
type: "simple-fill",
color: [227, 139, 79, 0.8],
outline: {
// autocasts as new SimpleLineSymbol()
color: [255, 255, 255],
1
}
};
const polygonGraphic = new Graphic({//创建面图斑
geometry: polygon,
symbol: fillSymbol
});
4.将上面创建的Graphic加入到地图
第一中方式：view.graphics.addMany([pointGraphic, polylineGraphic, polygonGraphic]);
第二种方式： let graphicLayer = GraphicsLayer();
graphicLayer.addMany[pointGraphic, polylineGraphic, polygonGraphic]
graphicLayer.markId = "xxx";
view.map.add(graphicLayer);