TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

How to build a procedural city in WebGL

121 pointsby jetienne2almost 12 years ago

7 comments

ianterrellalmost 12 years ago
I always liked this procedurally generated nighttime cityscape by Shamus Young: <a href="http://www.youtube.com/watch?feature=player_embedded&amp;v=-d2-PtK4F6Y" rel="nofollow">http:&#x2F;&#x2F;www.youtube.com&#x2F;watch?feature=player_embedded&amp;v=-d2-P...</a><p>He wrote a whole article series walking you through it, plus source, etc, starting here: <a href="http://www.shamusyoung.com/twentysidedtale/?p=2940" rel="nofollow">http:&#x2F;&#x2F;www.shamusyoung.com&#x2F;twentysidedtale&#x2F;?p=2940</a>
评论 #6181977 未加载
评论 #6180546 未加载
评论 #6180855 未加载
petercooperalmost 12 years ago
I love practical walkthroughs like this. And in this case, as someone with not much OpenGL or 3D experience, it&#x27;s good to reach an outcome that I can then go back and tweak. The GLSL Sandbox, behind the Mr Doob demo, I believe(?) is good for this stuff, especially as you can edit in the browser: <a href="http://glsl.heroku.com/" rel="nofollow">http:&#x2F;&#x2F;glsl.heroku.com&#x2F;</a><p>Along related lines, I saw a similar tutorial yesterday on creating a synth using the Web Audio API: <a href="http://noisehack.com/how-to-build-monotron-synth-web-audio-api/" rel="nofollow">http:&#x2F;&#x2F;noisehack.com&#x2F;how-to-build-monotron-synth-web-audio-a...</a>
gsneddersalmost 12 years ago
I&#x27;d much rather see such a tutorial about how to do this without Three.js — this high level, you&#x27;re not &#x2F;really&#x2F; doing anything with WebGL directly. It&#x27;s like a tutorial for the DOM just going, &quot;so, we&#x27;re going to use jQuery&quot;.
评论 #6180968 未加载
评论 #6180836 未加载
derefralmost 12 years ago
I guess I&#x27;m a bit spoilt, but these days I kind of expect &quot;procedural&quot;, in graphics demos, to also imply &quot;infinite in all directions, without repetition, with deterministic results in regard to position, generated in real-time, and without caching anything you&#x27;re not currently looking at.&quot; Maybe I&#x27;m too picky...<p>But it shouldn&#x27;t be much harder in this case! Layer some octaves of simplex-noise to form a terrain, and then for any non-occluded map region, &quot;grow&quot; a building from the center of each noise feature. Might be possible to only tell the GPU about the terrain-texture, and create the buildings entirely in a shader, actually.
评论 #6181363 未加载
评论 #6179156 未加载
babuskovalmost 12 years ago
Buildings of similar height all look the same. I guess adding some variation like 2 or 3 different building textures would make it look like a real city.
评论 #6178766 未加载
mistercowalmost 12 years ago
That&#x27;s really cool. The main thing it&#x27;s missing is roads in between the buildings (or at least space where the roads would go).
AsymetricComalmost 12 years ago
That best thing about DSLs is that you don&#x27;t have to use the current domain.