Introduce Web3D Development and Visualization Moxie Zhang Esri R&D Center Beijing
Web Scene Desktop Web Device New in ArcGIS Online and Portal Web Scene Mash-up of 3D / 2D layers Web Scene Viewer and Author Built with the JavaScript API Server Online Content and Services Developing 3D Web Applicatin with
Web Scene designed for 3D - 3D Layers - 3D Symbology - 3D Labels - Table of Contents - 3D Popups - Tours - Developing 3D Web Applicatin with
Introduce Web 3D for ArcGIS Esri UC 2014 Technical Workshop Data is Beautiful
Web 3D for ArcGIS ArcGIS Professional ArcGIS Online/Portal 3D Scene Service ArcGIS Platform Web Scene Layers Developers ArcGIS API for JavaScript 3 rd Party tools ArcGIS Server, Online, Portal Web Scene ArcGIS Runtime SDKs Developing 3D Application using Web
Web 3D Architect Data Processing Services SDKs Apps ArcGIS Professional ArcGIS Server 3D Scene Service ArcGIS API for JavaScript Web App Builder ArcGIS Online/Portal Client ArcGIS Online/Portal Service Web Scene ArcGIS Runtime SDKs Widgets w w w w w Esri UC 2014 Demo Theater
General 3D Web Application Architecture Developing 3D Application using Web
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 browserindependent
Web 3D Client Architecture ArcGIS API for JavaScript with 3D capabilities New internal architecture but same* public JS API classes Map Layer * 99% backwards compatible code + new classes for 3D Developing 3D Application using Web Esri UC 2014 Demo Theater Developing 3D Web Applocatin with ArcGIS
Web 3D Client Architecture ArcGIS API for JavaScript with 3D capabilities New internal architecture but same* public JS API classes Map Layer Viewport(s) LayerView(s) * 99% backwards compatible code + new classes for 3D Developing 3D Application using Web Esri UC 2014 Demo Theater Developing 3D Web Applocatin with ArcGIS
Web 3D Client Architecture ArcGIS API for JavaScript with 3D capabilities New internal architecture but same* public JS API classes Abstracted public API methods Map Layer Loosely coupled implementation(s) Viewport(s) LayerView(s) * 99% backwards compatible code + new classes for 3D Developing 3D Application using Web Esri UC 2014 Demo Theater Developing 3D Web Applocatin with ArcGIS
Web 3D Client Architecture ArcGIS API for JavaScript with 3D capabilities New internal architecture but same* public JS API classes Abstracted public API methods Map Layer Loosely coupled implementation(s) 2D Viewport 3D Viewport 2D Viewport 3D Viewport * 99% backwards compatible code + new classes for 3D Developing 3D Application using Web Esri UC 2014 Demo Theater Developing 3D Web Applocatin with ArcGIS
Under the 3D ViewPort 3D Runtime Render - Full 3D Runtime functions - High performance - Large data set - Cross browser support - Need install browser plugin WebGL Render - Pure browser app without plugin - WebGL is maturing - Under heavy development - Performance and large data set support are improving - Cross browser support Application Development (1) the same JavaScript API (2) via Web AppBuilder for ArcGIS Developing 3D Application using Web
Build 3D Web App Helping users with extra dimension Esri UC 2014 Technical Workshop Developing 3D Application using Web AppBuilder
Demo: Map and Viewport
Create a Map
Add a Basemap
What s 3D Data Visualization Symbolization of data in 3D effects. A way to better visualize and understand data. Data is Beautiful
Why 3D Data Visualization 3D adds one additional dimension to data visualization. People tend to learn and understand from visual representations easier and more than from textual representations. 3D visualization is more in-depth and more intuitional than 2D visualization. 3D visualization can better handle time-relevant data by supporting animated effects. Data is Beautiful
Data lifecycle Collect data Process and analyze data Visualize data Data is Beautiful
Data visualization SDK requirements Simple to use General Beautiful Animation support High performance Data is Beautiful
Viz Render architecture WebGL Engine Viz Module MeshRender PointSpriteRender ViewPortRender Layer Draw TemperatureRender ExtrusionRender TrafficRender Esri UC 2014 Demo Theater Data is Beautiful
Data sources GraphicsLayer FeatureLayer SceneLayer 3D Data Visualization Data sources 3D Symbols 3D Renderers 3D Renderers 3D Map Browser with WebGL Engine Browser with Runtime 3D Plugin Type Presentation Title Here
Demo 3D Data is Beautiful Esri UC 2014 Demo Theater Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful
Data is Beautiful