GIS-ArcGIS 与 ThreeJs交互联动
一、从GIS触发Three场景
MapFeatureLayer.on("click", function (evt) {
graphicsLayerOfMouse.clear();
var HighlightGraphic = new Graphic(evt.graphic.geometry, highlightSymbol);
graphicsLayerOfMouse.add(HighlightGraphic);
OpenInfoDlg(evt);
var graphicObject = evt.graphic;
Find3DSpaceObjects(graphicObject);
});
//根据地图拾取的目标,在三维空间中查询对应四至体
Find3DSpaceObjects = function (graphicObject) {
try {
if (SelectedResults == undefined) {
for (var i = 0; i < MapFeatureLayer.graphics.length; i++) {
var feature = MapFeatureLayer.graphics[i];
if (graphicObject.attributes["FID"] == feature.attributes["FID"]) {
objects[i].material.color.setHex(Math.random() * 0xffffff);
break;
}
}
}
else {
for (var i = 0; i < SelectedResults.length; i++) {
var curObject = SelectedResults[i];
var feature = curObject.feature;
if (graphicObject.attributes["FID"] == feature.attributes["FID"]) {
objects[i].material.color.setHex(Math.random() * 0xffffff);
break;
}
}
}
} catch (error) {
console.log(error);
}
}
SelectedResults 是查询出来在地图上显示的要素类数组
MapFeatureLayer.graphics 是缺省加载FeatureLayer返回的要素
二、从Three场景触发GIS
为ThreeJs添加鼠标点击事件
document.addEventListener('mousedown', onDocumentMouseDown, false);
事件函数体:
var SelectedIndex = -1;
function onDocumentMouseDown(event) {
if (SelectedIndex != -1) {
restoreObj(SelectedIndex);
}
if (event.target == renderer.domElement) {
event.preventDefault();
mouse.x = (event.offsetX / renderer.domElement.clientWidth) * 2 - 1;
mouse.y = - (event.offsetY / renderer.domElement.clientHeight) * 2 + 1;
raycaster.setFromCamera(mouse, camera);
var intersects = raycaster.intersectObjects(objects);
if (intersects.length > 0) {
intersects[0].object.material.color.setHex(Math.random() * 0xffffff);
if (intersects[0].object.DataObject != undefined) {
OpenInfoDlgShow(intersects[0].object.DataObject);
try {
SelectedIndex = intersects[0].object.DataIndex;
showObj(SelectedIndex);
} catch (error) {
console.log(error);
}
}
else {
console.log("未绑定数据");
}
}
}
}
对应的地图方法:
showObj = function (index) {
try {
if (SelectedResults != undefined) {
var curObject = SelectedResults[index];
var feature = curObject.feature;
console.log(curObject);
var HighlightGraphic = new Graphic(feature.geometry, highlightSymbol);
labelLayer.add(HighlightGraphic);
var pt = feature.geometry;
var font = new esri.symbol.Font();
font.setSize("10pt");
font.setWeight(esri.symbol.Font.WEIGHT_BOLD);
var text = new esri.symbol.TextSymbol(feature.attributes.Name);
text.setAlign(esri.symbol.TextSymbol.ALIGN_START);
text.setFont(font);
text.setOffset(2, -15);
text.setColor(new dojo.Color([255, 0, 0, 1]));
var labelGraphic = new esri.Graphic(pt, text);
labelLayer.add(labelGraphic);
}
else {
MapFeatureLayer.graphics[index].symbol = highlightSymbol;
MapFeatureLayer.redraw();
var pt = ReservoirMapLayer.graphics[index].geometry;
var font = new esri.symbol.Font();
font.setSize("10pt");
font.setWeight(esri.symbol.Font.WEIGHT_BOLD);
var text = new esri.symbol.TextSymbol(MapFeatureLayer.graphics[index].attributes.Name);
text.setAlign(esri.symbol.TextSymbol.ALIGN_START);
text.setFont(font);
text.setOffset(2, -15);
text.setColor(new dojo.Color([255, 0, 0, 1]));
var labelGraphic = new esri.Graphic(pt, text);
labelLayer.add(labelGraphic);
}
} catch (error) {
console.log(error);
}
};
restoreObj = function (index) {
try {
labelLayer.clear();
MapFeatureLayer.graphics[index].symbol = symbolOfDefaultReservoir;
MapFeatureLayer.redraw();
} catch (error) {
console.log(error);
}
};
博客地址: http://www.cnblogs.com/defineconst/
博客版权: 本文以学习、研究和分享为主,欢迎转载和各类爬虫,但必须在文章页面明显位置给出原文链接。 如果文中有不妥或者错误的地方还望高手的您指出,以免误人子弟。如果您有更好的建议,不如留言一起讨论,共同进步! 再次感谢您耐心的读完本篇文章。
博客版权: 本文以学习、研究和分享为主,欢迎转载和各类爬虫,但必须在文章页面明显位置给出原文链接。 如果文中有不妥或者错误的地方还望高手的您指出,以免误人子弟。如果您有更好的建议,不如留言一起讨论,共同进步! 再次感谢您耐心的读完本篇文章。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· 单线程的Redis速度为什么快?
· 展开说说关于C#中ORM框架的用法!
· Pantheons:用 TypeScript 打造主流大模型对话的一站式集成库