Cesium.js 添加billboard广告牌,点击改变其文本和图标
2021/4/12 18:32:33
本文主要是介绍Cesium.js 添加billboard广告牌,点击改变其文本和图标,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
var monitorEntity = viewer.entities.add({ name: "video", position: Cesium.Cartesian3.fromDegrees(109.44, 32.11,30.0), point: { //点 pixelSize: 0, HeightReference: 1000 }, label: { //文字标签 text: "文字标签", font: '500 30px Helvetica',// 15pt monospace scale: 0.5, style: Cesium.LabelStyle.FILL, fillColor: Cesium.Color.WHITE, pixelOffset: new Cesium.Cartesian2(-8, -35), //偏移量 showBackground: true, backgroundColor: new Cesium.Color(0.5, 0.6, 1, 1.0) }, billboard: { //图标 image: '../images/marker01.png', width: 50, height: 50 }, }); // 视角定位 viewer.flyTo(monitorEntity, { duration: 2, offset: { heading: Cesium.Math.toRadians(0.0), pitch: Cesium.Math.toRadians(-30), range: 720 } }); //点击广告牌改变文本和图标 var handlerVideo = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas); handlerVideo.setInputAction(function (click) { var pick = viewer.scene.pick(click.position); if (pick && pick.id._name == "video") { monitorEntity._billboard._image._value = '../images/marker02.png'; monitorEntity._label._text._value = "label"; } else { return; } }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
这篇关于Cesium.js 添加billboard广告牌,点击改变其文本和图标的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-05-30React Native常用组件-点击组件
- 2024-05-30uniapp+vue3+uv-ui手机端后台OA管理模板
- 2024-05-29Python网络爬虫的时候json=就是让你少写个json.dumps()
- 2024-05-27React Native常用组件-展示组件
- 2024-05-27React Native常用组件-列表组件
- 2024-05-09vue3开发前端表单缓存自定义指令,移动端h5必备插件
- 2024-05-09React Hooks在class组件中的使用方式
- 2024-03-30[OIDC in Action] 2. 基于OIDC(OpenID Connect)的SSO(纯JS客户端)
- 2024-03-29terraform jsonencode
- 2024-03-13vuex-persist