当前位置: 首页 > news >正文

【WebGIS实例】(10)Cesium开场效果(场景、相机旋转,自定义图片底图)

效果

漫游效果视频:

【WebGIS实例】(10)Cesium开场效果(场景、相机

点击鼠标后将停止旋转并正常加载影像底图:
在这里插入图片描述

代码

可以直接看代码,注释写得应该比较清楚了:

/** @Date: 2023-07-28 16:21:53* @LastEditors: ReBeX  420659880@qq.com* @LastEditTime: 2023-07-28 18:18:34* @FilePath: \cesium-tyro-blog\src\utils\Visualization\roaming.js* @Description: 相机漫游效果*/import { viewer } from '@/utils/createCesium.js' // 引入地图对象
import * as Cesium from 'cesium'import darkEarth from '@/assets/images/darkEarth.jpg'function showAllImagery(boolean = true) {// 获取图像图层集合const imageryLayers = viewer.imageryLayers;// 遍历图像图层并隐藏它们let numLayers = imageryLayers.length;for (let i = 0; i < numLayers; i++) {const layer = imageryLayers.get(i); // 获取图像图层对象layer.show = boolean; // 设置图像图层隐藏}
}function roaming() {let isRoaming = true; // 漫游标志位const DEFAULT_LIGHTING = viewer.scene.globe.enableLighting; // 默认光照状态const DEFAULT_SKY_ATMOSPHERE = viewer.scene.skyAtmosphere.show; // 默认光照状态let bgImglayer;showAllImagery(false); // 隐藏所有图层viewer.clock.multiplier = -2000.0;  // 时间加速!bgImglayer = viewer.imageryLayers.addImageryProvider( // 加载背景底图new Cesium.SingleTileImageryProvider({url: '/src/assets/images/darkEarth.jpg'}));if (!DEFAULT_LIGHTING) {viewer.scene.globe.enableLighting = true; // 开启光照}if (!DEFAULT_SKY_ATMOSPHERE) {viewer.scene.skyAtmosphere.show = true; // 开启天空大气,能在一定程度上降低地球轮廓锯齿}// 添加鼠标事件,触发后停止漫游效果const handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas); // 交互句柄handler.setInputAction((event) => {isRoaming = false // 停止旋转showAllImagery(true) // 显示图层if (!DEFAULT_LIGHTING) {viewer.scene.globe.enableLighting = false; // 关闭光照}if (!DEFAULT_SKY_ATMOSPHERE) {viewer.scene.skyAtmosphere.show = false; // 关闭光照}viewer.imageryLayers.remove(bgImglayer, true); // 移除图层viewer.clock.multiplier = 1;  // 正常时间流速handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK); // 移除鼠标事件监听}, Cesium.ScreenSpaceEventType.LEFT_CLICK);(function roamingEvent() {if (isRoaming) {// 控制相机围绕 Z 轴旋转viewer.camera.rotate(Cesium.Cartesian3.UNIT_Z, Cesium.Math.toRadians(0.1));requestAnimationFrame(roamingEvent);}})()
}export {roaming
}

调用:

import {roaming} from '@/utils/Visualization/roaming.js'roaming()

相关文章:

【WebGIS实例】(10)Cesium开场效果(场景、相机旋转,自定义图片底图)

效果 漫游效果视频&#xff1a; 【WebGIS实例】&#xff08;10&#xff09;Cesium开场效果&#xff08;场景、相机 点击鼠标后将停止旋转并正常加载影像底图&#xff1a; 代码 可以直接看代码&#xff0c;注释写得应该比较清楚了&#xff1a; /** Date: 2023-07-28 16:21…...

【Spring】IOC的原理

一、 IOC 的概念 Spring 的 IOC &#xff0c;即控制反转&#xff0c;所谓控制反转 —— 本来管理业务对象&#xff08;bean&#xff09;的操作是由我们程序员去做的&#xff0c;但是有了 Spring 核心容器后&#xff0c;这些 Bean 对象的创建和管理交给我们Spring容器去做了&am…...

AI加速游戏开发 亚马逊云科技适配3大场景,打造下一代游戏体验

随着疫情的消散&#xff0c;中国游戏产业正在快速前进。在伴随着游戏产业升级的同时&#xff0c;整个行业都在面临着新的挑战与新的诉求。亚马逊云科技游戏研发解决方案和服务&#xff0c;覆盖端到端3大场景&#xff0c;为游戏公司与游戏开发人员赋能。 场景1&#xff1a;AI辅助…...

C++ | 继承(基类,父类,超类),(派生类,子类)

文章参考&#xff1a;https://blog.csdn.net/war1111886/article/details/8609957 一 .继承中的访问权限关系 &#xff11;&#xff0e;基类&#xff0c;父类&#xff0c;超类是指被继承的类&#xff0c;派生类&#xff0c;子类是指继承于基类的类&#xff0e; &#xff12;…...

Commands Of Hadoop

序言 持续整理下常用的命令cuiyaonan2000163.com Command 文件拷贝 当从多个源拷贝时&#xff0c;如果两个源冲突&#xff0c;distcp会停止拷贝并提示出错信息&#xff0c;. 如果在目的位置发生冲突&#xff0c;会根据选项设置解决。 默认情况会跳过已经存在的目标文件&am…...

SQL-每日一题【620.有趣的电影】

题目 某城市开了一家新的电影院&#xff0c;吸引了很多人过来看电影。该电影院特别注意用户体验&#xff0c;专门有个 LED显示板做电影推荐&#xff0c;上面公布着影评和相关电影描述。 作为该电影院的信息部主管&#xff0c;您需要编写一个 SQL查询&#xff0c;找出所有影片…...

linux 精华总结

...

Eureka 学习笔记2:客户端 DiscoveryClient

版本 awsVersion ‘1.11.277’ DiscoveryClient # cacheRefreshTask // 配置shouldFetchRegistry if (clientConfig.shouldFetchRegistry()) {// 配置client.refresh.intervalint registryFetchIntervalSeconds clientConfig.getRegistryFetchIntervalSeconds();// 配置expB…...

okhttp原理分析

工程目录图 请点击下面工程名称&#xff0c;跳转到代码的仓库页面&#xff0c;将工程 下载下来 Demo Code 里有详细的注释 01okhttp module里 包含的设计模式&#xff1a;建造者设计模式、责任链设计模式 CustomInject 演示自定义注解 代码&#xff1a;okhttp原理分析、Andro…...

freeswitch的mod_xml_curl模块

概述 freeswitch是一款简单好用的VOIP开源软交换平台。 随着fs服务的增多&#xff0c;每一台fs都需要在后台单独配置&#xff0c;耗时耗力&#xff0c;心力憔悴。 如果有一个集中管理配置的配置中心&#xff0c;统一管理所有fs的配置&#xff0c;并可以实现动态的修改配置就…...

高速数据采集专家-FMC140【产品手册】

FMC140是一款具有缓冲模拟输入的低功耗、12位、双通道&#xff08;5.2GSPS/通道&#xff09;、单通道10.4GSPS、射频采样ADC模块&#xff0c;该板卡为FMC标准&#xff0c;符合VITA57.1规范&#xff0c;该模块可以作为一个理想的IO单元耦合至FPGA前端&#xff0c;8通道的JESD204…...

【SSM】知识集锦

项目一&#xff1a;狂神JAVA 功能1&#xff1a;实现全部书籍查询 1.思路&#xff1a;首页index.jsp ——>Controller——>hello.jsp 2.步骤&#xff1a; step1:index.jsp <% page language"java" contentType"text/html; charsetUTF-8" page…...

Flowable-中间事件-信号中间抛出事件

定义 当流程执行到达信号抛出事件时&#xff0c;流程引擎会直接抛出信号&#xff0c;其他引用了与其相同的信号捕获 事件会被触发&#xff0c;信号发出后事件结束&#xff0c;流程沿后继路线继续执行。其抛出的信号可以被信号开始事 件&#xff08;Signal Start Event&#xf…...

【算法基础:动态规划】5.3 计数类DP(整数拆分、分拆数)

文章目录 例题&#xff1a;900. 整数划分解法1——完全背包解法2——分拆数⭐⭐⭐ 例题&#xff1a;900. 整数划分 https://www.acwing.com/problem/content/902/ 解法1——完全背包 容量是 n&#xff0c;物品的大小和价值是 1 ~ n 中的所有数字。 import java.util.*;pub…...

封装(Encapsulation)

目录 概念 好处 数据隐藏 模块化设计 代码复用 简化接口 示例 意义 概念 封装&#xff08;Encapsulation&#xff09;是面向对象编程的一个核心概念&#xff0c;它指的是将数据和相关操作封装在一个对象中&#xff0c;隐藏了实现的细节。&#xff08;就是实现数据封装和…...

php 原型模式

一&#xff0c;原型模式&#xff0c;就是先创建好一个原型对象&#xff0c;然后通过拷贝原型对象来生成新的对象。适用于大对象的创建&#xff0c;因为每次new一个大对象会有很大的开销&#xff0c;原型模式仅需内存拷贝即可。 原型模式中的主要角色&#xff1a; 1&#xff0c;…...

LiveGBS流媒体平台GB/T28181功能-支持轮巡播放分屏轮巡值守播放监控视频轮播大屏轮询播放

LiveGBS支持轮巡播放分屏轮巡值守播放监控视频轮播大屏轮询播放 1、背景2、分屏展示3、选择轮播通道4、配置轮播间隔(秒)5、点击开始轮播6、轮播停止及全屏7、搭建GB28181视频直播平台 1、背景 视频监控项目使用过程中&#xff0c;有时需要大屏值守&#xff0c;值守的时候多分…...

6、Nginx实现反向代理

Nginx 反向代理是一种常见的应用场景&#xff0c;它允许 Nginx 作为中间服务器接收客户端的请求&#xff0c;并代理转发这些请求到后端的真实服务器。这种配置使得客户端只需要与 Nginx 交互&#xff0c;而后端服务器对客户端是透明的。 ngx_http_proxy_module&#xff1a; 将客…...

Leetcode——404 左叶子之和

404. 左叶子之和 难度简单&#xff08;虽然简单 但是我用递归做时 还是有点坑的&#xff09; 给定二叉树的根节点 root &#xff0c;返回所有左叶子之和。 示例 1&#xff1a; 输入: root [3,9,20,null,null,15,7] 输出: 24 解释: 在这个二叉树中&#xff0c;有两个左叶子…...

R并行计算-parallel例子1

前言&#xff1a; 通常&#xff0c;如果进程运行时间超过3分钟&#xff0c;则会考虑使用并行处理。 这听起来可能很复杂&#xff0c;但是并行计算很简单。 当你有一个重复的任务&#xff0c;它占用了你太多宝贵的时间&#xff0c;为什么不使用并行计算来节省时间呢&#xff…...

三体问题详解

从物理学角度&#xff0c;三体问题之所以不稳定&#xff0c;是因为三个天体在万有引力作用下相互作用&#xff0c;形成一个非线性耦合系统。我们可以从牛顿经典力学出发&#xff0c;列出具体的运动方程&#xff0c;并说明为何这个系统本质上是混沌的&#xff0c;无法得到一般解…...

JS手写代码篇----使用Promise封装AJAX请求

15、使用Promise封装AJAX请求 promise就有reject和resolve了&#xff0c;就不必写成功和失败的回调函数了 const BASEURL ./手写ajax/test.jsonfunction promiseAjax() {return new Promise((resolve, reject) > {const xhr new XMLHttpRequest();xhr.open("get&quo…...

BLEU评分:机器翻译质量评估的黄金标准

BLEU评分&#xff1a;机器翻译质量评估的黄金标准 1. 引言 在自然语言处理(NLP)领域&#xff0c;衡量一个机器翻译模型的性能至关重要。BLEU (Bilingual Evaluation Understudy) 作为一种自动化评估指标&#xff0c;自2002年由IBM的Kishore Papineni等人提出以来&#xff0c;…...

探索Selenium:自动化测试的神奇钥匙

目录 一、Selenium 是什么1.1 定义与概念1.2 发展历程1.3 功能概述 二、Selenium 工作原理剖析2.1 架构组成2.2 工作流程2.3 通信机制 三、Selenium 的优势3.1 跨浏览器与平台支持3.2 丰富的语言支持3.3 强大的社区支持 四、Selenium 的应用场景4.1 Web 应用自动化测试4.2 数据…...

苹果AI眼镜:从“工具”到“社交姿态”的范式革命——重新定义AI交互入口的未来机会

在2025年的AI硬件浪潮中,苹果AI眼镜(Apple Glasses)正在引发一场关于“人机交互形态”的深度思考。它并非简单地替代AirPods或Apple Watch,而是开辟了一个全新的、日常可接受的AI入口。其核心价值不在于功能的堆叠,而在于如何通过形态设计打破社交壁垒,成为用户“全天佩戴…...

【SpringBoot自动化部署】

SpringBoot自动化部署方法 使用Jenkins进行持续集成与部署 Jenkins是最常用的自动化部署工具之一&#xff0c;能够实现代码拉取、构建、测试和部署的全流程自动化。 配置Jenkins任务时&#xff0c;需要添加Git仓库地址和凭证&#xff0c;设置构建触发器&#xff08;如GitHub…...

MyBatis中关于缓存的理解

MyBatis缓存 MyBatis系统当中默认定义两级缓存&#xff1a;一级缓存、二级缓存 默认情况下&#xff0c;只有一级缓存开启&#xff08;sqlSession级别的缓存&#xff09;二级缓存需要手动开启配置&#xff0c;需要局域namespace级别的缓存 一级缓存&#xff08;本地缓存&#…...

LCTF液晶可调谐滤波器在多光谱相机捕捉无人机目标检测中的作用

中达瑞和自2005年成立以来&#xff0c;一直在光谱成像领域深度钻研和发展&#xff0c;始终致力于研发高性能、高可靠性的光谱成像相机&#xff0c;为科研院校提供更优的产品和服务。在《低空背景下无人机目标的光谱特征研究及目标检测应用》这篇论文中提到中达瑞和 LCTF 作为多…...

用鸿蒙HarmonyOS5实现中国象棋小游戏的过程

下面是一个基于鸿蒙OS (HarmonyOS) 的中国象棋小游戏的实现代码。这个实现使用Java语言和鸿蒙的Ability框架。 1. 项目结构 /src/main/java/com/example/chinesechess/├── MainAbilitySlice.java // 主界面逻辑├── ChessView.java // 游戏视图和逻辑├──…...

Kubernetes 节点自动伸缩(Cluster Autoscaler)原理与实践

在 Kubernetes 集群中&#xff0c;如何在保障应用高可用的同时有效地管理资源&#xff0c;一直是运维人员和开发者关注的重点。随着微服务架构的普及&#xff0c;集群内各个服务的负载波动日趋明显&#xff0c;传统的手动扩缩容方式已无法满足实时性和弹性需求。 Cluster Auto…...