基本信息
文件名称:Vue3中Cesium地图初始化及地图控件配置方法.docx
文件大小:15.72 KB
总页数:2 页
更新时间:2025-05-31
总字数:约小于1千字
文档摘要

Vue3中Cesium地图初始化及地图控件配置方法

目录前言一.地图初始化1.Vue项目创建2.运行环境配置3.地图初始化二、地图控件补充

前言

本文中,我们主要介绍Cesium在Vue3运行环境的配置,以及Cesium实例中控件的显隐设置,本文是后续文章内容的基础,项目代码在此查看;通过本文,我们可以得到一个纯净的cesium项目,后续的操作我们就可以在此基础上进行;

一.地图初始化

1.Vue项目创建

首先,我们需要创建一个新的Vue项目。本项目基于pnpm安装,也可使用其他包管理器进行安装,如npm或yarn;pnpm结合了前两者的优点,它能够快速安装依赖并节省磁盘空间。

打开终端,输入以下命令来创建一个新的Vue项目:

pnpmcreatevite

接着输入项目名init-map,并根据自己的需求进行配置。我的配置如下图所示:

创建项目后,就需要移动到项目文件夹,然后安装必备的库,启动项目。按照系统提示的代码,进行安装:

安装完成后,启动项目,可以看到项目已经启动在本地服务器上。复制链接在浏览器打开即可看到:

看到这个页面说明项目启动成功。

2.运行环境配置

接下来,我们需要进行cesium库以及其他依赖库的安装。按下Ctrl+C暂时关闭项目,然后输入以下命令进行cesium的安装:

pnpminstallcesium@1.99vite-plugin-cesium

文件较大,稍等片刻即可安装成功!(这里图片漏了一个,不用太在意