Web based Digital Mapping, Data Visualization / 웹 베이스 디지털 매핑, 데이터 시각화
플레이리스트 link
✍️이런 걸 배워요!
GIS 데이터를 매핑할 수 있어요
데이터를 Canvas에 시각화 할 수 있어요
인터액티브 시각화를 할 수 있어요
Typescript 언어를 사용해요
HTML Canvas, ArcGIS JSAPI 등의 API를 사용해요
주제 소개 📝
빅데이터(Big Data), 혹은 GIS 들어 보셨나요? 지리정보시스템(Geographic Information System)으로서, 쉽게 설명해 위치 정보를 가지고 있는 데이터 시스템이라 볼 수 있어요. 위치 정보를 가지고 있는 이러한 데이터들은 어떻게 시각화를 하면 좋을까요? 디지털 매핑 워크숍을 통해 함께 공부해봐요!
웹(Web)에서, 여러분들만의 매핑 툴을 만들어 봐요! ArcGIS의 JSAPI를 이용해서 인터액티브 데이터 시각화를 공부할 수 있어요. 크리에이티브 코딩, 데이터 시각화, 매핑에 관심 있으신 분들에게 추천드립니다. JSAPI를 어떻게 활용할 수 있을지, HTML Canvas에 그림을 어떻게 그리는지, 인터액티브 시각화 혹은 매핑에 대해서 공부해 봐요! 나중에 관련된 예제들도 업데이트 예정입니다.
왜 배워야 하는지 ✒️
4차 산업 혁명은 디자인 영역에도 큰 변화를 가져옵니다.
특별히 디자이너들이 디자인 데이터를 접근하고 활용하는 방법에 대해서 학습할 수 있습니다.
크리에이티브 코팅, 컴퓨테이셔널 디자이너, 데이터 시각화 전문가로 커리어를 쌓고 싶으신 분들께 추천드려요.
이 강의에서 배우는 것들 ✏️
도시 정보를 시각화 시키고 싶으신 분들
인터액티브 시각화 앱을 만들 수 싶으신 분들
데이터를 통한 크리에이티브 코딩을 공부하고 싶으신 분들
강의 수강 꿀팁!
🎓이런 분들께 추천드려요!
건축 혹은 3D 디자이너 중, 코딩을 공부하고 싶으신 분들
컴퓨테이셔널 디자인을 공부하고 싶은신 분들
컴퓨테이셔널 지오메트리를 공부하고 싶으신 분들
라이노와 그라스하퍼를 코딩으로 제어하고 싶으신 분
📚 선수 지식, 필요한가요?
Javascript
강의수준
입문 / 초급 / 중급 이상
Mapping Workshop 01, Introduction / 시작하면서-link
00:21 - 오늘의 주제 Mapping / Data Visualization
00:53 - 도시재생, 도시 디자인(Urban design), 도시 분석...
01:32 - Web-based data visualization, 그리고 기술 설명(Typescript, ArcGIS JSAPI)
Mapping Workshop 02, Basic Code Structure / 코드 구조 - link
00:00 - Github 소개
01:20 - IDE(개발 환경), Visual studio code
03:29 - 실행하기
04:01 - 코드 구조 설명
05:18 - Sandbox main 클래스 설명
06:00 - 프로젝션(Projection) 설명
...............................................
06:57 - 렌더러(Renderer) 설명
07:34-! 중요한 부분 - 우리가 수정해야 영역
10:54 - 포인트 만들기
16:29 - 마무리
Mapping Workshop 03, US ZIP Data Visualization - link
00:00 - 오늘의 주제: US Zip
00:21 - 데이터 설명
00:53 - 랜더러(Renderer) 세팅
05:06 - 데이터 출력
05:36 - 지도 위치 설정 (setting zoom and extent)
06:19 - 데이터로 포인트 만들기
07:28 - 프로젝션(Projection)
09:34 - 랜더러(Renderer) 수정
10:22 - 포인트 데이터 줄이기
12:56 - 나머지 연산자(Modulus Operator)
14:26 - 랜더러(Renderer): 컬러(Color) 수정
18:16 - 요약
Introduction to Mapping Sandbox for Mapping & Data Vis on Web - 한국어 - link
ArcGIS JSAPI를 활용한 매핑 Sandbox입니다! HTML Canvas를 사용합니다. 즉 웹(Web)에서, 여러분들만의 매핑 툴을 만들어 봐요!
00:00 - 오늘의 주제: 매핑 시각화 업데이트
00:15 - GitHub 그리고 설치 설명!
01:55 - ArcGIS JSAPI
02:45 - Visual Studio Code
03:18 - 노드 패키지 매니저, NPM
..............
05:39 - 코드 설명!
06:41 - 구조/패턴 설명
08:45 - 맵뷰 이벤트 / MapView Event
09:54 - 캔버스/ HTML Canvas
12:36 - 마우스 이벤트 / Mouse Event
16:03 - 프로젝션 / Projection
..............
17:50 - 예제 설명!
19:00 - 다른 예제 설명!
19:37 - HTML Canvas API 설명
..............
21:13 - Point class 설명
21:45 - Vector class 설명
24:16 - 과제
..............
28:35 - 마무리
Coming soon...
Geometry Polyline / Area
Visualizing GeoJson
Bin System for data visualization
Clustering Points: Collision-Based Dynamic Graph method
'Workshop Index' 카테고리의 다른 글
[Workshop]건축 애니메이션 (3ds max & AfterEffect), architectural-animation-visualization (0) | 2021.02.05 |
---|---|
[book]architectural representation animation / 건축 영상 프레젠테이션 (0) | 2021.02.04 |
AI and Data for design / 디자이너를 위한 인공지능 (0) | 2021.01.16 |
Episode A [한국어]Rhino Python / 라이노 파이썬 / 디자인 & 컴퓨테이션 (0) | 2021.01.15 |
[한국어]Python For Designers / 디자이너를 위한 파이썬 (0) | 2020.12.31 |