Building 3D Web Applications - ESRI · 2014. 3. 24. · Why Web 3D for ArcGIS -Use cases -What is...
Transcript of Building 3D Web Applications - ESRI · 2014. 3. 24. · Why Web 3D for ArcGIS -Use cases -What is...
-
Building 3D Web Applications with ArcGIS
Moxie Zhang | Javier Gutierrez
-
Topics
Introduce Web 3D
- Why Web 3D for ArcGIS - Use cases - What is Web 3D for
ArcGIS - Web 3D Architecture
What’s New and Road Ahead
- Scene Service - Web Scene - Elevation - Symbology
Develop Web 3D Apps
- Create 3D map environment
- Add 3D data - Visualize feature data - Use geoprocess - Render 3D Symbols - More …
-
Why Web 3D
-
Our users are solving real life problems using 3D tools, on the Web
WE LIVE IN A 3D WORLD
-
Introduce
Web 3D for ArcGIS
-
Web 3D initiative Enable 3D GIS on mobile devices & browsers
Story Telling in 3D
Asset Management in 3D
Situational Awareness in 3D
-
Esri is developing 3D technologies around world and around the clock
Redlands Zurich
Beijing
-
Develop Web 3D Applications
-
Web 3D – Overview New 3D Service, Viewer, Apps and APIs
3D Scene Service
ArcGIS Platform
ArcGIS Server, Online, Portal
Web Scene
ArcGIS Professional
ArcGIS Online/Portal
Developers
ArcGIS API for JavaScript
ArcGIS Runtime SDKs 3rd Party
tools
Web Scene Layer
-
Web 3D Client Architecture
-
Loosely coupled
implementation(s)
Abstracted public
API methods
Web 3D Client Architecture
• ArcGIS API for JavaScript with 3D capabilities
- New internal architecture but same* public JS API classes
* 99% backwards compatible code + new classes for 3D
Viewport(s) LayerView(s)
Map Layer
-
Loosely coupled
implementation(s)
Abstracted public
API methods
Web 3D Client Architecture
• Developers now need to choose between a Viewport type:
- 2D, 3D WebGL or 3D Plugin
* 99% backwards compatible code + new classes for 3D
2D Viewport
Layer Map
3D Viewport
2D LayerView
3D LayerView
-
Demo: Map and Viewport
-
Demo: Map and Viewport
-
New ArcGIS API for Javascript 3D Capabilities
• Same Javascript class model extended with - New 3D Layer (Scene Service Layer) - New 3D Symbology - New 3D Mesh geometry type - Added Z values to geometries
• Same programming pattern that has been taught, learned and used for many years
• The 3D core and rendering technologies are transparent to developers and browser-independent
-
Let’s Code
-
Create a Map
-
Add a Basemap
-
Add 3D Scene Service Layer
-
Add A Dynamic Map Layer
-
Add a Graphic Layer
-
Add a Feature Service Layer
-
3D Symbology
-
Running a Geoprocess
-
Demo: Elevation
-
The latest and more…
-
Intro to ArcGIS Scene Service
• New service type in ArcGIS Server • For 3D vector data (mesh, point, line, polygon) • Based on vector cache (i3s)
- Spatial index - Level of detail - Optimized data encoding
• Data streaming through REST • Client-side rendering
-
Consuming ArcGIS Scene Service
• JS API - Scene Service Layer • How does it work?
- Quad-tree node traversal - Based on distance to camera - Level of Detail support - 3D Geometry / Textures
• How to use it?
-
Demo: Scene Service Layer
-
Web Scene
Web Scene
Desktop Web Device
Server Online Content and Services
• New in ArcGIS Online and Portal
• Mash-up of 3D / 2D layers
• Web Scene Viewer and Author
• Built with the JavaScript API
-
Web Scene – designed for 3D
- 3D Layers - 3D Symbology - 3D Labels - Table of Contents - 3D Popups - Tours - …
-
Demo: Web Scene viewer
-
ArcGIS WebApp Builder for 3D Demo
-
2014 Developer Summit
2014 User Conference
2014 ArcGIS 10.x
Road Ahead
-
Building 3D Web Applications �with ArcGISTopicsSlide Number 3Our users are solving real life problems using 3D tools, on the WebSlide Number 5Web 3D initiativeSlide Number 7Slide Number 8Web 3D – OverviewWeb 3D Client ArchitectureWeb 3D Client ArchitectureWeb 3D Client ArchitectureSlide Number 13Slide Number 14New ArcGIS API for Javascript 3D CapabilitiesSlide Number 16Create a MapAdd a BasemapSlide Number 19Add 3D Scene Service LayerSlide Number 21Add A Dynamic Map LayerSlide Number 23Add a Graphic LayerAdd a Feature Service LayerSlide Number 26Slide Number 273D SymbologySlide Number 29Running a GeoprocessSlide Number 31Slide Number 32Slide Number 33Intro to ArcGIS Scene Service Consuming ArcGIS Scene Service Slide Number 36Web SceneWeb Scene – designed for 3DSlide Number 39ArcGIS WebApp Builder�for 3DSlide Number 41Slide Number 42Slide Number 43