用到的集成开发环境是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. qt 标签 QTextBrowser QLabel

    使用标签控件时我首先想到的就是QLabel,QLabel支持自动换行,并可以解析富文本,是一个不错的选择,这也使的我并没有去深入了解其他的可以有 同样效果的控件,本篇文字我也主要是讲解标签的用法,可以 ...

  2. asp.net core 系列 21 EF现有数据库进行反向工程

    一.概述 在上篇中使用EF基于数据模型创建数据库,  本篇继续使用 EF  基于数据库创建数据模型.  实现对已有数据库进行反向工程,来构建数据访问的 ASP.NET Core MVC 应用程序.已有 ...

  3. C++版 - Lintcode 77-Longest Common Subsequence最长公共子序列(LCS) - 题解

    版权声明:本文为博主Bravo Yeung(知乎UserName同名)的原创文章,欲转载请先私信获博主允许,转载时请附上网址 http://blog.csdn.net/lzuacm. C++版 - L ...

  4. Solr 08 - 在Solr Web管理页面中查询索引数据 (Solr中各类查询参数的使用方法)

    目录 1 Solr管理页面的查询入口 2 Solr查询输入框简介 3 Solr管理页面的查询方案 1 Solr管理页面的查询入口 选中需要查询的SolrCore, 然后在菜单栏选择[Query]: 2 ...

  5. 精读《Scheduling in React》

    1. 引言 这次介绍的文章是 scheduling-in-react,简单来说就是 React 的调度系统,为了得到更顺滑的用户体验. 毕竟前端做到最后,都是体验优化,前端带给用户的价值核心就在于此. ...

  6. C语言实现顺序栈的初始化&进栈&出栈&读取栈顶元素

    /*顺序表实现栈的一系列操作*/ #include<stdio.h> #include<stdlib.h> #define Stack_Size 50 //设栈中元素个数为50 ...

  7. webpack4.0各个击破(8)—— tapable篇

    webpack作为前端最火的构建工具,是前端自动化工具链最重要的部分,使用门槛较高.本系列是笔者自己的学习记录,比较基础,希望通过问题 + 解决方式的模式,以前端构建中遇到的具体需求为出发点,学习we ...

  8. babel版本兼容报错处理:Plugin/Preset files are not allowed to export objects

    原文地址: https://www.cnblogs.com/jiebba/p/9618930.html 1.为什么会报错 ? 这里抱着错误是因为 babel 的版本冲突. 多是因为你的 babel 依 ...

  9. 实时显示数据 SignalR 及时消息提醒( 立即向其推送内容)

    实时显示数据  SignalR 及时消息提醒( 立即向其推送内容) http://www.cnblogs.com/Leo_wl/p/5634910.html  <!--Reference the ...

  10. ubuntu所有php扩展php-7.0扩展列表

    sudo apt-get install php7.0-bcmath sudo apt-get install php7.0-bz2 sudo apt-get install php7.0-calen ...