Cesium 使用 Entity 绘制点线面

文章目录

    • 一、绘制点
      • 1. 第一种
      • 2. 第二种
    • 二、绘制面
    • 三、绘制线
    • 四、移除 Entity

<!--* @Author: HuKang* @Date: 2023-08-18 11:06:43* @LastEditTime: 2023-08-25 09:16:59* @LastEditors: HuKang* @Description: program-c* @FilePath: \global-data-display\src\views\program-c\index.vue
-->
<template><div><div id="cesiumContainer"></div></div>
</template><script setup lang="ts">
import * as Cesium from "cesium";
import { Viewer } from "cesium";
import cesium from "vite-plugin-cesium";
import { getSatellitecloudApi, getGenerateGridApi } from "@/api/servies";import { onMounted } from "vue";
import TOKEN from "@/utils/Tooken";/*** Cesium*/
// Token 设置
Cesium.Ion.defaultAccessToken = TOKEN;
}
// Viewer
const viewer = ref();
/*** 初始化函数*/
const initViewer = () => {viewer.value = new Cesium.Viewer("cesiumContainer", {infoBox: false,});// 去除版权信息viewer.value.cesiumWidget.creditContainer.style.display = "none";// 增加太阳光效果// viewer.value.scene.globe.enableLighting = true;// 控制视角不转到底下viewer.value.scene.globe.depthTestAgainstTerrain = true;// 增加瓦片-海图数据const imageryProvider = new Cesium.UrlTemplateImageryProvider({url: "cesium-api/map/getMap/{x}/{y}/{z}.png",credit: "mapname",tilingScheme: new Cesium.GeographicTilingScheme({ellipsoid: Cesium.Ellipsoid.WGS84,}),maximumLevel: 18,});viewer.value.scene.imageryLayers.addImageryProvider(imageryProvider);// 创建自己的数据集合
const datasource = new Cesium.CustomDataSource("")};
onMounted(() => {initViewer();
});
</script><style scoped></style>

一、绘制点

在这里插入图片描述

1. 第一种

var pointentity = viewer.value.entities.add({id: "point1",position: Cesium.Cartesian3.fromDegrees(109, 34),point: {pixelSize: 10,color: Cesium.Color.YELLOW, // 点的颜色outlineColor: Cesium.Color.RED, // 外边框颜色outlineWidth: 2,  // 外边框宽度},
});

2. 第二种

const pointentity2 = new Cesium.Entity({id: "point2",position: Cesium.Cartesian3.fromDegrees(109, 34),point: {pixelSize: 10,color: Cesium.Color.YELLOW,outlineColor: Cesium.Color.RED,outlineWidth: 2,},
});
viewer.value.entites.add(pointentity2)

二、绘制面

在这里插入图片描述

viewer.value.entities.add({id: 'polygontest',name: 'mian',polygon: {hierarchy: Cesium.Cartesian3.fromDegreesArray([109.080842, 45.002073,105.91517, 45.002073,104.058488, 44.996596,104.053011, 43.002989,104.053011, 41.003906,105.728954, 40.998429,107.919731, 41.003906,109.04798, 40.998429,111.047063, 40.998429,111.047063, 42.000709,111.047063, 44.476286,111.05254, 45.002073,109.080842, 45.002073]),height: 100,material: Cesium.Color.RED.withAlpha(0.5),outline: true,outlineColor: Cesium.Color.BLUE,outlineWidth: 1,fill: true}
});

三、绘制线

在这里插入图片描述

viewer.value.entities.add({id: 'polygontest',name: 'line',polygon: {positions: Cesium.Cartesian3.fromDegreesArray([109.080842, 45.002073,105.91517, 45.002073,104.058488, 44.996596,104.053011, 43.002989,104.053011, 41.003906,105.728954, 40.998429,107.919731, 41.003906,109.04798, 40.998429,111.047063, 40.998429,111.047063, 42.000709,111.047063, 44.476286,111.05254, 45.002073,109.080842, 45.002073]),width: 2,material: Cesium.Color.YELLOW,}
});

四、移除 Entity

var tempEntity = viewer.value.entites.getById("point1");
// 第一种移除
viewer.value.entities.remove(tempEntity);
// 第二种移除
viewer.value.entities.removeById("point1");

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/51634.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

第一讲使用IDEA创建Java工程——HelloWorld

一、前言导读 为了能够让初学者更快上手Java,不会像其他书籍或者视频一样,介绍一大堆历史背景,默认大家已经知道Java这么编程语言了。本专栏只会讲解干货,直接从HelloWord入手,慢慢由浅入深,讲个各个知识点,这些知识点也是目前工作中项目使用的,而不是讲一些老的知识点…

16、Flink 的table api与sql之连接外部系统: 读写外部系统的连接器和格式以及FileSystem示例(1)

Flink 系列文章 1、Flink 部署、概念介绍、source、transformation、sink使用示例、四大基石介绍和示例等系列综合文章链接 13、Flink 的table api与sql的基本概念、通用api介绍及入门示例 14、Flink 的table api与sql之数据类型: 内置数据类型以及它们的属性 15、Flink 的ta…

nvm安装使用教程

文章目录 下载配置安装最新稳定版 node安装指定版本查看版本切换版本删除版本 常见问题安装node后 显示拒绝访问的问题使用cnpm会报错的问题降低cnpm版本npm镜像 下载 NVM for Windows 下载地址&#xff1a;https://link.juejin.cn/?targethttps%3A%2F%2Fgithub.com%2Fcoreyb…

《深度学习计算机视觉 》书籍分享(包邮送书三本)

深度学习计算机视觉介绍 随着计算机技术的发展和进步&#xff0c;计算机视觉领域得到了广泛的关注和研究。而深度学习作为一种强大的机器学习方法&#xff0c;已经成为计算机视觉领域的重要工具之一。本文将介绍深度学习在计算机视觉中的应用和取得的成果。 深度学习是一种模…

Sim/circuit10

通过观察可知&#xff0c;在a、b同时为0或1时&#xff0c;state的值改变 state的值可以改变q的输出&#xff0c;1为ab的同或&#xff0c;0为异或 利用assign q进行输出 module top_module (input clk,input a,input b,output q,output state );always(posedge clk)if(a&…

基于JAVA SpringBoot和UniAPP的宠物服务预约小程序

随着社会的发展和人们生活水平的提高&#xff0c;特别是近年来&#xff0c;宠物快速进入人们的家中&#xff0c;成为人们生活中重要的娱乐内容之一&#xff0c;过去宠物只是贵族的娱乐&#xff0c;至今宠物在中国作为一种生活方式得到了广泛的认可&#xff0c;随着人们精神文明…

Docker拉取并配置Grafana

Linux下安装Docker请参考&#xff1a;Linux安装Docker 安装准备 新建挂载目录 /opt/grafana/data目录&#xff0c;准备用来挂载放置grafana的数据 /opt/grafana/plugins目录&#xff0c;准备用来放置grafana的插件 /opt/grafana/config目录&#xff0c;准备用来挂载放置graf…

正则表达式一小时学完

闯关式学习Regex 正则表达式&#xff0c;我感觉挺不错的&#xff0c;记录一下。 遇到不会的题&#xff0c;可以评论交流。 真的很不错 链接 Regex Learn - Step by step, from zero to advanced.

HTTP原理与实现

一、基本概念 一、基本原理* 1、全称&#xff1a; HyperText Transfer Protocol (超文本传输协议) 2、底层实现协议&#xff1a;建立在 TCP/IP 上的无状态连接。 3、基本作用&#xff1a;用于客户端与服务器之间的通信&#xff0c;规定客户端和服务器之间的通信格式。包括请…

长胜证券:货币政策什么意思?

钱银政策是指国家钱银当局经过调控钱银供给量和利率等手法&#xff0c;以到达操控通货膨胀、坚持经济稳定、促进经济增长等目的的一种宏观经济政策。简而言之&#xff0c;钱银政策便是国家中央银行对钱银供给和利率进行调控的政策。那么具体来说&#xff0c;钱银政策到底有哪些…

自动化部署及监测平台基本架构

声明 本文是学习 政务计算机终端核心配置规范. 而整理的学习笔记,分享出来希望更多人受益,如果存在侵权请及时联系我们 核心配置自动化部署及监测技术要求 自动化部署及监测平台基本架构 对于有一定规模的政务终端核心配置应用&#xff0c;需要配备自动化部署及监测平台&am…

Spring Boot简介

文章目录 一、引言1.1 初始化配置1.2 整合第三方框架1.3 后期维护1.4 部署工程1.5 敏捷式开发 二、SpringBoot介绍三、SpringBoot快速入门【重点】3.1 快速构建SpringBoot3.1.1 选择构建项目的类型3.1.2 项目的描述3.1.3 指定SpringBoot版本和需要的依赖3.1.4 导入依赖3.1.5 编…

RabbitMQ死信队列

RabbitMQ死信队列 1、过期时间TTL 过期时间TTL表示可以对消息设置预期的时间&#xff0c;在这个时间内都可以被消费者接收获取&#xff1b;过了之后消息将自动被 删除。RabbitMQ可以对消息和队列设置TTL&#xff0c;目前有两种方法可以设置&#xff1a; 第一种方法是通过队列…

【C语言】文件操作 -- 详解

一、什么是文件 磁盘上的文件是文件。 1、为什么要使用文件 举个例子&#xff0c;当我们想实现一个 “通讯录” 程序时&#xff0c;在通讯录中新建联系人、删除联系人等一系列操作&#xff0c;此时的数据存储于内存中&#xff0c;程序退出后所有数据都会随之消失。为了让通讯录…

第60步 深度学习图像识别:误判病例分析(Pytorch)

基于WIN10的64位系统演示 一、写在前面 上期内容基于Tensorflow环境做了误判病例分析&#xff08;传送门&#xff09;&#xff0c;考虑到不少模型在Tensorflow环境没有迁移学习的预训练模型&#xff0c;因此有必要在Pytorch环境也搞搞误判病例分析。 本期以SqueezeNet模型为…

窗口看门狗

从下往上看: 1. 时钟设置 RCC_APB1PeriphClockCmd(RCC_APB1Periph_WWDG,ENABLE);//使能独立看门狗时钟 WWDG_SetPrescaler(WWDG_Prescaler_8);//看门狗预分频器WWDG counter clock (PCLK1/4096)/8 2.设置窗口值 实际就是设置WWDG_CR的低七位值, 但是这个值要大于0x40(也就是…

【分享】小型园区组网场景

小型园区组网图 在小型园区中&#xff0c;S2700&S3700通常部署在网络的接入层&#xff0c;S5700&S6700通常部署在网络的核心&#xff0c;出口路由器一般选用AR系列路由器。 接入交换机与核心交换机通过Eth-Trunk组网保证可靠性。 每个部门业务划分到一个VLAN中&#…

Vulnhub: DriftingBlues: 2靶机

kali&#xff1a;192.168.111.111 靶机&#xff1a;192.168.111.207 信息收集 端口扫描 nmap -A -sC -v -sV -T5 -p- --scripthttp-enum 192.168.111.207 80端口的/blog目录为wordpress wpscan收集wordpress用户和爆破密码 wpscan --url http://driftingblues.box/blog -e…

非凸联合创始人李佐凡受邀出席复旦DSBA项目座谈会

8月17日&#xff0c;非凸科技联合创始人&CTO李佐凡受邀参加复旦管院数据科学与商业分析专业硕士&#xff08;DS&BA&#xff09;项目发展座谈会&#xff0c;与学校教授、老师在生源背景、课程教学、职业发展、学生培养和企业合作方面进行深入交流&#xff0c;旨在更好地…

【C++练习】普通方法+利用this 设置一个矩形类(Rectangle), 包含私有成员长(length)、 宽(width), 定义一下成员函数

题目 设置一个矩形类(Rectangle), 包含私有成员长(length)、 宽(width), 定义成员函数: void set_ len(int l); //设置长度 设置宽度void set_ wid(int w); 获取长度: int get len(); 获取宽度: int get _wid); 显示周长和面积: v…