Mountains Drawn with Vertical Lines | VoxelSpace
Mountains, drawn column by column. This revised cut opens with the separated-column view, then explains the two maps behind the flyover.
Two maps become a flyover of mountains.
VoxelSpace reads a height map and a color map, projects each sampled height into a screen column, and paints a vertical line in that map color. Its browser renderer works from near to far, keeps the highest visible position for each column, and takes wider steps in the distance.
The output is a terrain view from the chosen camera, useful for exploring retro flight visuals and learning height-map rendering. It is a 2.5D method: each map position has one height. The color map already carries the lighting and shadows.
The terrain views here were rendered by the original VoxelSpace.html using our own maps and camera path. We added the map diagrams, separated-column illustration, captions, and the flat-triangle comparison; that comparison is our explanatory drawing. The project's “under twenty lines” description refers to its simplest core example, not the full browser application.
지도 두 장이 산 위를 나는 장면이 됩니다.
VoxelSpace는 높이 지도와 색 지도를 읽고, 각 점의 높이를 화면의 세로줄에 투영한 뒤 그 점의 색으로 세로선을 그립니다. 웹 데모는 가까운 곳부터 먼 곳으로 진행하며 세로줄마다 이미 보이는 가장 높은 위치를 기록하고, 멀리 갈수록 지도에서 읽는 줄의 간격을 넓힙니다.
이렇게 선택한 카메라 시점의 지형 화면을 만듭니다. 레트로 비행 장면을 실험하거나 높이 지도 렌더링을 배우는 데 살펴볼 수 있어요. 지도 한 위치에 높이가 하나인 2.5D 방식이며, 빛과 그림자는 색 지도에 미리 칠해 둡니다.
영상의 지형 화면은 원본 VoxelSpace.html에 직접 만든 지도와 카메라 경로를 넣어 그렸습니다. 지도 설명 그림, 벌려 놓은 세로줄, 자막과 단색 삼각형 비교 그림은 별도로 만들었어요. ‘스무 줄 미만’은 가장 단순한 핵심 알고리즘 예제를 뜻하며 웹 앱 전체의 길이는 아닙니다.
VoxelSpace by Sebastian Macke · MIT (software)
Source: github.com/s-macke/VoxelSpace/tree/60d7ae12f232f9…
Copyright (c) 2017 Sebastian Macke
Full software license: github.com/s-macke/VoxelSpace/blob/60d7ae12f232f9…
Terrain maps and explanatory visualizations: index.opensource
The terrain maps in this video were created for this episode. The repository's Comanche game maps and game imagery were not used. The repository explicitly excludes its bundled game maps from the MIT license.
이 영상의 지형 지도와 설명용 시각화는 직접 만들었습니다. 저장소의 Comanche 게임 지도와 게임 이미지는 사용하지 않았으며, 해당 지도는 MIT 라이선스 대상이 아닙니다.
#VoxelSpace #opensource #computergraphics
[ko] 세로선으로 그리는 산 | VoxelSpace
Mountains, drawn column by column. This revised cut opens with the separated-column view, then explains the two maps behind the flyover.
Two maps become a flyover of mountains.
VoxelSpace reads a height map and a color map, projects each sampled height into a screen column, and paints a vertical line in that map color. Its browser renderer works from near to far, keeps the highest visible position for each column, and takes wider steps in the distance.
The output is a terrain view from the chosen camera, useful for exploring retro flight visuals and learning height-map rendering. It is a 2.5D method: each map position has one height. The color map already carries the lighting and shadows.
The terrain views here were rendered by the original VoxelSpace.html using our own maps and camera path. We added the map diagrams, separated-column illustration, captions, and the flat-triangle comparison; that comparison is our explanatory drawing. The project's “under twenty lines” description refers to its simplest core example, not the full browser application.
지도 두 장과 세로선으로 산을 그립니다.
높이 지도와 색 지도를 읽어 지형을 그리는 VoxelSpace를 살펴보세요. 이번 편집은 세로줄이 벌어지는 결과 화면부터 시작합니다. 지형 화면은 원본 렌더러에 직접 만든 지도와 카메라 경로를 넣어 만들었고, 설명 그림은 별도로 제작했습니다.
VoxelSpace · Sebastian Macke · MIT (코드)
github.com/s-macke/VoxelSpace/tree/60d7ae12f232f9…
github.com/s-macke/VoxelSpace/blob/60d7ae12f232f9…
Copyright (c) 2017 Sebastian Macke
지형 지도 및 설명 시각화: index.opensource
저장소의 Comanche 게임 지도와 게임 이미지는 사용하지 않았습니다. 해당 지도는 MIT 대상이 아닙니다.
74 likes · 1 comment · 1,928 views
Mentions
i think i struck gold github.com/s-macke/Abstruse-Goose-Archive/blob/ma…
Mountains Drawn with Vertical Lines | VoxelSpace Mountains, drawn column by column. This revised cut opens with the separated-column view, then explains the two maps behind the flyover. Two maps become a flyover of mountains. VoxelSpace reads a height map and a color map, projects each sampled height into a screen column, and paints a vertical line in that map color. Its browser renderer works from near to far, keeps the highest visible position for each column, and takes wider steps in the distance. The output is a terrain view from the chosen camera, useful for exploring retro flight visuals and learning height-map rendering. It is a 2.5D method: each map position has one height. The color map already carries the lighting and shadows. The terrain views here were rendered by the original VoxelSpace.html using our own maps and camera path. We added the map diagrams, separated-column illustration, captions, and the flat-triangle comparison; that comparison is our explanatory drawing. The project's “under twenty lines” description refers to its simplest core example, not the full browser application. 지도 두 장이 산 위를 나는 장면이 됩니다. VoxelSpace는 높이 지도와 색 지도를 읽고, 각 점의 높이를 화면의 세로줄에 투영한 뒤 그 점의 색으로 세로선을 그립니다. 웹 데모는 가까운 곳부터 먼 곳으로 진행하며 세로줄마다 이미 보이는 가장 높은 위치를 기록하고, 멀리 갈수록 지도에서 읽는 줄의 간격을 넓힙니다. 이렇게 선택한 카메라 시점의 지형 화면을 만듭니다. 레트로 비행 장면을 실험하거나 높이 지도 렌더링을 배우는 데 살펴볼 수 있어요. 지도 한 위치에 높이가 하나인 2.5D 방식이며, 빛과 그림자는 색 지도에 미리 칠해 둡니다. 영상의 지형 화면은 원본 VoxelSpace.html에 직접 만든 지도와 카메라 경로를 넣어 그렸습니다. 지도 설명 그림, 벌려 놓은 세로줄, 자막과 단색 삼각형 비교 그림은 별도로 만들었어요. ‘스무 줄 미만’은 가장 단순한 핵심 알고리즘 예제를 뜻하며 웹 앱 전체의 길이는 아닙니다. VoxelSpace by Sebastian Macke · MIT (software) Source: github.com/s-macke/VoxelSpace/tree/60d7ae12f232f9… Copyright (c) 2017 Sebastian Macke Full software license: github.com/s-macke/VoxelSpace/blob/60d7ae12f232f9… Terrain maps and explanatory visualizations: index.opensource The terrain maps in this video were created for this episode. The repository's Comanche game maps and game imagery were not used. The repository explicitly excludes its bundled game maps from the MIT license. 이 영상의 지형 지도와 설명용 시각화는 직접 만들었습니다. 저장소의 Comanche 게임 지도와 게임 이미지는 사용하지 않았으며, 해당 지도는 MIT 라이선스 대상이 아닙니다. #VoxelSpace #opensource #computergraphics [ko] 세로선으로 그리는 산 | VoxelSpace Mountains, drawn column by column. This revised cut opens with the separated-column view, then explains the two maps behind the flyover. Two maps become a flyover of mountains. VoxelSpace reads a height map and a color map, projects each sampled height into a screen column, and paints a vertical line in that map color. Its browser renderer works from near to far, keeps the highest visible position for each column, and takes wider steps in the distance. The output is a terrain view from the chosen camera, useful for exploring retro flight visuals and learning height-map rendering. It is a 2.5D method: each map position has one height. The color map already carries the lighting and shadows. The terrain views here were rendered by the original VoxelSpace.html using our own maps and camera path. We added the map diagrams, separated-column illustration, captions, and the flat-triangle comparison; that comparison is our explanatory drawing. The project's “under twenty lines” description refers to its simplest core example, not the full browser application. 지도 두 장과 세로선으로 산을 그립니다. 높이 지도와 색 지도를 읽어 지형을 그리는 VoxelSpace를 살펴보세요. 이번 편집은 세로줄이 벌어지는 결과 화면부터 시작합니다. 지형 화면은 원본 렌더러에 직접 만든 지도와 카메라 경로를 넣어 만들었고, 설명 그림은 별도로 제작했습니다. VoxelSpace · Sebastian Macke · MIT (코드) github.com/s-macke/VoxelSpace/tree/60d7ae12f232f9… github.com/s-macke/VoxelSpace/blob/60d7ae12f232f9… Copyright (c) 2017 Sebastian Macke 지형 지도 및 설명 시각화: index.opensource 저장소의 Comanche 게임 지도와 게임 이미지는 사용하지 않았습니다. 해당 지도는 MIT 대상이 아닙니다.