使用Mars3d的XyzLayer,通过zIndex使得图层叠加在最上面

news2025/1/16 4:42:38

问题:XyzLayer的温度图设置了zIndex: 999,之后,依然会被后加入的电子地图覆盖

// 叠加的图层
let tileLayer
let tileLayer1

export function addTileLayer() {
removeTileLayer()

// 方式2:在创建地球后调用addLayer添加图层(直接new对应type类型的图层类)
tileLayer = new mars3d.layer.XyzLayer({
url: "//data.mars3d.cn/tile/dizhiChina/{z}/{x}/{y}.png",
minimumLevel: 0,
maximumLevel: 10,
rectangle: { xmin: 69.706929, xmax: 136.560941, ymin: 15.831038, ymax: 52.558005 },
opacity: 0.7,
center: { lat: 22.43392, lng: 113.23887, alt: 8157553, heading: 354, pitch: -82 },
hasZIndex: true,
zIndex: 999,
flyTo: true
})
tileLayer1 = new mars3d.layer.XyzLayer({
name: "电子地图",
icon: "img/basemaps/google_vec.png",
type: "xyz",
url: "https://webrd0{s}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",
subdomains: "1234",
chinaCRS: mars3d.ChinaCRS.GCJ02

})

map.addLayer(tileLayer)
map.addLayer(tileLayer1)

问题在于:zIndex控制图层的叠加层次,默认按加载的顺序进行叠加,但也可以自定义叠加顺序,数字大的在上面(只对同类型图层间有效)。除了配置tileLayer的zIndex,还需要配置tileLayer1的zIndex。
修改后的代码如下,可以生效,温度图叠加在电子地图的上面

// 叠加的图层
let tileLayer
let tileLayer1

export function addTileLayer() {
removeTileLayer()

// 方式2:在创建地球后调用addLayer添加图层(直接new对应type类型的图层类)
tileLayer = new mars3d.layer.XyzLayer({
url: "//data.mars3d.cn/tile/dizhiChina/{z}/{x}/{y}.png",
minimumLevel: 0,
maximumLevel: 10,
rectangle: { xmin: 69.706929, xmax: 136.560941, ymin: 15.831038, ymax: 52.558005 },
opacity: 0.7,
center: { lat: 22.43392, lng: 113.23887, alt: 8157553, heading: 354, pitch: -82 },
hasZIndex: true,
zIndex: 999,
flyTo: true
})
tileLayer1 = new mars3d.layer.XyzLayer({
name: "电子地图",
icon: "img/basemaps/google_vec.png",
type: "xyz",
url: "https://webrd0{s}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",
subdomains: "1234",
hasZIndex: true,
zIndex: 1,
chinaCRS: mars3d.ChinaCRS.GCJ02

})

map.addLayer(tileLayer)
map.addLayer(tileLayer1)

相关的示例链接:

功能示例(Vue版) | Mars3D三维可视化平台 | 火星科技

api文档:

XyzLayer - V3.6.4 - Mars3D API文档

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

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

相关文章

C++11——右值引用和移动语义

✅<1>主页&#xff1a;&#xff1a;我的代码爱吃辣 &#x1f4c3;<2>知识讲解&#xff1a;C11——右值引用 ☂️<3>开发环境&#xff1a;Visual Studio 2022 &#x1f4ac;<4>前言&#xff1a;右值引用&#xff0c;是C11更新的一个非常有价值的语法&am…

kali虚拟机

kali网络配置 虚拟网络编辑器配置 打开虚拟网络编辑器&#xff0c;用管理员权限打开 打开后 VMnet0采用桥接模式&#xff0c;外部连接这边选择自己桥接的对象 控制面板可查看桥接对象 VMnet8这边选择NAT模式 VMnet1选择主机模式 因为要用到两个网卡&#xff0c; 所以我们在…

流程制造智能工厂总体架构及建设路线规划方案PPT

本资料来源公开网络&#xff0c;仅供个人学习&#xff0c;请勿商用&#xff0c;如有侵权请联系删除&#xff0c;更多浏览公众号&#xff1a;智慧方案文库 数字孪生智能制造(智改数转)数字化架构设计及应用..水泥智能工厂解决方案.pptx智慧制造规划设计解决方案.pptx智能工厂落…

Day52|动态规划part13:300.最长递增子序列、674. 最长连续递增序列

300. 最长递增子序列 leetcode链接&#xff1a;力扣题目链接 视频链接&#xff1a;动态规划之子序列问题&#xff0c;元素不连续&#xff01;| LeetCode&#xff1a;300.最长递增子序列 给你一个整数数组 nums &#xff0c;找到其中最长严格递增子序列的长度。子序列 是由数…

Docker资源控制cgroups

文章目录 一、docker资源控制1、资源控制工具2、Cgroups四大功能 二、CPU 资源控制1、设置CPU使用率上限2、CPU压力测试3、Cgroups限制cpu使用率4、设置CPU资源占用比&#xff08;设置多个容器时才有效&#xff09;5、设置容器绑定指定的CPU 三、对内存使用的限制四、对磁盘IO配…

【C++】—— c++11之智能指针

前言&#xff1a; 本期&#xff0c;我们将要学习的是在c11中新提出的概念——异常指针&#xff01; 目录 &#xff08;一&#xff09;智能指针的引入 &#xff08;二&#xff09;内存泄漏 1、什么是内存泄漏&#xff0c;内存泄漏的危害 2、内存泄漏分类&#xff08;了解&a…

访问0xdddddddd内存地址引发软件崩溃的问题排查

目录 1、问题描述 2、访问空指针或者野指针 3、常见的异常值 4、0xdddddddd内存访问违例问题分析与排查 5、关于0xcdcdcdcd和0xfeeefeee异常值的排查案例 6、最后 VC常用功能开发汇总&#xff08;专栏文章列表&#xff0c;欢迎订阅&#xff0c;持续更新...&#xff09;ht…

循环购模式:美妆行业的新趋势

美妆是一种能够提升自信和魅力的艺术&#xff0c;它让每个人都可以展现自己的个性和风格。但是&#xff0c;美妆也是一种需要不断更新和学习的技能&#xff0c;它需要消费者投入时间和金钱&#xff0c;才能找到适合自己的产品和方法。有没有一种方式&#xff0c;可以让美妆变得…

用python画一个柱状图可能用到的代码【完整版】

画柱状图 导入包 import torch as t import numpy as np import pandas as pd import matplotlib.pyplot as plt import joblib import matplotlib as mpl设置默认字体格式为"Times New Roman" font_name Times New Roman mpl.rcParams[font.family] font_name通…

stable diffusion实践操作-提示词插件安装与使用

本文专门开一节写提示词相关的内容&#xff0c;在看之前&#xff0c;可以同步关注&#xff1a; stable diffusion实践操作 正文 1、提示词插件安装 1.1、 安装 1.2 加载【应用更改并重载前端】 1.3 界面展示 1.3.-4 使用 里面有个收藏列表&#xff0c;可以收藏以前的所有提示…

STM32f103入门(7)pwm驱动led驱动舵机驱动直流电机

PWM驱动 PWM介绍TIM_OC1Init 配置通道TIM_OCStructInit 输出比较参数默认值输出比较模式 TIM_OCInitstructure输出比较极性 TIM_OCInitstructure设置输出使能以下三个决定了PWM的频率 占空比初始化通道 TIM_OC1Init(TIM2, &TIM_OCInitstructure);GPIO复用 PWM通道 驱动LED复…

2022年09月 C/C++(五级)真题解析#中国电子学会#全国青少年软件编程等级考试

第1题&#xff1a;城堡问题 1 2 3 4 5 6 7 ############################# 1 # | # | # | | # #####—#####—#—#####—# 2 # # | # # # # # #—#####—#####—#####—# 3 # | | # # # # # #—#########—#####—#—# 4 # # | | | | # # ############################# (图 1)…

关于git约定式提交IDEA

背景 因为git提交的消息不规范导致被乱喷&#xff0c;所以领导统一规定了约定式提交 官话 约定式提交官网地址 约定式提交规范是一种基于提交信息的轻量级约定。 它提供了一组简单规则来创建清晰的提交历史&#xff1b; 这更有利于编写自动化工具。 通过在提交信息中描述功能…

【算法】递归的概念、基本思想

创作不易&#xff0c;本篇文章如果帮助到了你&#xff0c;还请点赞 关注支持一下♡>&#x16966;<)!! 主页专栏有更多知识&#xff0c;如有疑问欢迎大家指正讨论&#xff0c;共同进步&#xff01; &#x1f525;c系列专栏&#xff1a;C/C零基础到精通 &#x1f525; 给大…

LuatOS 开发指南

NDK 开发 官方教程 官方例程 API 下载软件 下载官方NDK例程压缩包到本地&#xff0c;并解压。可以看到目录如下&#xff1a; doc: 文档教程 env: 编译环境 example: NDK示例 platform: 需要编译的平台&#xff08;air72x/air8xx&#xff09; tools: 其他辅助软件 VSCode 使…

问道管理:成交量买卖公式?

跟着股票商场的如火如荼&#xff0c;人们对于怎么解读和使用成交量进行股票生意的需求日积月累。成交量是指在某一特定时间内进行的股票生意的数量&#xff0c;它是投资者们研判商场状况和制定生意战略的重要指标之一。那么&#xff0c;是否存在一种最厉害的成交量生意公式呢&a…

day31 集合

一、Collection 创建对象 Collection c3 new HashSet(); //元素不可重复 无序 Collection c1 new ArrayList(); //元素可重复 有序collection方法 c.add() 添加引用类型数据 c.addAll() 添加collection对象 c.isEmpty() 判断是否为空 c.clear() 清空所有类容 c.…

深入了解Docker镜像操作

Docker是一种流行的容器化平台&#xff0c;它允许开发者将应用程序及其依赖项打包成容器&#xff0c;以便在不同环境中轻松部署和运行。在Docker中&#xff0c;镜像是构建容器的基础&#xff0c;有些家人们可能在服务器上对docker镜像的操作命令不是很熟悉&#xff0c;本文将深…

xx音乐app逆向分析

目标 看一下评论的请求 抓包 这里使用httpcanary 请求包如下 POST /index.php?rcommentsv2/getCommentWithLike&codeca53b96fe5a1d9c22d71c8f522ef7c4f&childrenidcollection_3_1069003079_330_0&kugouid1959585341&ver10&clienttoken7123ecc548ec46d…

frida动态调试入门02——hook加密函数

说明 frida是一款Python工具可以方便对内存进行hook修改代码逻辑在移动端安全和逆向过程中常用到。 前置知识 frida动态调试入门01——定位关键代码 https://blog.csdn.net/qq_41690468/article/details/132607065 定位函数 关键函数 String code RequestUtil.paraMap(ad…