high-performance visualization of massive cad data with webgl

12
High-Performance Visualization of Massive CAD Data with WebGL WebGL and glTF BOF @ SIGGRAPH 2015 Christian Stein, Maik Thöner, Max Limper, Johannes Behr VCST Group, Fraunhofer IGD

Upload: others

Post on 30-Jan-2022

5 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: High-Performance Visualization of Massive CAD Data with WebGL

High-Performance Visualization of Massive CAD Data with WebGL

WebGL and glTF BOF @ SIGGRAPH 2015

Christian Stein, Maik Thöner, Max Limper, Johannes BehrVCST Group, Fraunhofer IGD

Page 2: High-Performance Visualization of Massive CAD Data with WebGL

webVis / instant3Dhub

Page 3: High-Performance Visualization of Massive CAD Data with WebGL

Data Transcoding

Typical Automotive CAD Data Set:– 20-60 Mio. triangles

– 8-12 GB in orig. CAD format (e.g., OpenJT)

Page 4: High-Performance Visualization of Massive CAD Data with WebGL

Data Transcoding

Typical Automotive CAD Data Set:– 20-60 Mio. triangles

– 8-12 GB in orig. CAD format (e.g., OpenJT)

Geometry After Transcoding:– Quantized, Stripified, GPU-friendly encoding

– 150-700 MB, ~8-12 bytes / triangle

Page 5: High-Performance Visualization of Massive CAD Data with WebGL

Parsing, Culling, Loading

Still: How can we conveniently process a 500MB* data set? (* transmission: ~250MB using gzip)

– Do everything on a budget● structure parsing● spatial index traversal● GPU uploads● rendering

– Load largest visible parts first ( bounding volumes)

– Visual feedback, provide usable intermediate results

Page 6: High-Performance Visualization of Massive CAD Data with WebGL

Visual Feedback: Example

Page 7: High-Performance Visualization of Massive CAD Data with WebGL

Flexible Rendering Pipeline Configuration

– Always try to avoid re-drawing from scratch

– Challenge: Dynamic auxiliary geometry(user enables / disables, downloads finish, ...)

– hare3d: Flexible configuration of pipeline stages / slots

Page 8: High-Performance Visualization of Massive CAD Data with WebGL

Flexible Rendering Pipeline Configuration

Auxiliary Color

Auxiliary Depth Main Depth

Main Color Part IDs

Page 9: High-Performance Visualization of Massive CAD Data with WebGL

Flexible Rendering Pipeline Configuration

+

Page 10: High-Performance Visualization of Massive CAD Data with WebGL

Work in Progress

– Memory management / replacement strategies

– Use hardware occlusion queries with iterative rendering

– Screen-space techniques(e.g., deferred shading / highlighting)

Page 11: High-Performance Visualization of Massive CAD Data with WebGL

Demo Time!

Page 12: High-Performance Visualization of Massive CAD Data with WebGL

Context: webVis / instant3Dhub

Can render client-side(WebGL)

→Our Focus today