用到的集成开发环境是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的更多相关文章

  1. angular部署到iis出现404解决方案

    angular应用部署在iis上,刷新出现404 解决方案: 安装 iis URL Rewrite 模块,并在 src 目录下增加web.config,配置urlrewrite如下: <conf ...

  2. asp.net core spa应用(angular) 部署同一网站下

    需求:现在一个应用是前后端开发分离,前端使用angular,后端使用 asp.net core 提供api ,开发完成后,现在需要把两个程序部署在同一个网站下,应该怎么处理? 首先可以参考微软的官方文 ...

  3. Angular部署到windows上

    1. 确保已经打开了IIS服务. 如果没有打开可参考 http://jingyan.baidu.com/article/eb9f7b6d9e73d1869364e8d8.html 2. 编译angul ...

  4. Angular + Github action + Nginx 部署

    在常规 Web 的开发流程之中,当开发步入尾声时就需要部署应用到服务器上,Angular 部署上还算简单.经过测试,部署平均用时在5分钟左右,主要受限于 GitHub 海外服务器的网速. 一.Angu ...

  5. .net core service && angular项目 iis发布

    项目结构 .net core 后端服务站点 angular 前端页面站点 项目模板来自于abp或者52abp .net core 后端服务站点发布到IIS 发布报错 .Net Core使用IIS部署出 ...

  6. cesium 学习(四) Hello World

    一.前言 之前的文章都是基础,搭建环境.部署Cesium.学习资料等等.现在简单入手,一个Hello World页面开发. 二.Hello World 感觉Hello World没有什么特别需要讲的, ...

  7. Cesium 学习(三)各种资源链接

    1.前言 前面已经介绍如何获得以及安装部署Cesium,接下来分享下学习资源链接,其中访问最多的是官网以及超图.火星的demo网站. 2.官网地址及介绍 官网:https://cesiumjs.org ...

  8. Cesium简介以及离线部署运行

    Cesium简介 cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎,一款开源3DGIS的js库.cesium支持3D,2D,2.5D形式的地图展示,可以自行绘制图形,高亮区 ...

  9. ABP .Net Core API和Angular前端APP集成部署

    前言:在ABP官网(https://aspnetboilerplate.com)生成的.Net Core + Angular项目前后端是两个独立的项目,我们可以分开部署,也可以将前端和Web API一 ...

随机推荐

  1. pytorch学习:准备自己的图片数据

    图片数据一般有两种情况: 1.所有图片放在一个文件夹内,另外有一个txt文件显示标签. 2.不同类别的图片放在不同的文件夹内,文件夹就是图片的类别. 针对这两种不同的情况,数据集的准备也不相同,第一种 ...

  2. gdb常用命令记录

    gdb常用命令 最近在研究nginx源码,gdb用于调试非常方便,之前这篇有研究过如何使用gdb调试nginx:https://www.cnblogs.com/yjf512/archive/2012/ ...

  3. WebSocket(4)---实现定时推送比特币交易信息

    实现定时推送比特币交易信息 实现功能:跟虚拟币交易所一样,时时更新当前比特币的价格,最高价,最低价,买一价等等...... 提示:(1)本篇博客是在上一遍基础上搭建,上一篇博客地址:[WebSocke ...

  4. 【FairyGUI & Unity】实现血条UI扣血与加血的缓动效果

    组件设计 创建一个进度条组件,作为血条. bar是实际血量条 DownBar是扣血缓动背景图层 UpBar是加血缓动背景图层 LowBar是低血量变色(和控制器配合,本文不讲) n11组合是血量参考线 ...

  5. 在Mac上使用vs-code快速上手c语言学习(入门文,老鸟退散)

    天下事,合久必分.分久必合,你肯定想不到当你逃离到Mac平台这么多年之后,有一天你会再用微软的产品来写代码 :) 其实微软的产品虽然用户体验总是做不到最好,但整体上的确拉低了行业的进入门槛,对于编程也 ...

  6. Lucene 06 - 使用Lucene的Query API查询数据

    目录 1 Query对象的创建(方式一): 使用子类对象 1.1 常用的Query子类对象 1.2 常用的Query子类对象使用 1.2.1 使用TermQuery 1.2.2 使用NumericRa ...

  7. PL/SQL基础语法入门

    先前安装了PL/SQL软件 PL/SQL全称为Procedural Language/SQL. PL/SQL也是一种程序语言,叫做过程化SQL语言,是Oracle数据库对SQL语句的扩展 打PL/SQ ...

  8. C#2.0 委托

    委托 委托是一个非常不错的设计,允许我们把方法做为参数传递,实现了开放閉放原则.在方法中我们只要有一个委托占位,调用者就可以传入符合签名的方法来做不同的操作,这也面向对象开发中多态的魅力. 但是在C# ...

  9. 基于open62541的opc ua 服务器开发实现(1)

    关于opcua的介绍这里就不多说了,相信大家大都有了一些了解,open62541是一个开源C(C99)的opc-ua实现,开源代码可在官网或github上下载. 话不多说,首先搭建一个opcua服务器 ...

  10. leetcode — palindrome-partitioning

    import java.util.ArrayList; import java.util.Arrays; import java.util.List; /** * Source : https://o ...