Cesium Vue(七)— GEOJSON数据展示

1. GeoJSON

GeoJSON 是一种用于对各种地理数据结构进行编码的格式。

简而言之,GeoJSON为你提供了一种简单的格式来表示简单的地理特征以及它们的非空间属性。

结构:

{"type": "Feature","geometry": {"type": "Point","coordinates": [125.6, 10.1]},"properties": {"name": "Dinagat Islands"}
}

GeoJSON 对象可以定义以下内容:

  • 空间中的几何对象:例如,点、线串或多边形等。
  • 特征:特征是空间有界的实体。
  • 特征集合: 也称为 FeatureCollection

2. 加载GeoJSON

这里用到DataV.GeoAtlas地理小工具系选择中国地图 => JSON API

请添加图片描述

实现脚本

  // https://geo.datav.aliyun.com/areas_v3/bound/100000_full.json// 加载geojson数据let dataGeo = Cesium.GeoJsonDataSource.load("https://geo.datav.aliyun.com/areas_v3/bound/100000_full.json"// , //添加颜色修改   // {//   stroke: Cesium.Color.RED,//   fill: Cesium.Color.SKYBLUE.withAlpha(0.5),//   strokeWidth: 4,// });console.log(dataGeo);viewer.dataSources.add(dataGeo);

请添加图片描述

3. GEOJSON样式修改

  • 颜色修改
  let dataGeo = Cesium.GeoJsonDataSource.load("https://geo.datav.aliyun.com/areas_v3/bound/100000_full.json", //添加颜色修改   {stroke: Cesium.Color.RED,fill: Cesium.Color.SKYBLUE.withAlpha(0.5),strokeWidth: 4,});viewer.dataSources.add(dataGeo);
  • 形状修改
  dataGeo.then((dataSources) => {console.log(dataSources);viewer.dataSources.add(dataSources);let entities = dataSources.entities.values;entities.forEach((entity, i) => {entity.polygon.material = new Cesium.ColorMaterialProperty(Cesium.Color.fromRandom({alpha: 1,}));entity.polygon.outline = false;let randomNum = parseInt(Math.random() * 5);entity.polygon.extrudedHeight = 100000 * randomNum;});});

请添加图片描述

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

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

相关文章

uniapp——自定义组件插槽及使用

案例样式 自定义组件pageBox.vue <template><view><view class"bgColor" :style"{ height: bgHeight rpx }"></view><view class"main"><!-- 主要内容放这里 --><slot></slot></view>&…

C#WPF资源字典应用实例

本文实例演示C#WPF资源字典应用 目录 一、资源字典 二、实例 1新建一个资源字典 2添加到资源文件App.xaml

taro使用defineConstants定义全局变量eslint报错该变量不存在

问题描述 在taro项目中使用defineConstants定义一些全局变量供业务代码中进行使用&#xff0c;全局变量声明config/index.js代码如下&#xff1a; module.exports {defineConstants: {LOGIN_URL: JSON.stringify(/baidu/login), },全局变量使用代码如下&#xff1a; /*** 跳…

【开源分享】基于Html开发的房贷计算器,模仿新浪财经

房贷计算器是一种房贷计算的在线计算Web应用&#xff0c;按用户选择的贷款类型、贷款金额、期限、利率可计算得出每月月供参考、支付利息、还款总额这些信息。本文模仿新浪财经开发的房贷计算器。 作品预览 https://fangdai.gitapp.cn 源码地址 https://github.com/geeeeeee…

NFTScan 支持非 EVM 公链的 NFT Collection 的认证功能

截止到 2023 年 10 月份&#xff0c;NFTScan 已经支持了 18 条区块链网络&#xff0c;其中有 14 条 是 EVM 兼容的区块链网络&#xff1a; Ethereum、BNBChain、Polygon、zkSync、Base、Linea、Arbitrum、Optimism、Avalanche、Fantom、PlatON、Cronos、Gnosis、Moonbeam。 另…

Qt消息对话框的使用

本文介绍Qt消息对话框的使用。 QMessageBox类是Qt编程中常用到的一个类&#xff0c;主要用来进行一些简单的消息提示&#xff0c;比如&#xff1a;问题对话框&#xff0c;信息对话框等&#xff0c;这些对话框都属于QMessageBox类的静态方法&#xff0c;使用起来比较简单&#…

52单片机独立键盘控制数码管计数

前言 使用52单片机实现独立键盘控制数码管计数 代码 #include<reg52.h> #define uchar unsigned char #define uint unsigned intsbit key2 P3^4; sbit key3 P3^5; sbit key4 P3^6; sbit key5 P3^7;char code smg[] {0x3f,0x06,0x5b,0x4f,0x66,0x6d,0x7d,0x07,0x…

Linux性能优化--性能追踪3:系统级迟缓(prelink)

12.0 概述 本章包含的例子说明了如何用Linux性能工具寻找并修复影响整个系统而不是某个应用程序的性能问题。阅读本章后&#xff0c;你将能够&#xff1a; 追踪是哪一个进程导致了系统速度的降低。用strace调查一个不受CPU限制的进程的性能表现。用strace调查一个应用程序是如…

华为云Stack的学习(十)

十一、华为云Stack容器服务介绍 1.云容器引擎服务CCE 云容器引擎&#xff08;Cloud Container Engine&#xff0c;CCE&#xff09;提供高度可扩展的、高性能的企业级Kubernetes集群&#xff0c;支持运行Docker容器。借助云容器引擎&#xff0c;可以在云上轻松部署、管理和扩展…

java实现word转pdf

前两天写了一篇博客&#xff0c;讲的是word、ppt、pptx等文件转pdf&#xff0c;我研究文件转化也是因为工作需要&#xff0c;后来发现写的功能在我本地(window 10)没有问题&#xff0c;但是发到现场(Linux)word转pdf转化出来时0k&#xff0c;没办法只能再换一种方式&#xff0c…

element-plus 表格-自定义样式实现2

<template><h2>表格修改样式利用属性修改</h2><h3>row-style 行样式</h3><h3>row-style header-row-style 不能改背景色</h3><h3>cell-style header-cell-style能改背景色</h3><el-tableref"tableRef":dat…

低调而无为而治,藏在超级应用背后的道家哲学

众所周知&#xff0c;Elon Musk 想将 Twitter 重新设计定位成一款“超级应用 - X”的野心已经不再是秘密。伴随着应用商店中 Twitter 标志性的蓝鸟 Logo 被 X 取代后&#xff0c;赛博世界充满了对这件事情各种角度的探讨与分析。 Musk 曾经无数次通过微信这一样本来推广他的“超…

【广州华锐互动】利用VR开展建筑塔吊安全操作学习的好处?

随着科技的不断发展&#xff0c;虚拟现实&#xff08;VR&#xff09;技术已经逐渐渗透到各个领域&#xff0c;为人们的生活带来了前所未有的便利。在工程教育领域&#xff0c;VR建筑塔吊安全操作学习作为一种新型的教学手段&#xff0c;正逐渐成为提高教学质量和培养高素质工程…

mysql 启动报错 Can t change dir to xxx, No such file or directory 配置错误或挂载导致

省流&#xff1a; 挂载的话&#xff0c;使用 /etc/fstab 正文&#xff1a; 在企业中&#xff0c;服务器重启&#xff0c;有时候会遇到mysql 启动报错 Cant change dir to xxx, No such file or directory。大致意思是无法将目录换成xxx&#xff0c;因为没有这个目录。 原因…

electron学习笔记

electron&#xff1a;大前端背景下&#xff0c;用node.js做桌面端app的工具 1、安装&#xff1a;npm i electron 实际上是chromium Node.js 2、创建一个窗口 3、主进程&#xff08;操作硬件等&#xff0c;commonJS&#xff09;与渲染进程&#xff08;渲染页面&#xff0c;E…

2023年中国OK镜市场发展前景分析:OK镜市场发展空间潜力巨大[图]

角膜接触镜是戴在眼角膜上的特殊镜片。角膜接触镜分为硬镜和软镜&#xff0c;软镜即大众常见的“隐形眼镜”&#xff1b;硬镜材质较硬&#xff0c;舒适度略低于软镜&#xff0c;硬镜主要分为OK镜、硬性角膜接触镜和巩膜镜三类。 角膜接触镜分类 资料来源&#xff1a;共研产业咨…

Spring篇---第六篇

系列文章目录 文章目录 系列文章目录一、Spring 框架中的单例 Bean 是线程安全的么?二、Spring 是怎么解决循环依赖的?三、说说事务的隔离级别一、Spring 框架中的单例 Bean 是线程安全的么? Spring 框架并没有对单例 Bean 进行任何多线程的封装处理。 关于单例 Bean 的线程…

分布式和微服务

问题分析&#xff1a; 简单来说&#xff0c;分布式是一组通过网络进行通信&#xff0c;并且为了完成共同的计算任务的计算机节点组 成的系统。 分布式系统的设计理念&#xff0c;其实是来自于小型机或者大型机的计算能力的瓶颈和成本的 增加。 在集中式系统里面&#xff0c;要…

【C++】C++中那些有点意思,但一般也用不到的替代运算符

所谓替代运算符无非就是用其他字符或者符号代表一些预定义的运算符和符号 有如下代码 int main(int x, char**) { }如果用替代用算符表示的话 int main(int x, char**) <% %>就是这样&#xff0c;花括号可以替换成了为<% %>,无非就是换了一个表示方法 在C到…

数字时代的探索与革新:Socks5代理的引领作用

在当今快速发展的数字时代&#xff0c;技术创新推动着社会的变革与进步。Socks5代理作为一项重要的网络技术&#xff0c;正引领着跨界电商、爬虫数据分析、企业全球化和游戏体验优化等领域的发展。本文将深入探讨Socks5代理技术在这些领域中的引领作用&#xff0c;以及它如何塑…