若依框架使用mars3d的环境配置,地球构建

因项目需要,原本使用过的cesium依赖,现在想使用火星科技mars3d的一些功能,所以需要引入mars3d依赖,整个过程非常的坎坷,以至于我都不知道到底是哪些部分是标准的。。。先把我认为对的记录一下:

1.vue.config.js

在这过程中安装了两个依赖:path-browserifycopy-webpack-plugin

// 配置火星科技
const webpack = require('webpack')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const cesiumSourcePath = 'node_modules/mars3d-cesium/Build/Cesium/' // cesium库安装目录
const cesiumRunPath = './mars3d-cesium/' // cesium运行时路径

configureWebpack: (config) => {
        let plugins = [
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSourcePath, 'Workers'), to: path.join(config.output.path, cesiumRunPath, 'Workers') }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSourcePath, 'Assets'), to: path.join(config.output.path, cesiumRunPath, 'Assets') }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSourcePath, 'ThirdParty'), to: path.join(config.output.path, cesiumRunPath, 'ThirdParty') }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSourcePath, 'Widgets'), to: path.join(config.output.path, cesiumRunPath, 'Widgets') }] }),
            // 配置火星科技
            new webpack.DefinePlugin({
                CESIUM_BASE_URL: JSON.stringify(path.join(config.output.publicPath, cesiumRunPath))
            }),
        ]
        return {
            name: name,
            resolve: {
                alias: {
                    '@': resolve('src')
                },
                fallback: {
                    path: require.resolve('path-browserify'),
                }
            },
            module: { unknownContextCritical: false }, // 配置加载的模块类型,cesium时必须配置// 配置火星科技
            plugins: plugins,
        }
    },

2.在原本所有用到cesium,引入了cesium依赖的js文件中,替换依赖,我把cesium依赖卸载了,现在有关地球的都是用的火星科技中提供的依赖

import * as Cesium from ‘cesium’ ;

 修改为

import { Cesium } from "mars3d";

3.在要加载地球的vue文件中

// 引入火星科技cesium资源
import * as Cesium from "mars3d-cesium";
import * as mars3d from "mars3d";
import "mars3d/dist/mars3d.css";
import "mars3d-cesium/Build/Cesium/Widgets/widgets.css";

var map;
var viewer;
methods:{
   initGlobal(){
     map = new mars3d.Map("cesiumContainer", { ...data.map3d });
     // 这里是我们之前使用cesium的时候会使用的viewer
     // 如果之前封装了好多工具方法,这里复制以后照旧用,原来的工具代码不需要修改
     viewer=map.viewer;
      });
   }
}

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【Java】SpringAOP —— AOP是什么? 代码实现了SpringAOP

文章目录 一、AOP是什么二、AOP的组成三、SpringAOP四、实现SpringAOP1.添加AOP框架支持2.定义切面切点3.定义相关通知 总结 一、AOP是什么 AOP(Aspect Oriented Programming):面向切面编程,它是⼀种思想,它是对某一类…

JVM 第四部分—垃圾回收相关概念 2

System.gc() 在默认情况下,通过System.gc()或者Runtime.getRuntime().gc()的调用,会显式触发Full GC,同时对老年代和新生代进行回收,尝试释放被丢弃对象占用的内存 然而System.gc()调用附带一个免责声明,无法保证对垃…

基于Camunda实现bpmn 2.0各种类型的任务

基于Camunda实现bpmn中各种类型任务 ​ Camunda Modeler -为流程设置器(建模工具),用来构建我们的流程模型。Camunda Modeler流程绘图工具,支持三种协议类型流程文件分别为:BPMN、DMN、Form。 ​ Camunda Modeler下载…

【Python】进阶学习:pandas--isin()用法详解

【Python】进阶学习:pandas–isin()用法详解 🌈 个人主页:高斯小哥 🔥 高质量专栏:Matplotlib之旅:零基础精通数据可视化、Python基础【高质量合集】、PyTorch零基础入门教程👈 希望得到您的订阅…

【java】20:枚举

枚举的二种实现方式 1) 自定义类实现枚举 2) 使用 enum 关键字实现枚举 自定义实现枚举: 1.不需要提供setXxx方法,因为枚举对象值通常为只读. 2.对枚举对象/属性使用final static共同修饰,实现底层优化. 3.枚举对象名通常使用全部大写&…

电子电气架构——汽车以太网诊断路由汇总

电子电气架构——汽车以太网诊断路由汇总 我是穿拖鞋的汉子,魔都中坚持长期主义的工程师。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 人们会在生活中不断攻击你。他们的主要武器是向你灌输对自己的怀疑:你的价值、你的能力、你的潜力。他们往往会将…

江科大stm32学习笔记——【4-1】OLED

一.原理 1.调试方式 串口调试:通过串口通信,将调试信息发送到电脑端,电脑使用串口助手显示调试信息。 显示屏调试:直接将显示屏连接到单片机,将调试信息打印在显示屏上。 Keil调试模式:借助Keil软件的调…

深入sizeof与strlen

一、sizeof与strlen的对比 sizeofstrlensizeof是单目操作符strlen是库函数,使用需要包含头文件string.hsizeof计算操作数所占用的内存,单位是字节strlen是求字符串长度,统计的是\0之前字符的个数不关注内存中存放什么数据 关注内存总是否有\0…

关于 HTTP 协议,你了解多少

HTTP协议 FastAPI 是建立在 HTTP 协议之上,所以为了更好的掌握 FastAPI。我们需要先简单的了解一下 HTTP协议 简介 HTTP(Hypertext Transfer Protocol)遵循经典的客户端-服务器模型,客户端打开连接以发出请求,然后等…

Linux内核队列queue.h

文章目录 一、简介二、SLIST单向无尾链表2.1 介绍2.2 操作2.3 例子 三、STAILQ单向有尾链表四、LIST双向无尾链表五、TAILQ双向有尾链表六、CIRCLEQ循环链表七、queue源码参考 一、简介 queue.h是一个非常经典的文件,定义了一系列宏的操作,它定义了一系…

复盘昨天的内容

vue调节css 后端做业务处理 1.分类管理 GetMapping("/queryCtc")public ApiResult queryCtc(){return ctcService.queryCtc();}/*** 修改类目信息* return*/PutMapping("/updateCtc")public ApiResult updateCtc(RequestBody ShopCtc shopCtc){return c…

element-plus 的el-img组件访问oss图片自动拼接前端地址

这是我的组件代码 <el-image style"width: 100px; height: 100px" :src"scope.row.logo" />访问时候 竟然凭借上了前端的地址端口 原来是我的oss服务是使用了域名做cdn加速的 内容分发网络&#xff08;CDN&#xff09;或者服务器配置&#xff0c;可…

2.1 mov、add和sub加减指令实操体验

汇编语言 1. mov操作 1.1 mov移动值 mov指令把右边的值移动到左边 mount c d:masm c: debug r ax 0034 r 073f:0100 mov ax,7t1.2 mov移动寄存器的值 把右边寄存器的值赋值给左边的寄存器 a 073f:0105 mov bx,axt1.3 mov高八位&#xff08;high&#xff09;和低八位&am…

【leetcode】用栈实现队列

大家好&#xff0c;我是苏貝&#xff0c;本篇博客带大家刷题&#xff0c;如果你觉得我写的还不错的话&#xff0c;可以给我一个赞&#x1f44d;吗&#xff0c;感谢❤️ 点击查看题目 思路: 在做此题之前&#xff0c;我们先要实现栈&#xff0c;这在上个博客中已经写过&#xf…

Topaz Gigapixel AI:让每一张照片都焕发新生mac/win版

Topaz Gigapixel AI 是一款革命性的图像增强软件&#xff0c;它利用先进的人工智能技术&#xff0c;能够显著提升图像的分辨率和质量。无论是摄影爱好者还是专业摄影师&#xff0c;这款软件都能帮助他们将模糊的、低分辨率的照片转化为清晰、细腻的高分辨率图像。 Topaz Gigap…

2024腾讯云优惠券领取和使用方法,北漂程序员整理

腾讯云代金券领取渠道有哪些&#xff1f;腾讯云官网可以领取、官方媒体账号可以领取代金券、完成任务可以领取代金券&#xff0c;大家也可以在腾讯云百科蹲守代金券&#xff0c;因为腾讯云代金券领取渠道比较分散&#xff0c;腾讯云百科txybk.com专注汇总优惠代金券领取页面&am…

工会管理系统:繁琐工作,一套系统全搞定

hello&#xff0c;我是贝格前端工场&#xff0c;之前给大家介绍了各类通用的B端管理系统&#xff0c;受到了大家的欢迎。本次开始介绍针对具体行业的管理系统该如何设计和开发&#xff0c;欢迎大家持续关注、点赞&#xff0c;如有系统定制需求可以私信我们。 一、工会管理系统…

红外电力设施检测数据集

需要的同学私信联系&#xff0c;推荐关注上面图片右下角的订阅号平台 自取下载。 红外检测技术目标检测准确、速度快、涵盖面积广&#xff0c;可以在不停电、不接触、不解体、不采样的状态下&#xff0c;对带电设备的状态进行检测和诊断&#xff0c;精确查找出设备的劣化程度、…

蓝桥杯Java B组历年真题(2013年-2021年)

一、2013年真题 1、世纪末的星期 使用日期类判断就行&#xff0c;这里使用LocalDate&#xff0c;也可以使用Calendar类 答案 2099 使用LocalDate import java.time.LocalDate; import java.time.format.DateTimeFormatter; // 1:无需package // 2: 类名必须Main, 不可修改p…

【c++】VS2022静态库断点 “The breakpoint will not currently be hit. “

调试vs c++项目 :断点没符号加载 单独给使用的部分webrtc的源码构建了一个vs的静态库,给dll 用, 今天断点发现 No symbols have been loaded for this document.看到pdb lib 都有生成。但是就是断点提示:“The breakpoint will not currently be hit. No symbols have been…