本文主要是介绍new mars3d.layer.GeoJsonLayer({实现图标点billboard贴模型聚合效果,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
说明:
1.【mars3d】的依赖库cesium本身是不支持贴地/贴模型操作的
2.sdk内部异步计算了数据的贴地/高度值之后,更新到图层上实现贴地/贴模型效果的
3.相关的示例链接:
1.功能示例(Vue版) | Mars3D三维可视化平台 | 火星科技
4.相关的计算贴地/贴模型的参数:
1.PointUtil - V3.7.0 - Mars3D API文档
关键代码参考:
function addLayer() {
const tiles3dLayer = new mars3d.layer.TilesetLayer({
name: "合肥市建筑物",
url: "//data.mars3d.cn/3dtiles/jzw-hefei/tileset.json",
maximumScreenSpaceError: 1,
marsJzwStyle: true, // 打开建筑物特效(内置Shader代码)
popup: [
{ field: "objectid", name: "编号" },
{ field: "name", name: "名称" },
{ field: "height", name: "楼高", unit: "米" }
],
center: { lat: 31.841018, lng: 117.252932, alt: 1346, heading: 38, pitch: -26 },
flyTo: true
})
map.addLayer(tiles3dLayer)
geoJsonLayer = new mars3d.layer.GeoJsonLayer({
name: "体育设施点",
url: "//data.mars3d.cn/file/geojson/hfty-point.json",
clustering: {
enabled: true,
pixelRange: 20
},
symbol: {
type: "billboardP",
styleOptions: {
image: "img/marker/mark-red.png",
verticalOrigin: Cesium.VerticalOrigin.BOTTOM
}
},
popup: "all",
flyTo: true
})
map.addLayer(geoJsonLayer)
geoJsonLayer.on("clustering", function (event) {
// console.log("新增聚合对象", event)
const billboard = event.cluster.billboard
billboard.position = mars3d.PointUtil.getSurfacePosition(map.scene, billboard.position)
})
}
相关效果:
这篇关于new mars3d.layer.GeoJsonLayer({实现图标点billboard贴模型聚合效果的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!