当前位置:网站首页>Cesium 多边形增加文字标签(polygon 加 label)多边形中心点偏移问题解决
Cesium 多边形增加文字标签(polygon 加 label)多边形中心点偏移问题解决
2022-06-28 00:05:00 【最凶残的小海豹】
之前在网上搜到的获取中心点的方法如下:
// 多边形的坐标集合(如果已经获取到了,就跳过这一步)
var polygon_point_arr = polygon_point_entity.polygon.hierarchy.getValue(Cesium.JulianDate.now()).positions;
// 根据坐标集合构造BoundingSphere获取中心点坐标
let center_point = Cesium.BoundingSphere.fromPoints(polygon_point_arr).center
// 设置点标记的坐标(这一步将中心点转到地球表面)
polygon_point_entity.position = Cesium.Ellipsoid.WGS84.scaleToGeodeticSurface(center_point);
// 添加点标记
polygon_point_entity.label = {
// 点标记参数
}
但是如果多边形不太规则或者点比较多的情况下,标记的位置就不在中心点了,会有偏移,例如下图
原因:boundingsphere 计算的中心点是外接圆的圆心,所以导致了中心点会在图形外。
相关资料参考的是:https://www.lmlphp.com/user/58093/article/item/771705/
解决方案: 使用 turf.js 来计算。
turf.js 中文网:https://turfjs.fenxianglu.cn/
代码:turf.js 版本是 6.5.0
// 多边形的坐标集合(如果已经获取到了,就跳过这一步)
var polygon_point_arr = polygon_point_entity.polygon.hierarchy.getValue(Cesium.JulianDate.now()).positions;
// 保存转换后的点数组,这个格式必须按照 turf 的要求来
let turf_arr = [[]];
// 坐标转换
polygon_point_arr.forEach(val => {
let polyObj = {
}
// 空间坐标转世界坐标(弧度) 同 Cesium.Cartographic.fromCartesian
let cartographic = gvEarth.scene.globe.ellipsoid.cartesianToCartographic(val)
// 弧度转为角度(经纬度)
polyObj.lon = Cesium.Math.toDegrees(cartographic.longitude)
polyObj.lat = Cesium.Math.toDegrees(cartographic.latitude)
turf_arr[0].push([polyObj.lon, polyObj.lat])
})
// turf 需要将整个点闭合,所以最后一个点必须和起点重合。
turf_arr[0].push(turf_arr[0][0])
let turf_position = turf.polygon(turf_arr)
let turf_position_point = turf.centerOfMass(turf_position)
// 设置点标记坐标
polygon_point_entity.position = Cesium.Cartesian3.fromDegrees(turf_position_point.geometry.coordinates[0], turf_position_point.geometry.coordinates[1], 0)
// 添加点标记
polygon_point_entity.label = {
// 点标记参数
}

边栏推荐
- 模块化开发
- Prometeus 2.35.0 新特性
- Qu'est - ce que la numérisation? Qu'est - ce que la transformation numérique? Pourquoi les entreprises choisissent - elles la transformation numérique?
- Lefse analyzes the local implementation method with all installation files and details to ensure success.
- Xctf attack and defense world misc wage earner advanced zone
- LMSOC:一种对社会敏感的预训练方法
- Interface component telerik UI for WPF Getting Started Guide - how to switch custom styles using themes
- 面试官问:JS的this指向
- Evaluation - rank sum ratio comprehensive evaluation
- Solve storage problems? WMS warehouse management system solution
猜你喜欢

基于可学习尺寸自适应分子亚结构的药物相互作用预测
![[description] solution to JMeter garbled code](/img/13/01682d08cbcb47be5d7c21304ef901.png)
[description] solution to JMeter garbled code

什么是数字化?什么是数字化转型?为什么企业选择数字化转型?

Neural network of zero basis multi map detailed map

零基础多图详解图神经网络

一张图弄懂 MIT,BSD,Apache几种开源协议之间的区别

Take n multiple table names of a database as the values of a column in another table (the range can be a table in another database)

Review of drug discovery-02-prediction of molecular properties

万字长文看懂商业智能(BI)|推荐收藏

【ELT.ZIP】OpenHarmony啃论文俱乐部—数据密集型应用内存压缩
随机推荐
什麼是數字化?什麼是數字化轉型?為什麼企業選擇數字化轉型?
pytorch_lightning.utilities.exceptions.MisconfigurationException: You requested GPUs: [1] But...
fiddle如何使用代理
[Yocto RM]9 - QA Error and Warning Messages
Adobe Premiere基础-编辑素材文件常规操作(脱机文件,替换素材,素材标签和编组,素材启用,便捷调节不透明度,项目打包)(十七)
Arrays. Aslist() pit
想开户买股票,在网上办理股票开户安全吗?
MySQL - function
Self supervised learning and drug discovery
[Yocto RM]8 - OpenEmbedded Kickstart (.wks) Reference
基于AM335X开发板 ARM Cortex-A8——Acontis EtherCAT主站开发案例
评价——秩和比综合评价
Lefse analyzes the local implementation method with all installation files and details to ensure success.
pytorch_ lightning. utilities. exceptions. MisconfigurationException: You requested GPUs: [1] But...
ionic4实现半星评分
学习 pickle
Review of drug discovery-02-prediction of molecular properties
万字长文看懂商业智能(BI)|推荐收藏
网络爬虫是什么
766. 托普利茨矩阵