用Angular部署Cesium
用到的集成开发环境是WebStrom,Cesium版本是1.50.0,Angular版本是6.2.4
1.首先我们安装cesium,在webstorm中的Termianl中输入
npm install --save cesium
2.再安装类型描述文件,让TypeScript认识Cesium
npm install @types/cesium --save
3.在项目中引用cesium
打开angular.json文件,添加如下路径:
4.在main.ts中配置Cesium的环境路径
main.ts中添加以下语句
window['CESIUM_BASE_URL'] = 'node_modules/cesium/Build/Cesium';
5.然后在我们的项目ts文件中引用
6.在我们项目html文件中添加Cesium的容器,在css文件中添加修饰文件
<div id="cesiumContainer"></div>
#cesiumContainer {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
7.运行项目,查看效果
用Angular部署Cesium的更多相关文章
- angular部署到iis出现404解决方案
angular应用部署在iis上,刷新出现404 解决方案: 安装 iis URL Rewrite 模块,并在 src 目录下增加web.config,配置urlrewrite如下: <conf ...
- asp.net core spa应用(angular) 部署同一网站下
需求:现在一个应用是前后端开发分离,前端使用angular,后端使用 asp.net core 提供api ,开发完成后,现在需要把两个程序部署在同一个网站下,应该怎么处理? 首先可以参考微软的官方文 ...
- Angular部署到windows上
1. 确保已经打开了IIS服务. 如果没有打开可参考 http://jingyan.baidu.com/article/eb9f7b6d9e73d1869364e8d8.html 2. 编译angul ...
- Angular + Github action + Nginx 部署
在常规 Web 的开发流程之中,当开发步入尾声时就需要部署应用到服务器上,Angular 部署上还算简单.经过测试,部署平均用时在5分钟左右,主要受限于 GitHub 海外服务器的网速. 一.Angu ...
- .net core service && angular项目 iis发布
项目结构 .net core 后端服务站点 angular 前端页面站点 项目模板来自于abp或者52abp .net core 后端服务站点发布到IIS 发布报错 .Net Core使用IIS部署出 ...
- cesium 学习(四) Hello World
一.前言 之前的文章都是基础,搭建环境.部署Cesium.学习资料等等.现在简单入手,一个Hello World页面开发. 二.Hello World 感觉Hello World没有什么特别需要讲的, ...
- Cesium 学习(三)各种资源链接
1.前言 前面已经介绍如何获得以及安装部署Cesium,接下来分享下学习资源链接,其中访问最多的是官网以及超图.火星的demo网站. 2.官网地址及介绍 官网:https://cesiumjs.org ...
- Cesium简介以及离线部署运行
Cesium简介 cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎,一款开源3DGIS的js库.cesium支持3D,2D,2.5D形式的地图展示,可以自行绘制图形,高亮区 ...
- ABP .Net Core API和Angular前端APP集成部署
前言:在ABP官网(https://aspnetboilerplate.com)生成的.Net Core + Angular项目前后端是两个独立的项目,我们可以分开部署,也可以将前端和Web API一 ...
随机推荐
- java代码之美(3)---guava 复写Object常用方法
guava 复写Object常用方法 Guava 是一个 Google 的基于java1.6的类库集合的扩展项目,这个库提供用于集合,缓存,支持原语,并发性,常见注解,字符串处理,I/O和验证的实用方 ...
- Ocelot统一权限验证
Ocelot作为网关,可以用来作统一验证,接上一篇博客,我们继续 前一篇,我们创建了OcelotGateway网关项目,DemoAAPI项目,DemoBAPI项目,为了验证用户并分发Token,现在还 ...
- 纽约工作日志流水账 Day 2
今天本来想一觉睡到早上7点,结果凌晨2点30就行了,然后就各种睡不着了. 挣扎到5点,饿的不行,就起来找东西吃,发现冰箱里东西真不少. 8点半,开始和亢爷做早饭,自制俩汉堡,样子略丑, 味道还不错.这 ...
- Content Security Policy (CSP) 介绍
当我不经意间在 Twitter 页面 view source 后,发现了惊喜. <!DOCTYPE html> <html lang="en"> <h ...
- SpringBoot入门教程(二十)Swagger2-自动生成RESTful规范API文档
Swagger2 方式,一定会让你有不一样的开发体验:功能丰富 :支持多种注解,自动生成接口文档界面,支持在界面测试API接口功能:及时更新 :开发过程中花一点写注释的时间,就可以及时的更新API文档 ...
- SpringBoot入门教程(七)整合themeleaf+bootstrap
Thymeleaf是用于Web和独立环境的现代服务器端Java模板引擎.Thymeleaf的主要目标是将优雅的自然模板带到您的开发工作流程中—HTML能够在浏览器中正确显示,并且可以作为静态原型,从而 ...
- Go基础系列:map类型
Go里的map用于存放key/value对,在其它地方常称为hash.dictionary.关联数组,这几种称呼都是对同一种数据结构的不同称呼,它们都用于将key经过hash函数处理,然后映射到val ...
- 【Java基础】【03运算符&if语句】
03.01_Java语言基础(逻辑运算符的基本用法)(掌握) A:逻辑运算符有哪些 &,|,^,! &&,|| B:案例演示 逻辑运算符的基本用法 注意事项: a:逻辑运算符一 ...
- 深度学习入门实战(一):像Prisma一样算法生成梵高风格画像
本文由云+社区发表 作者:董超 导语:现在人工智能是个大热点,而人工智能离不开机器学习,机器学习中深度学习又是比较热门的方向,本系列文章就从实战出发,介绍下如何使用MXnet进行深度学习~ 既然是实战 ...
- ps 命令的十个简单用法
注记 ps 命令有两种不同的语法风格 -- BSD 与 UNIX 两种风格.新手常常对这两种形式产生误解,因此我们有必要在这里作一个简单的说明: ps aux 与 ps -aux 是不同的,例如 -u ...