近来闲着无聊,参考网上的一些论文资料,结合ArcGIS API for JavaScript 4.23最新版做了一个军事标绘系统,里面扩展了将近30多种军标符号,包括二维和三维下面的点、线、面、箭头、旗帜等。
其大致原理就是使用“esri/views/draw/Draw”这个api模块来扩展,结合相应图标的算法来绘制,然后指定各自的symbol渲染即可。
例如我们绘制一个文字标绘,首先初始化Draw这个绘制工具,然后指定draw的绘制类型为“text”,最后指定绘制出来的要素的渲染符号,具体代码如下:
const [Draw] = await loadModules(["esri/views/draw/Draw"], gconfig.arcgis_options);
const draw = new Draw({
view,
});
//....
let pointGeometry1 = {
type: "point",
x: this.x,
y: this.y,
spatialReference: this.view.spatialReference
};
let screenPoint = this.view.toScreen(pointGeometry1);
screenPoint.x += (this.text.length * (fontSize - 6));
screenPoint.y += 50;
let toMapPoint = this.view.toMap(screenPoint);
let pointGeometry2 = {
type: "point",
x: toMapPoint.x,
y: toMapPoint.y,
spatialReference: this.view.spatialReference
};
const pointGeometry = GeoRectangle().getRectangle([pointGeometry1, pointGeometry2]);
const [Graphic] = await loadModules(['esri/Graphic'], gconfig.arcgis_options);
let graphic = new Graphic({
geometry: pointGeometry,
symbol: symbol,
attributes: "Text:" + this.text
});
this.graphicsLayer.add(graphic);
//....
currentObj.simpleMarker = {
type: "simple-marker",
color: "red",
size: "8px"
};
军标库的使用结合主流的前端模块化方案,直接通过import的方式导入即可使用,不需要dojo等其他过时的框架库,不需要额外离线部署其他的东西。军标库在二三维下的绘制演示结果如下:
欢迎有需要的同学付费购买,拒绝白嫖(QQ:2250685378)