用到的集成开发环境是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. SpringCloud(5)---Feign服务调用

    SpringCloud(5)---Feign服务调用 上一篇写了通过Ribbon进行服务调用,这篇其它都一样,唯一不一样的就是通过Feign进行服务调用. 注册中心和商品微服务不变,和上篇博客一样,具 ...

  2. qt集成dsoframer.ocx打开office办公软件

    最近一段时间真是事情太多了,前不久项目中一个嵌入office软件的问题,由于没有时间研究,且项目的需求是浏览word文档,偷了一个懒,把word文档转换成pdf文档,然后嵌入libcef浏览器给打开了 ...

  3. IdentityServer4之Implicit(隐式许可) —— oidc-client-js前后端分离

    IdentityServer4之Implicit(隐式许可) —— oidc-client-js前后端分离 参考 官方文档:oidc-client-js:oidc-client是一个JavaScrip ...

  4. sql server 性能调优之 死锁排查

    一.概述 记得以前客户在使用软件时,有偶发出现死锁问题,因为发生的时间不确定,不好做问题的重现,当时解决问题有点棘手了.现总结下查看死锁的常用二种方式. 1.1 第一种是图形化监听: sqlserve ...

  5. 从零开始学习PYTHON3讲义(三)写第一个程序

    <从零开始PYTHON3>第三讲 本页面使用了公式插件,因博客主机过滤无法显示的表示抱歉,并建议至个人主页查看原文. ​ 我见过很多初学者,提到编程都有一种恐惧感,起源是感觉编程太难了.其 ...

  6. AngularJS7那些不得不说的事故

    题外话   最近简直要忙死,所以停更了很久,你们会不会以为我人间蒸发了?   正文之前,请允许我先跑个题,就是关于忙的问题.   做了Freelance,每天过的比上班还累,这完全不是我想要的生活啊? ...

  7. CentOS 6.5中安装使用dstat资源统计工具

    目录 1 dstat工具的使用 1.1 什么是dstat 1.2 dstat的基本使用 1.3 检测界面各参数的含义 1.4 dstat 的高级用法 2 dstat工具的安装 2.1 (推荐)通过yu ...

  8. 补习系列(3)-springboot中的几种scope

    目标 了解HTTP 请求/响应头及常见的属性: 了解如何使用SpringBoot处理头信息 : 了解如何使用SpringBoot处理Cookie : 学会如何对 Session 进行读写: 了解如何在 ...

  9. javascript入门篇(一)

    未定义:undefined 布尔类型值:true,false 判断类型:typeof() 绝对值:Math.abs(-1) 声明常量:const   声明变量:var 小数两值互换如果出现问题,可以通 ...

  10. Camera测试之Color & Lens shading Test

    测试目的:测试摄像头成像的均匀性 测试主要设备:均匀光源(DNP灯箱),色温照度计 测试环境:将灯箱光源调至600±100lux 测试注意事项:保证均匀的光源 测试原理: 造成摄像头成像不均匀的原因有 ...