vite+vue集成cesium

 1、创建项目、选择框架vue+js

pnpm create vite demo_cesium

2、进入项目安装依赖 

cd demo_cesium
pnpm install

3、安装cesium及插件 

3、pnpm i cesium vite-plugin-cesium

4、修改vite-config.js 

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import cesium from 'vite-plugin-cesium'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue(),cesium()],
})

5、删除style.css,修改App.vue 

<template>
  <div id="cesiumContainer">
  </div>
</template>
<script setup>
import { onMounted } from 'vue'
import * as Cesium from 'cesium'
onMounted(() => {
  Cesium.Ion.defaultAccessToken = '' //改为自己申请的token
  new Cesium.Viewer('cesiumContainer')   
})
</script>
<style scoped></style>

6、运行 

pnpm dev

 

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

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

相关文章

Github忘记了Two-factor Authentication code

意外重置了edge浏览器 码农家园github自从开启开启了2FA认证&#xff0c;每次输入auth code确实麻烦&#xff0c;于是下载了浏览器插件 Open two factor authenticator&#xff0c; 最近edge频繁宕机&#xff0c;而且提示磁盘空间不足&#xff0c;要不要立即清理并重置浏览器临…

TS_开发一个项目

目录 一、编译一个TS文件 1.安装TypeScript 2.创建TS文件 3.编译文件 4.用Webpack打包TS ①下载依赖 ②创建文件 ③启动项目 TypeScript是微软开发的一个开源的编程语言&#xff0c;通过在JavaScript的基础上添加静态类型定义构建而成。TypeScript通过TypeScript编译器或…

单片机软件架构连载(2)-指针

我工作了10年&#xff0c;大大小小做过几十个项目&#xff0c;用指针解决过很多实际产品的痛点&#xff0c;比如写过小系统&#xff0c;数据结构(队列&#xff0c;链表)&#xff0c;模块化编程等等..... 今天贴近实际&#xff0c;给大家总结了c语言指针常用的知识点&#xff0c…

用可视化的方式学统计学

本次分享一个统计学学习工具:看见统计。 看见统计致力于用数据可视化 (使用D3.js完成) 让统计概念更容易理解,源于布朗大学几位作者👇 看见统计共有6个章节, 下面来看看具体内容, 中心极限定理 对于一个(性质比较好的)分布,如果我们有足够大的独立同分布的样本,其…

【C语言】刷题笔记 Day1

多刷题 多思考 【题目1】 实现字母的大小写转换&#xff0c;实现多组输入输出 1. getchar 为输入函数&#xff0c;EOF&#xff08;end of file&#xff09;为文件结束标志&#xff0c;通常为文件结束的末尾。 2. 题目中要求实现多组输入输出&#xff0c;那我们用 while 循…

学习无人机飞行技术,有哪些就业方向?

随着无人机技术的不断进步和应用领域的拓展&#xff0c;研发创新人才的需求也将不断增加&#xff0c;那就业前景还是很广阔的。学习无人机飞行技术后&#xff0c;有以下多个就业方向可供选择&#xff1a; 1. 无人机操作员&#xff1a; - 负责操控和监控无人机飞行&#xff0c;…

支持混合模型的项目管理系统有哪些?PingCode 混合模型上线

众所周知&#xff0c;敏捷和瀑布是国内外研发项目管理的主流方法。然而&#xff0c;面对复杂性高、规模大、需要创新的项目&#xff0c;单一采用敏捷或瀑布方法往往难以完全满足需求。所以&#xff0c;国内许多企业趋向于结合多种管理模型的优势&#xff0c;形成一种混合管理模…

第一后裔掉宝奖励有什么 怎么领取第一后裔掉宝奖励

第一后裔在今天就要正式上线了&#xff0c;虽然是一款刚刚上线的新游戏&#xff0c;但是其实很早就测试过了&#xff0c;而且测试过很多次&#xff0c;所以有很多已经体验过的小伙伴&#xff0c;这款游戏的玩法还是比较有意思的&#xff0c;第三人称刷宝射击加上MMORPG的玩法&a…

力扣 用队列实现栈(Java)

核心思想&#xff1a;因为队列都是一端进入另一端出&#xff08;先进先出&#xff0c;后进后出&#xff09;&#xff0c;因此一个队列肯定是不能实现栈的功能的&#xff0c;这里就创建两个队列来模拟栈的先进后出&#xff0c;后进先出。 比如说如果是push操作我们肯定是要弹出栈…

自动编码器简单理解及简单使用描述

1. 什么是自动编码器&#xff1f; 自动编码器分为编码器和解码器&#xff0c;其中解码器只在训练阶段用到。具体过程就是&#xff1a; 首先&#xff0c;输入训练样本&#xff0c;编码器对输入样本进行编码&#xff0c;对其进行降维&#xff0c;直到到达某个瓶颈层&#xff1b…

软件开发案例参考

前言&#xff1a;基于平台现有需求进行新功能模块开发与实现&#xff0c;以下内容为部分源码解析&#xff0c;仅提供一些思路参考&#xff0c;不予以客观指导&#xff0c;毕竟条条大路通罗马嘛&#xff1b; 语言&#xff1a;C# 工具&#xff1a;visual studio 2017/visual st…

WGAN(Wassertein GAN)

WGAN E x ∼ P g [ log ⁡ ( 1 − D ( x ) ) ] E x ∼ P g [ − log ⁡ D ( x ) ] \begin{aligned} & \mathbb{E}_{x \sim P_g}[\log (1-D(x))] \\ & \mathbb{E}_{x \sim P_g}[-\log D(x)] \end{aligned} ​Ex∼Pg​​[log(1−D(x))]Ex∼Pg​​[−logD(x)]​ 原始 GAN …

T4打卡 学习笔记

所用环境 ● 语言环境&#xff1a;Python3.11 ● 编译器&#xff1a;jupyter notebook ● 深度学习框架&#xff1a;TensorFlow2.16.1 ● 显卡&#xff08;GPU&#xff09;&#xff1a;NVIDIA GeForce RTX 2070 设置GPU from tensorflow import keras from tensorflow.keras…

uniapp学习笔记

uniapp官网地址&#xff1a;https://uniapp.dcloud.net.cn/ 学习源码&#xff1a;https://gitee.com/qingnian8/uniapp-ling_project.git 颜色网址&#xff1a;https://colordrop.io/ uniapp中如何获取导航中的路由信息&#xff1f; onLoad(e){console.log(e)console.log(e.w…

探索IT世界的第一步:高考后的暑期学习指南

目录 前言1. IT领域概述1.1 IT领域的发展与现状1.2 IT领域的主要分支1.2.1 软件开发1.2.2 数据科学1.2.3 网络与安全1.2.4 系统与运维 2. 学习路线图2.1 基础知识的学习2.1.1 编程语言2.1.2 数据结构与算法 2.2 实战项目的实践2.2.1 个人项目2.2.2 团队项目 2.3 学习资源的利用…

Vue入门-如何创建一个Vue实例

创建一个一个Vue实例总共分为四步&#xff1a; 1.创建一个容器 2.引包&#xff1a;地址栏搜索v2.cn.vuejs.org这是vue2的官网地址&#xff0c;把2去掉就是vue3的官网地址&#xff0c;我们的包分为开发版本和生产版本&#xff0c;开发版本包含完整的警告和调试模式生产版本删除…

Axure原型工具速览:一分钟带你领略设计魅力!

Axure曾经成为产品经理必备的原型设计工具&#xff0c;甚至被认为是专门为产品经理设计的工具。但事实上&#xff0c;软件Axure的应用场景并不局限于产品经理构建产品原型。UI/UX设计师还可以使用Axure软件构件应用APP原型&#xff0c;网页设计师也可以使用Axure软件构件网站架…

Python中的并发编程(5)PyQt 多线程

PyQt 多线程 1 卡住的计时器 我们定义了一个计时器&#xff0c;每秒钟更新一次显示的数字。此外我们定义了一个耗时5秒的任务oh_no&#xff0c;和按钮“危险”绑定。 当我们点击“危险”按钮时&#xff0c;程序去执行oh_no&#xff0c;导致显示停止更新了。 import sys im…

类和对象【上】【C++】

P. S.&#xff1a;以下代码均在VS2019环境下测试&#xff0c;不代表所有编译器均可通过。 P. S.&#xff1a;测试代码均未展示头文件stdio.h的声明&#xff0c;使用时请自行添加。 博主主页&#xff1a;LiUEEEEE                        …

泰勒展开式在Android系统或应用程序中的应用

泰勒展开式在Android系统或应用程序中的应用 引言 泰勒展开式(Taylor Series)是高等数学中的一个重要工具,它允许我们将一个复杂函数表示为一个无穷多项式的和,从而近似计算函数值。在Android开发中,理解和应用泰勒展开式有助于优化涉及复杂数值计算的算法,提高应用程序…