Mars3d插件参考开发教程并在相关页面引入

news2024/12/23 14:17:54

问题场景:

1.在使用Mars3d热力图功能时,提示mars3d.layer.HeatLayer is not a constructor

问题原因:

1.mars3d的热力图插件mars3d-heatmap没有安装引用。

解决方案:

1.参考开发教程,找到相关的插件库:Mars3D 三维可视化平台 | 火星科技 | 地图开发

插件库有以下不同类型:

mars3d-space                           space卫星插件
mars3d-heatmap                        heatmap热力图插件
mars3d-echarts                        echarts可视化插件
mars3d-mapv                         mapv可视化插件
mars3d-wind                         wind风场插件
mars3d-supermap                 超图服务插件
mars3d-tdt                                 天地图三维地名和地形服务插件
mars3d-widget                         原生js下的widget模块化插件
 

2.找到插件库的安装介绍:Mars3D 三维可视化平台 | 火星科技 | 地图开发

有不同的安装方式,此处只介绍npm安装引用的方式

开发教程中npm 安装了卫星插件库,但是我们需要安装引入的是热力图的插件库。因此需要修改原口令为热力图的插件库的安装口令

卫星插件库的安装口令:

npm install mars3d-space --save

修改为热力图的插件库的安装口令:

npm install mars3d-heatmap @mars3d/heatmap.js --save

执行npm安装后,在相关的页面进行引用该插件即可。

开发教程中的引用口令同理需要修改,将卫星插件的引用代码修改为热力图插件的引用代码

卫星插件的引用代码:

//导入mars3d插件(按需使用,需要先npm install)
import "mars3d-space";

热力图插件的引用代码:

//导入mars3d插件(按需使用,需要先npm install)
import "mars3d-heatmap";

如此,既可以在自己的项目中使用相关插件了。

npm安装的话:参考以下步骤

mars3d-heatmap - npm

注意点:

1.不同插件的安装口令和引用代码不同,需要按需修改。根据api文档提示安装对应的插件

api文档地址:Mars3D三维可视化平台 | 火星科技

2.安装相关插件库的时候,可能有奇奇怪怪的报错,此时可能是这个依赖的第三方原本的插件库没有的原因,可以尝试以下口令:

npm install mars3d-echarts echarts --save

同理,该口令也是需要按照项目的具体使用场景修改的。

3.mars3d还存在单独的依赖文件需要引入使用的类,例如CanvasBillboard这个类。

单独的依赖文件就可以在示例中保存,本地引入使用。

const graphic = new mars3d.graphic.CanvasBillboard()

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

4.使用过程中还需要查看插件与mars3d主库的版本保持一致,例如在packsge.json文件中查看主库跟插件的的相关版本,需要将该版本号保持一致。

mars3d的版本与cesium版本对应关系可见开发教程说明:Mars3D 三维可视化平台 | 火星科技 | 地图开发

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

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

相关文章

【LeetCode-简答题】242. 有效的字母异位词

文章目录 题目方法一&#xff1a;数组存放&#xff1a;方法二&#xff1a;哈希存放 题目 方法一&#xff1a;数组存放&#xff1a; class Solution {public boolean isAnagram(String s, String t) {int[] s1 new int[26];int[] t1 new int[26];for(int i 0; i< s.lengt…

【LeetCode-简单题】350. 两个数组的交集 II

文章目录 题目方法一&#xff1a;哈希表方法二&#xff1a;双指针 题目 方法一&#xff1a;哈希表 用哈希表记录第一个数组的每个数和每个数的出现次数再遍历第二个数组&#xff0c;如果哈希表中有这个数&#xff0c;并且次数还不为0&#xff0c;说明是交集元素&#xff0c;加…

RocketMQ实践与原理分析(Docker安装RocketMQ)

前言 QBM之前使用的消息中间件是ActiveMQ&#xff0c;后续需要升级为RocketMQ。 MQ广泛应用于很多业务场景中&#xff0c;主要的作用 异步解耦削峰… 常用MQ中间件对比&#xff0c;参考官方文档&#xff1a;https://rocketmq.apache.org/zh/docs/4.x/introduction/03whatis…

Android查看公钥与MD5

参考&#xff1a;填写App特征信息_备案-阿里云帮助中心 安卓应用获取App特征信息指导 包名、公钥和签名MD5获取方式有多种&#xff0c;本文以使用JadxGUI工具获取为例。 下载JadxGUI工具&#xff1a;GitHub - skylot/jadx: Dex to Java decompiler下载安装完成后&#xff0c;使…

饲料添加剂 微生物 屎肠球菌

声明 本文是学习GB 7300.503-2023 饲料添加剂 第5部分&#xff1a;微生物 屎肠球菌. 而整理的学习笔记,分享出来希望更多人受益,如果存在侵权请及时联系我们 1 范围 本文件规定了饲料添加剂屎肠球菌的技术要求、采样、检验规则、标签、包装、运输、贮存和保质 期&#xff0…

Routing路径系列数学建模(TSP+CVRP)

1.Traveling Salesperson Problem(TSP) 参考&#xff1a;维基百科TSP 给定一些城市和城市之间的距离&#xff0c;找到最短路径&#xff0c;经过每个城市最后返回起点&#xff0c;组合优化问题中属于NP-hard难度。对于TSP问题有两类混合整数规划模型&#xff1a;Miller–Tucker…

PYTHON-模拟练习题目集合

&#x1f308;write in front&#x1f308; &#x1f9f8;大家好&#xff0c;我是Aileen&#x1f9f8;.希望你看完之后&#xff0c;能对你有所帮助&#xff0c;不足请指正&#xff01;共同学习交流. &#x1f194;本文由Aileen_0v0&#x1f9f8; 原创 CSDN首发&#x1f412; 如…

QScrollBar滚动条、QSlider滑块、 QDial表盘

QAbstractSlider 类、 QSCrollBar 类、 QSlider 类 一、 基本原理 1、 QAbstractSlider 继承自 QWidget&#xff0c;该类主要用于提供一个范围内的整数值&#xff0c; 2、 QAbstractSlider 类是 QScrollBar 类(滚动条)、 QSlider 类(滑块)、 QDial 类(表盘)的父类&#xff0c;因…

智能公厕大脑,提高城市公共厕所管理效率!

随着城市建设的不断发展&#xff0c;公共设施的完善也成为人们关注的重要问题之一。而城市公共厕所作为城市治理的一部分&#xff0c;管理效率和运营成本则直接关系到城市环境整体卫生和市民的生活质量。如何提高城市公共厕所管理能力和服务水平&#xff0c;成为城市治理和市民…

MQ的初步了解

目录 什么是MQ&#xff1f; 为什么要用MQ&#xff08;MQ的优点&#xff09;&#xff1f; MQ的缺点 常用的MQ产品 MQ使用中的常见问题 什么是MQ&#xff1f; 【1】MQ&#xff1a;MessageQueue&#xff0c;消息队列。 队列&#xff0c;是一种FIFO 先进先出的数据结构。消息由…

28335 GPIO作为输入的配置记录

28335 GPIO配置为输入&#xff0c;可以启动输入滤波功能&#xff0c;看了网上很多的讲解&#xff0c;把滤波配置记录一下&#xff1a; 主要是配置两个参数&#xff1a; GpioCtrlRegs.GPXCTRL.bit.QUALPRDX &#xff1a;用于配置采样的周期&#xff0c;由配置值和SYSCLKOUT共同…

Java面试题之——异常和错误

提示&#xff1a;解释Java中的异常和错误是什么&#xff0c;以及它们之间的区别是什么&#xff1f; 文章目录 前言从定义上来说&#xff1a;从处理方式来看&#xff1a;总结⭐️ 好书推荐 前言 提示&#xff1a;这里可以添加本文要记录的大概内容&#xff1a; 在Java编程语言…

PostgreSQL 如果想知道表中某个条件查询条件在索引中效率 ?

开头还是介绍一下群&#xff0c;如果感兴趣PolarDB ,MongoDB ,MySQL ,PostgreSQL ,SQL Server,Redis &#xff0c;Oracle ,Oceanbase 等有问题&#xff0c;有需求都可以加群群内有各大数据库行业大咖&#xff0c;CTO&#xff0c;可以解决你的问题。加群请加微信号 liuaustin3 &…

NSS [HNCTF 2022 Week1]Challenge__rce

NSS [HNCTF 2022 Week1]Challenge__rce hint:灵感来源于ctfshow吃瓜杯Y4大佬的题 开题&#xff0c;界面没东西&#xff0c;源码里面有注释&#xff0c;GET传参?hint 传参后返回了源码 <?php error_reporting(0); if (isset($_GET[hint])) {highlight_file(__FILE__); }…

如何判断linux 文件(或lib)是由uclibc还是glibc编译出来的?

工作中使用的编译环境有2套编译器&#xff0c;一个是glibc&#xff0c;一个是uclibc。 有些项目使用的glibc编译的lib&#xff0c;和使用uclibc编译的工程&#xff0c;在一起就会出现reference的编译错误如下&#xff1a; 那和如何来判断一个文件是由哪个编译器编译的呢&#…

苹果cms大橙子vfed 5.0去授权完美破解主题模板

大橙模版算是在苹果 cms 众多主题里&#xff0c;较为亮眼的一款了&#xff0c;主题简洁&#xff0c;功能众多&#xff0c;非常的齐全。 今天分享的就是大橙 5.0 版本模板&#xff0c;自定义菜单输入下列代码使用主题设置和资源采集。 vfed 主题设置&#xff0c;/index.php/la…

MiniApp Dev 6

商城、会员、积分

通过 API 使用 React

&#x1f3ac; 岸边的风&#xff1a;个人主页 &#x1f525; 个人专栏 :《 VUE 》 《 javaScript 》 ⛺️ 生活的理想&#xff0c;就是为了理想的生活 ! 若使用相同的 Hello World! 应用 &#xff08;通过 React 生成并通过 Visual Studio Code 更新的应用&#xff09;&#x…

微信小程序开发--4.3订阅消息

首先在微信公众平台登录相应的微信小程序&#xff0c;左侧导航栏找到功能&#xff0c;点进去订阅消息&#xff0c;点击开通&#xff0c;点击选用&#xff0c;在公共模板库中选用订阅消息的模板。 js wx.requestSubscribeMessage({tmplIds:[aDRNef2_ty37dXyqVXyUADSyO8BXOZRWYi…

手撕双链表

> 作者简介&#xff1a;დ旧言~&#xff0c;目前大一&#xff0c;现在学习Java&#xff0c;c&#xff0c;c&#xff0c;Python等 > 座右铭&#xff1a;松树千年终是朽&#xff0c;槿花一日自为荣。 > 望小伙伴们点赞&#x1f44d;收藏✨加关注哟&#x1f495;&#x1…