当前位置:网站首页>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 = {
// 点标记参数
}

边栏推荐
- MySQL - function
- To understand what is synchronous, asynchronous, serial, parallel, concurrent, process, thread, and coroutine
- Adobe Premiere foundation - sound adjustment (volume correction, noise reduction, telephone tone, pitch shifter, parameter equalizer) (XVIII)
- [Yocto RM] 2 - Yocto Project Terms
- [Yocto RM]1 - System Requirements
- 【永艺XY椅】试用体验
- Xctf attack and defense world misc wage earner advanced zone
- 药物发现综述-03-分子设计与优化
- Adobe Premiere Basics - general operations for editing material files (offline files, replacing materials, material labels and grouping, material enabling, convenient adjustment of opacity, project pa
- [sylixos] I2C device driver creation and use
猜你喜欢

Adobe Premiere基础-常用的视频特效(边角定位,马赛克,模糊,锐化,手写工具,效果控件层级顺序)(十六)

The research group of Xuyong and duanwenhui of Tsinghua University has developed an efficient and accurate first principles electronic structure deep learning method and program
![pytorch_ lightning. utilities. exceptions. MisconfigurationException: You requested GPUs: [1] But...](/img/b4/8921c3ca5cd5a547768489d4a79202.png)
pytorch_ lightning. utilities. exceptions. MisconfigurationException: You requested GPUs: [1] But...

基于可学习尺寸自适应分子亚结构的药物相互作用预测

Maimai hot post: Why are big factories keen on making wheels?

LMSOC:一种对社会敏感的预训练方法

Web3 technology initial experience and related learning materials

【牛客讨论区】第四章:Redis

数据库的新选择 Amazon Aurora

零基礎多圖詳解圖神經網絡
随机推荐
The contents of the latex table are left, middle and right
MySQL十种锁,一篇文章带你全解析
Voice network VQA: make the user's subjective experience of unknown video quality in real-time interaction known
PV操作原语
Is there any risk in opening an account for flush stock? Is it safe for flush to open an account
零基礎多圖詳解圖神經網絡
Adobe Premiere Basics - common video effects (corner positioning, mosaic, blur, sharpen, handwriting tools, effect control hierarchy) (16)
Using redis bitmap to realize personnel online monitoring
一张图弄懂 MIT,BSD,Apache几种开源协议之间的区别
零基础多图详解图神经网络
Import the data table in MySQL into Excel
Database query optimization: master-slave read-write separation and common problems
树莓派实现温控风扇智能降温
LMSOC:一种对社会敏感的预训练方法
【sylixos】i2c设备驱动创建和使用
COSCon'22 讲师征集令
Adobe Premiere基础-常用的视频特效(边角定位,马赛克,模糊,锐化,手写工具,效果控件层级顺序)(十六)
药物发现综述-01-药物发现概述
Lmsoc: a socially sensitive pre training method
Numpy----np.reshape()