5. Pipeline for Interaction, Data, and Geometry Visualization


Day 5: Pipeline for Data and Geometry Visualization (or CAD system)
Introduction to Development of CAD application

Programming Pattern for CAD system, Event, Data flow, Controller flow, Rendering flow

Research Overview:
* Small Environment
* Sketch hand

1) MVC pattern and flow(data and commands)
2) programming pattern for CAD system
3) Interaction for visualization(mouse, keyboard)

Workshop: Codepen
1) data flow
2) controller flow
3) rendering flow

Additional note:
1) Mesh WebGL vertex and connectivity
2) Visualizing 3D geometry on Web (Three JS)

  • Overview
Small Environment by NJSTUDIO
  • Lecture

Computer-Aided Design (CAD), Graphics, and Programming Pattern

Typescript Classes
Software design pattern: link, (GoF) Design Patterns
MVC(Model–view–controller) Pattern: link
Inheritance (object-oriented programming): link

  • Workshop

Typescript class example: link
Python Class example: link, others

Mouse interaction: link
Keyboard interaction: link
Touch interaction: link

Three JS: link

Three Starter: link
Primitives: link
Points: link
Custom mesh: link
Mesh from Rhino3d: link

Three, Terrain, pixel map(matrix): link
Rhino Grasshopper, Terrain, pixel map(matrix): link
Three, Voxel map: link

Parse OBJ & STL format: link
Three load OBJ format: link

  • Additional Notes

A-FRAME: Starter link

HTML Canvas Optimization of Rendering Loop with JSAPI: link

English Version
Korean Version

update needed

Computational Designer at NJSTUDIO, and Software Engineer at ESRI

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store