首页 > 其他分享 >Cesium加载广告牌(一)

Cesium加载广告牌(一)

时间:2023-04-21 09:44:49浏览次数:37  
标签:广告牌 bill Entity let Cesium new 加载

Cesium加载广告牌(一)

在Cesium开发中需要加载图标等操作,这时候就需要使用Cesium中添加广告牌的功能,这里需要用到一个很重要的属性方法Entity()。在官方文档中,Entity的解释为:将多种形式的可视化实体聚合到单个高级对象中。它们可以手动创建并添加到Viewer实体中,也可以由数据源(如CzmlDataSource和GeoJsonDataSource)生成,是实体的集合。Entity包含很多的属性id、name、availability、show、description、position、orientation、viewFrom、parent等其他表示entity类型。此处以billboard为例,实现添加广告牌的功能。

总的来说,添加广告牌实体分为三步。

1、声明一个Entity对象。

let bill = new Cesium.Entity({})

2、在对象中添加实体需要显示的位置。

let bill = new Cesium.Entity({
  	  position: new Cesium.Cartesian3.fromDegrees(119.78542186676341, 29.173544144850784),
    })

3、在对象中添加需要显示的实体类型。

let bill = new Cesium.Entity({
    position: new Cesium.Cartesian3.fromDegrees(119.78542186676341, 29.173544144850784),
    billboard: {
            	image: "./img/laboratory.png",
             }
})

这样就已经添加了一个简易的广告牌。但是这样的广告牌显示效果并不好,广告牌也只有一半显示在地上。因此需要对广告牌进行其他属性的设置。
首先让广告牌完全显示在地面。这里可以给显示的位置提供一个高度。

let bill = new Cesium.Entity({
    position: new Cesium.Cartesian3.fromDegrees(119.78542186676341, 29.173544144850784,100),
    billboard: {
            	image: "./img/laboratory.png",
             }
})

但是,使用着用方法需要根据广告牌的大小实时调整所给的高度,并不利于开发,因此除非有需求需要广告牌浮空,所以并不推荐此方法。因此我们使用另一种方法让广告牌贴地显示。这样一来,就会让广告牌显示在地形上,不会飘在空中,或者掉在地形的下边

heightReference:广告牌的相对位置,有三种属性:NONE,CLAMP_TO_GROUND,RELATIVE_TO_GROUND

disableDepthTestDistance:禁用深度检测的相机距离,是Number类型

let bill = new Cesium.Entity({
    position: new Cesium.Cartesian3.fromDegrees(119.78542186676341, 29.173544144850784),
    billboard: {
            	image: "./img/laboratory.png",
                heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
				disableDepthTestDistance: Number.POSITIVE_INFINITY,
             }
})

这样一来图标就可以实现广告牌的贴地处理,设置完成贴地属性。

标签:广告牌,bill,Entity,let,Cesium,new,加载
From: https://www.cnblogs.com/DTCLOUD/p/17339202.html

相关文章

  • 微信小程序加载第三方字体
    一、加载本地字体做小程序项目时,有时为了提升页面展示效果,会引入一些第三方字体,引入方式如下代码片段/*直接在app.css引入*/@font-face{font-family:"alifont";//是你封装的名字src:url('./static/css/subset-AlibabaPuHuiTiR.ttf')format('truetype');//你......
  • pyinstaller 打包时第三方模块与图片资源加载
    打包命令pyinstaller--onefile--windowed**.py 修改**.spec文件pathex=['/Library/Frameworks/Python.framework/Versions/3.7/lib/python3.7/site-packages/ddddocr'],datas=[('./images','images'),('/Library/Frameworks/Python.fram......
  • ONVIF网络摄像头(IPC)客户端开发—RTSP RTCP RTP加载H264视频流
    前言:RTSP,RTCP,RTP一般是一起使用,在FFmpeg和live555这些库中,它们为了更好的适用性,所以实现起来非常复杂,直接查看FFmpeg和Live555源代码来熟悉这些协议非常吃力,这里将它们独立出来实现,以便更好的理解协议。本文主要介绍RTSP,RTCP,RTP加载H264数据流。说明:(1)大华IPC摄像头作为服......
  • ONVIF网络摄像头(IPC)客户端开发—RTSP RTCP RTP加载AAC音频流
    前言:RTSP,RTCP,RTP一般是一起使用,在FFmpeg和live555这些库中,它们为了更好的适用性,所以实现起来非常复杂,直接查看FFmpeg和Live555源代码来熟悉这些协议非常吃力,这里将它们独立出来实现,以便更好的理解协议。本文主要介绍RTSP,RTCP,RTP加载AAC音频流。说明:(1)大华IPC摄像头作为服......
  • tomcat启动时,加载类
    有时候在开发Web应用的时候,需要tomcat启动后自动加载一个用户的类,执行一些初始化方法,如从数据库中加载业务字典到内存中,因此需要在tomcat启动时就自动加载一个类,或运行一个类的方法。可以采用在WEB-INF/web.xml中添加一个监听程序(ServletContextListener配置......
  • ArcGIS API for JavaScript 4.x加载GeoServer发布的WMTS服务
    前言 以前用OpenLayers加载GeoServer我记得很简单,现在用ArcGISAPI加载捣鼓了一天没搞好,第二天早上来参考一篇文章搞好了,我这纯属记录下。背景 客户没有ArcGISServer的许可,所以就只能用GeoServer发布或者离线切片,先研究下GeoServer,后面如果心情好再研究下离线切片。......
  • 无界微前端(wujie):element-ui 弹框内使用select组件,弹出框位置异常解决方案 (主程序加载
    https://wujie-micro.github.io/doc/guide/ element-ui弹框内使用select组件,弹出框位置异常解决方案第一步:在子应用中: 以上3步就好啦!!!是不是很简单这个框架坑很多,希望对大家有帮助!!! ......
  • Cesium中Camera的常用方法
    08-Cesium中Camera的常用方法camera是viewer.scene中的属性,用来控制当前的可见域。viewer.camera是快捷写法,访问的是viewer.scene.camera,所以调用时这两种写法都行。介绍三种常用的view.carmera方法。(1)setViewCamera根据视图位置直接定位。constposition=Cesium.Cartesia......
  • 图片懒加载插件lazyload使用方法
    一、如何使用:LazyLoad依赖于jQuery。引入文件<scripttype="text/javascript"src="jquery.js"></script><scripttype="text/javascript"src="jquery.lazyload.js"></script>图片基本属性的设置<imgclass="......
  • font-display 文本在网页字体加载期间保持可见状态
    为确保文本在网页字体加载期间保持可见状态,可以考虑以下几种方法:1.使用系统默认字体或web-safe字体:这些字体通常是已经在大多数操作系统和浏览器中安装和加载的,因此在页面加载期间可以立即呈现。这样,即使自定义字体尚未加载,文本也将始终可见。2.通过CSS实现字体预加载:可以在C......