当前位置: 首页 > news >正文

使用vue3+cesium+earthsdk+supermap实现通视分析(有版本报错问题)

main.js:

这个文件是项目的入口文件,主要进行了以下操作:

  • 使用Vue 3createApp创建应用实例。
  • 加载了element-plus UI 组件库。
  • 加载了routerstore,以及axios用于发送HTTP请求。
  • @turf/turf和自定义的bus.js注册到全局属性中,便于在组件中使用。

环境配置需求:

你需要安装以下依赖环境:

  1. Node.js: 版本为18.18.2
  2. npm: 版本为9.6.7
  3. Webpack: 版本为4.47,但是vue-cli会自动管理它。
  4. 其他通过npm install自动安装的依赖项。
import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'
import router from './router'
import store from './store'
import axios from 'axios'
import VueAxios from 'vue-axios'
import * as turf from '@turf/turf'
import * as bus from './bus.js'// import "cesium/Widgets/widgets.css";
// import * as Cesium from "cesium/Cesium";
// global.Cesium = Cesium;const app = createApp(App);
app.use(ElementPlus);
// app.use(store).use(router).mount('#app')
app.use(store).use(router).use(VueAxios, axios).mount('#app')
app.config.globalProperties.$turf = turf;
app.config.globalProperties.$bus = bus;

vue.config.js:、

这个文件主要用于配置Webpack的打包和开发服务器设置:

  • publicPath: 指定了项目的根路径为/cesium2.0_test,可能会影响到项目的部署。
  • devServer: 配置了开发服务器端口为8081。
  • configureWebpack:
    • source-map: 这个设置便于开发调试代码,在生产环境中应该用none来提升性能。
    • resolve.alias: 使用@代表src文件夹,简化导入路径。
    • externals: 将很多外部库(如Cesium、xbsj-renderer、xbsj-xe2等)设为外部依赖,减少打包体积。
    • plugins: 使用CopyWebpackPlugin将一些依赖包复制到指定位置,主要是xbsj和esobjs插件的Web资源。
    • module.rules: 加载js文件时使用@open-wc/webpack-import-meta-loader,支持import.meta语法。
const CopyWebpackPlugin = require('copy-webpack-plugin')
const webpack = require('webpack')
const path = require('path')const debug = process.env.NODE_ENV !== 'production'
module.exports = {publicPath:"/cesium2.0_test",devServer: {port: 8081 //修改服务端口号},outputDir: 'cesium2.0_test', //设置 build 输出目录configureWebpack: {devtool:'source-map',//浏览器里调试代码 'source-map',部署用'none'output: {sourcePrefix: ' '},amd: {toUrlUndefined: true},resolve: {alias: {'@': path.resolve('src'),}},externals: {     // @cesiumcesium: 'Cesium', // xr-utils中有cesium相关的函数// @xbsj-renderer'xbsj-renderer/dist-node/xr-base-utils': 'xbsj["xr-base-utils"]','xbsj-renderer/dist-node/xr-math': 'xbsj["xr-math"]','xbsj-renderer/dist-node/xr-utils': 'xbsj["xr-utils"]','xbsj-renderer/dist-node/xr-cesium': 'xbsj["xr-cesium"]',// @xbsj-xe2'xbsj-xe2/dist-node/xe2': 'XE2["xe2"]','xbsj-xe2/dist-node/xe2-base': 'XE2["xe2-base"]','xbsj-xe2/dist-node/xe2-base-utils': 'XE2["xe2-base-utils"]','xbsj-xe2/dist-node/xe2-utils': 'XE2["xe2-utils"]','xbsj-xe2/dist-node/xe2-cesium': 'XE2["xe2-cesium"]','xbsj-xe2/dist-node/xe2-mapbox': 'XE2["xe2-mapbox"]','xbsj-xe2/dist-node/xe2-ue': 'XE2["xe2-ue"]','xbsj-xe2/dist-node/utility-xe2-plugin': 'XE2["utility-xe2-plugin"]','xbsj-xe2/dist-node/xe2-all-in-one': 'XE2["xe2-all-in-one"]','xbsj-xe2/dist-node/xe2-base-objects': 'XE2["xe2-base-objects"]','xbsj-xe2/dist-node/xe2-objects': 'XE2["xe2-objects"]','xbsj-xe2/dist-node/xe2-cesium-objects': 'XE2["xe2-cesium-objects"]','xbsj-xe2/dist-node/xe2-ue-objects': 'XE2["xe2-ue-objects"]','xbsj-xe2/dist-node/xe2-openlayers': 'XE2["xe2-openlayers"]','xbsj-xe2/dist-node/xe2-openlayers-objects': 'XE2["xe2-openlayers-objects"]',// plugins'smplotting-xe2-plugin/dist-node/smplotting-xe2-plugin': 'XE2["smplotting-xe2-plugin"]','smplotting-xe2-plugin/dist-node/smplotting-xe2-plugin-main': 'XE2["smplotting-xe2-plugin-main"]','esobjs-xe2-plugin/dist-node/esobjs-xe2-plugin': 'XE2["esobjs-xe2-plugin"]','esobjs-xe2-plugin/dist-node/esobjs-xe2-plugin-main': 'XE2["esobjs-xe2-plugin-main"]',},plugins: [new CopyWebpackPlugin([{from: './node_modules/xbsj-xe2/dist-web',to: 'js/xbsj-xe2/dist-web',toType: 'dir'},{from: './node_modules/xbsj-xe2-assets/dist-web',to: 'js/xbsj-xe2-assets/dist-web',toType: 'dir'},{from: './node_modules/smplotting-xe2-plugin/dist-web',to: 'js/smplotting-xe2-plugin/dist-web',toType: 'dir'},{from: './node_modules/esobjs-xe2-plugin/dist-web',

相关文章:

使用vue3+cesium+earthsdk+supermap实现通视分析(有版本报错问题)

main.js: 这个文件是项目的入口文件,主要进行了以下操作: 使用Vue 3的createApp创建应用实例。加载了element-plus UI 组件库。加载了router和store,以及axios用于发送HTTP请求。将@turf/turf和自定义的bus.js注册到全局属性中,便于在组件中使用。环境配置需求: 你需要安…...

python 轮子是什么

此一词语的由来是因为轮子由人类所发明,且在各方面都带来许多便利。既然轮子已被发明,而且在使用上没有什么缺陷,重新再发明一次轮子是没有意义的,只是浪费时间,分散研究者的资源,使其无法投入更有意义及价…...

农作物大豆病虫害识别分类数据集(猫脸码客第227期)

农作物大豆病虫害识别分类数据集 大豆,作为全球重要的粮食作物之一,不仅承载着人类饮食中的重要角色,还深刻影响着农业经济的发展。然而,大豆的生长过程中,常常面临着来自病害和虫害的双重威胁。这些病虫害不仅会影响…...

如何在算家云搭建GPT-SOVITS(语音转换)

一、模型介绍 GPT-SOVITS是一款强大的小样本语音转换和文本转语音 WebUI工具。它集成了声音伴奏分离、自动训练集分割、中文ASR和文本标注等辅助工具。 具有以下特征: 零样本 TTS: 输入 5 秒的声音样本并体验即时文本到语音的转换。少量样本 TTS&…...

ThinkPad T480拆机屏幕改装:便携式显示器DIY指南

ThinkPad T480拆机屏幕改装:便携式显示器DIY指南 本文记录了将旧笔记本电脑 T480 拆机屏幕改装为便携式显示器的全过程。作者在决定升级设备后,选择通过 DIY 方式利用原有的屏幕资源。文章详细介绍了屏幕驱动板的安装、螺丝孔的剪裁、排线连接及固定的步…...

C++ (8) C++11及更新特性:探索魔法新领域

C11及更新特性:探索魔法新领域 随着C语言的不断进化,C11及其后续版本带来了许多激动人心的新特性,它们就像是魔法世界中新发现的领域,充满了无限的可能性。这些新特性不仅提高了编程的效率和灵活性,还为程序员提供了更…...

【vue】Mammoth.js的使用:将.docx和doc 文件转换成HTML

mammoth.convertToHtml(input, options) :把源文档转换为 HTML 文档 mammoth.convertToMarkdown(input, options) :把源文档转换为 Markdown 文档。 mammoth.extractRawText(input) :提取文档的原始文本。这将忽略文档中的所有格式…...

HarmonyOS介绍 第一课习题答案

一、判断题 1. “一次开发,多端部署”指的是一个工程,一次开发上架,多端按需部署。为了实现这一目的,HarmonyOS提供了多端开发环境,多端开发能力以及多端分发机制。 正确(True)错误(False) 正确(True)回答正确 2. 《鸿蒙生态应用开发白皮书》全面阐释了鸿蒙生态下应…...

c/c++ stdcall cdel fastcall等函数调用约定说明

调用约定(Calling Conventions)是编程中定义函数如何接收参数、返回值以及如何管理堆栈的协议。主要的调用约定包括 __cdecl、__stdcall、__fastcall 和 __thiscall 等。下面将详细介绍这些调用约定的特点及其适用场景。 1. __cdecl 调用约定 定义&…...

【ROS概述】概念及环境搭建

学习途径: 教程:Introduction Autolabor-ROS机器人入门课程《ROS理论与实践》零基础教程 课程视频:https://www.bilibili.com/video/BV1Ci4y1L7ZZ 机器人体系 要完全实现一个机器人的系统研发,几乎是“全栈”开发,…...

MongoDB Shell 基本命令(三)生成学生脚本信息和简单查询

一、生成学生信息脚本 利用该脚本可以生成任意个学生信息,包括学号、姓名、班级、年级、专业、课程名称、课程成绩等信息,此处生成2万名学生,学生所有信息都是给定范围后随机生成。 生成学生信息后,再来对学生信息进行简单查询。…...

java核心技术点都有哪些

1. 面向对象编程(OOP) 核心概念:类、对象、继承、封装、多态。 比喻:面向对象编程就像是在搭建一个积木城堡。类(Class)是城堡的设计图纸,它定义了城堡的结构和功能;对象&#xff08…...

4404 - 提高:二分与三分:曲线(三分)

明明做作业的时候遇到了n个二次函数Si(x)=ax22+bx+c,他突发奇想设计了一个新的函数F(x)=max(Si(x)), i=1,2...n。 明明现在想求这个函数在[0,10000]的最小值,要求精确到小数点后四位四舍五入。 输入 输入包含T 组数据 (T<10) ,每组第一行一个整数 n(n≤10000) ,之后n行…...

软件工程--需求分析与用例模型

面向对象分析(ObjectOrientedAnalysis&#xff0c;简称OOA) 分析和理解问题域&#xff0c;找出描述问题域所需的类和对象&#xff0c;分析它们的内部构成和外部关系&#xff0c;建立独立于实现的OOA模型&#xff0c;暂时忽略与系统实现有关的问题。 主要使用UML中的以下几种图…...

预测房价学习

1. 实现函数来方便下载数据 import hashlib import os import tarfile import zipfile import requestsDATA_HUB dict() DATA_URL http://d2l-data.s3-accelerate.amazonaws.com/def download(name, cache_diros.path.join(.., data)):"""下载一个DATA_HUB中…...

电脑无法上网,但是微信、QQ可以正常使用

这种情况一般是由于DNS服务器配置错误&#xff0c;或者已有的DNS服务器无法正常解析地址造成的。 按下winR打开运行&#xff0c;输入ncpa.cpl&#xff0c;点击确定。 在打开的网络连接窗口中找到对应的网卡&#xff0c;双击打开。一般有线网是“以太网”&#xff0c;无线网&am…...

C++11新特性(列表初始化与右值引用折叠与完美转发)

c11 列表初始化c98的{}c11的{}std::initializer_list 右值引用和移动语义左值和右值的概念左值引用和右值引用引用延长临时对象生命周期左值和右值的参数匹配左值引用的主要使用场景移动构造和移动赋值引用折叠完美转发 列表初始化 c98的{} 在C98中&#xff0c;大括号 {} 的使…...

基于SSH的物流运输货运车辆管理系统源码

基于经典的ssh&#xff08;Spring Spring MVC Hibernate&#xff09;框架与SaaS&#xff08;软件即服务&#xff09;模式&#xff0c;我们为运输企业与物流公司打造了一款开源且易用的车辆管理系统。 该系统主要包含以下核心模块&#xff1a; 档案管理 财务管理 借款管理 保…...

基于RabbitMQ,Redis,Redisson,RocketMQ四种技术实现订单延时关闭功能及其相关优缺点介绍(以12306为主题)

目录 1. 延迟关闭订单 1.1 订单延时关闭功能技术选型 1.1.1 定时任务 1.1.2 RabbitMQ 1.1.3 Redis 过期监听 1.1.4 Redisson 1.1.5 RocketMQ 1.2 RocketMQ订单延时关闭发送方实现 1.3 RocketMQ订单延时关闭的消费方实现 1. 延迟关闭订单 用户发起订单后&#xff0c;如…...

HarmonyOS ArkTS与C++数据类型转换

1. HarmonyOS ArkTS与C数据类型转换 本文介绍了C与TS各自数据类型与互相之间的数据类型转换&#xff0c;在需要使用C模块时可以快速上手对各种数据类型进行转换。 1.1. 概述 HarmonyOS的主力开发语言是ArkTS&#xff0c;也提供了C语言的支持&#xff0c;对于一些能力&#xff…...

百川2-13B驱动OpenClaw智能客服:电商售后场景的自动化响应实战

百川2-13B驱动OpenClaw智能客服&#xff1a;电商售后场景的自动化响应实战 1. 为什么选择OpenClaw搭建轻量级客服系统 去年双十一期间&#xff0c;我运营的小型电商店铺遭遇了售后咨询暴增的问题。临时雇佣的客服人员不熟悉产品细节&#xff0c;导致大量重复问题需要反复解答…...

OpenClaw自动化周报系统:GLM-4.7-Flash汇总Git提交记录

OpenClaw自动化周报系统&#xff1a;GLM-4.7-Flash汇总Git提交记录 1. 为什么需要自动化周报系统 每周五下午&#xff0c;我的团队都需要提交工作周报。传统方式需要手动整理Git提交记录、回忆任务进展、再写成结构化报告&#xff0c;整个过程至少消耗40分钟。更痛苦的是&…...

STM32硬件定时器中断库:零HAL依赖多实例调度

1. 项目概述STM32_TimerInterrupt是一个面向 STM32 全系列微控制器&#xff08;覆盖 F0/F1/F2/F3/F4/F7/L0/L1/L4/G0/G4/H7/WB/MP1 等主流型号&#xff09;的轻量级、高可靠硬件定时器中断驱动库。其核心设计目标是在不依赖 HAL 库底层阻塞逻辑的前提下&#xff0c;提供稳定、低…...

Python内存泄漏自动拦截方案(CPython 3.8+内核级策略大揭秘)

第一章&#xff1a;Python内存泄漏自动拦截方案&#xff08;CPython 3.8内核级策略大揭秘&#xff09;CPython 3.8 引入的 tracemalloc 增强机制与对象生命周期钩子&#xff08;PyObject_New, PyObject_Free 的可插拔拦截点&#xff09;&#xff0c;为内存泄漏的实时感知与自动…...

为 GraphRAG 准备语料库

经典 RAG 专注于找到正确的段落&#xff0c;而 GraphRAG 帮助你看到段落、实体和主题在整个文档集合中是如何连接的。原始 GraphRAG 论文指出&#xff0c;标准 RAG 常常在处理宽泛问题时遇到困难&#xff0c;比如"这个数据集中的主要主题是什么&#xff1f;"为了解决…...

虚幻引擎登录界面常见BUG排查手册:解决UI显示与事件调度器问题

虚幻引擎登录界面开发实战&#xff1a;从UI异常到事件调度的深度解决方案 登录界面作为用户接触产品的第一道门户&#xff0c;其稳定性和交互体验直接影响用户对产品的第一印象。在虚幻引擎开发中&#xff0c;从UI控件渲染到事件逻辑处理&#xff0c;每个环节都可能隐藏着意想不…...

nRF24L01无线通讯模块发送失败排查指南:从引脚冲突到ACK配置

1. 引脚冲突&#xff1a;最容易被忽略的硬件陷阱 第一次用nRF24L01模块时&#xff0c;我踩过一个大坑&#xff1a;明明发送端显示数据发送成功&#xff0c;接收端却毫无反应。换了三套硬件还是同样的问题&#xff0c;直到发现接收板的CSN引脚竟然和复位电路共用了同一个GPIO。这…...

【华为OD机试真题】手牌接龙 · 最大出牌次数(Python /JS)

一、真题题目描述&#xff1a;手里给一副手牌&#xff0c;数字从0-9&#xff0c;有(红色)&#xff0c;g(绿色)&#xff0c;b(蓝色)&#xff0c;y(黄色)四种颜色&#xff0c;出牌规则为每次打出的牌必须跟上一张的数 字或者颜色相同&#xff0c;否则不能抽选。 选手应该怎么选才…...

开源社区运营:Qwen1.5-1.8B GPTQ自动回复GitHub Issues与生成Release Note

开源社区运营&#xff1a;用Qwen1.5-1.8B GPTQ自动回复GitHub Issues与生成Release Note 如果你在维护一个开源项目&#xff0c;下面这些场景你一定不陌生&#xff1a;每天打开GitHub&#xff0c;通知栏里又多了几十条未读Issues&#xff0c;有报Bug的&#xff0c;有提新功能想…...

Phi-3-Mini-128K辅助Python入门教学:代码解释与练习题生成

Phi-3-Mini-128K辅助Python入门教学&#xff1a;代码解释与练习题生成 1. 引言&#xff1a;当编程新手遇到“天书”代码 刚开始学Python那会儿&#xff0c;我经常对着书上的代码例子发呆。书上说for i in range(5):是个循环&#xff0c;但“循环”到底是什么&#xff1f;rang…...