15
ANGULAR CESIUM By Eitan Frailich

ANGULAR CESIUM - WordPress.com

  • Upload
    others

  • View
    37

  • Download
    0

Embed Size (px)

Citation preview

Page 1: ANGULAR CESIUM - WordPress.com

ANGULAR CESIUMBy Eitan Frailich

Page 2: ANGULAR CESIUM - WordPress.com

ABOUT ME

• Eitan Frailich

• Member of The Guild

• ArtiCode devshop

• Creator of angular-cesium

• Love open source and code

Page 3: ANGULAR CESIUM - WordPress.com

WHAT WE GOING TO TALK

• Short intro about cesium

• Key features of angular-cesium

• Usage examples

• Cool Demos for GIS systems based on angular-cesium

Page 4: ANGULAR CESIUM - WordPress.com

CESIUM• CesiumJs is an open-source JavaScript

library for world-class 3D and 2D globes and maps based on WebGL.

• Enables visualisation of spatial data, streaming of massive 3D datasets (3dTiles) and more

• https://cesiumjs.org/

Page 5: ANGULAR CESIUM - WordPress.com

ANGULARLeading open source framework for web

applications

Page 6: ANGULAR CESIUM - WordPress.com

+ =

Page 7: ANGULAR CESIUM - WordPress.com

ANGULAR - CESIUM

Open source framework for creating GIS web applications using CesiumJs and Angular components.

Focusing on High performance with easy usage.

• https://github.com/TGFTech/angular-cesium

Page 8: ANGULAR CESIUM - WordPress.com

MAIN FEATURES• Expend Cesium power by decorating more features

• Write your code in Declarative way using HTML tags and angular components - Readable and Maintainable code

• Application architecture based on entity layers

• Development based on data models and not map entities

• High performance and realtime data rendering

• Extend map gestures handling

• Expend Cesium components (Html)

• Common utils like shape editors, camera control and more

• http://www.angular-cesium.com/

Page 9: ANGULAR CESIUM - WordPress.com

COMPONENTS BASED DEVELOPMENT

• Easily defining a layer

• Readable code  — when reading your html which describes your layer  it is pretty easy to understand how your layer would look.

• Demo - https://glo.now.sh/

Page 10: ANGULAR CESIUM - WordPress.com

COMPONENTS BASED DEVELOPMENT

• Supports data streams using RxJs Observables

Page 11: ANGULAR CESIUM - WordPress.com

COMPONENTS BASED DEVELOPMENT

A more complex example: http://geo-strike.com/ main-map.component.html

Page 12: ANGULAR CESIUM - WordPress.com

COMPONENTS BASED DEVELOPMENT

me.component.html

How <me/> look like:

Page 13: ANGULAR CESIUM - WordPress.com

HIGH PERFORMANCE• Optimised for data with high update rates

• No unnecessary html

• Batching Option

• Caching

• IMS points demo

Page 14: ANGULAR CESIUM - WordPress.com

HANDLE MAP EVENTS• Handle All kind of map events including touch events

• Execute events on model entities and primitive entities

• Plonter handling out of the box

• Exposes Simple API as “MapEventsManager” Service: