mars3d实现GraphicLayer获取当前相机视角内的可视点位(矢量数据

效果:

mars3d实现GraphicLayer获取当前相机视角内的可视点位(矢量数据

相关依赖api:

  1. map.getExtent();

提取地球当前视域边界,示例:{ xmin: 70, xmax: 140, ymin: 0, ymax: 55, height: 0, }

2.graphicLayer.eachGraphic遍历所有矢量数据并将其作为参数传递给回调函数判断是否在当前视域边界内

3.写个判断:

复制代码
/**
* 获取地图边界内的矢量点位
* @param graphicLayer
* @param isExtend
*/
const getGraphics = (graphicLayer: mars3d.layer.GraphicLayer | undefined, isExtend: Boolean = true) => {
if (graphicLayer && (graphicLayer as any)._map) {
const map = (graphicLayer as any)._map as mars3d.Map;
const graphics: mars3d.graphic.BillboardEntity[] = [];
const extend = map.getExtent();
if (isExtend) {
graphicLayer.eachGraphic((graphic: mars3d.graphic.BillboardEntity) => {
const { lng, lat } = graphic.point;
if (lng >= extend.xmin && lng <= extend.xmax && lat >= extend.ymin && lat <= extend.ymax) {
graphics.push(graphic);
}
});
return graphics;
} else {
return graphicLayer.getGraphics();
}
}
};

4.return返回在当前屏幕可视区域内的数据

补充:

1.如果是不规则多边形可以参考:

2.获取的视域转经纬度参考: 几种坐标的互转算法

复制代码
//屏幕坐标 转换为 笛卡尔空间直角坐标
var cartesian3 = mars3d.PointUtil.getCurrentMousePosition(map.scene, windowPosition);

//笛卡尔空间直角坐标 转换为 屏幕坐标
var windowPosition = Cesium.SceneTransforms.wgs84ToWindowCoordinates(map.scene, cartesian3);//v1.119之前版本
var windowPosition = Cesium.SceneTransforms.worldToWindowCoordinates(map.scene, cartesian3); //v1.119及之后版本

//笛卡尔空间直角坐标   转换为   地理坐标(弧度制)
var cartographic = Cesium.Cartographic.fromCartesian(cartesian3);

//笛卡尔空间直角坐标   转换为   地理坐标(经纬度)
var point = mars3d.LngLatPoint.fromCartesian(cartesian3);

//地理坐标(弧度制)   转换为   笛卡尔空间直角坐标
var cartesian3 = Cesium.Cartesian3.fromRadians(lng, lat, height); //lng\lat为弧度制

//地理坐标(经纬度)  转换为  笛卡尔空间直角坐标
var cartesian3 = Cesium.Cartesian3.fromDegrees(longitude, latitude, height); 

或者使用 mars3d.LngLatPoint 作为中间类来做转换

复制代码
//笛卡尔空间直角坐标   转换为   地理坐标(经纬度) 
var point = mars3d.LngLatPoint.fromCartesian(cartesian3);

//地理坐标(弧度制)   转换为    地理坐标(经纬度) 
var point = mars3d.LngLatPoint.fromCartographic(cartographic); 
 
//point 转换为  其他坐标  
var cartesian3 = point.toCartesian();  //转换为  笛卡尔空间直角坐标 
var cartographic = point.toCartographic();  //转换为  地理坐标(弧度制) 

示例:

复制代码
map.on(mars3d.EventType.click,  function (event) {
    var point = mars3d.LngLatPoint.fromCartesian(event.cartesian); //转为经纬度
    console.log("鼠标单击坐标", point);
});
相关推荐
_Johnny_2 分钟前
ETCD 配额/空间告警模拟脚本
数据库·chrome·etcd
晓得迷路了4 分钟前
栗子前端技术周刊第 116 期 - 2025 JS 状态调查结果、Babel 7.29.0、Vue Router 5...
前端·javascript·vue.js
How_doyou_do6 分钟前
执行上下文、作用域、闭包 patch
javascript
叫我一声阿雷吧12 分钟前
深入理解JavaScript作用域和闭包,解决变量访问问题
开发语言·javascript·ecmascript
淡忘_cx18 分钟前
使用Jenkins自动化部署vue项目(2.528.2版本)
vue.js·自动化·jenkins
顾北1219 分钟前
AI对话应用接口开发全解析:同步接口+SSE流式+智能体+前端对接
前端·人工智能
victory043125 分钟前
服务器病毒处理记录
运维·服务器·chrome
iDao技术魔方32 分钟前
深入Vue 3响应式系统:为什么嵌套对象修改后界面不更新?
javascript·vue.js·ecmascript
历程里程碑36 分钟前
普通数组-----除了自身以外数组的乘积
大数据·javascript·python·算法·elasticsearch·搜索引擎·flask
chenjingming66636 分钟前
浏览器(如chrome)代理抓包时提示Your Connection is not private 问题临时处理
chrome·https