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.

ViziCities Dev Diary #1: Visualising Cities in 3D using WebGL

196 pointsby robhawkesabout 12 years ago

21 comments

aw3c2about 12 years ago
&#62; If I'm to be honest, after compiling and writing this entry I'm actually in a state of disbelief about how much we've managed to get done in such a short space of time.<p>That is the magic of having and utilising the power of free and open-source software. Imagine not having three.js, QGIS, PostGIS etc.<p>Gorgeous work and a highly interesting "how we are doing it" insight. Thanks! Please more!
评论 #5389326 未加载
chimeabout 12 years ago
&#62; Unfortunately, in our efforts for global domination we quickly discovered the performance limitations of the project as it stood, as well as my personal knowledge with Three.js and WebGL. In short, the expanded version of London ran at a horrible 20–40fps depending on the system you viewed it on.<p>You got a lot farther than me when I tried Three.js before hitting performance problems. I was trying to make a WebGL 3d warehouse visualization app: <a href="http://chir.ag/projects/wh/" rel="nofollow">http://chir.ag/projects/wh/</a> and stopped because it was too slow once I loaded 1000 bins. I also never quite figured how to handle rotation/panning nicely (src: <a href="http://chir.ag/projects/wh/main.js" rel="nofollow">http://chir.ag/projects/wh/main.js</a>). I came up with a shorthand <a href="http://chir.ag/projects/wh/bins/wh.txt" rel="nofollow">http://chir.ag/projects/wh/bins/wh.txt</a> that expands to <a href="http://chir.ag/projects/wh/bins/bins.php" rel="nofollow">http://chir.ag/projects/wh/bins/bins.php</a> - I was going to make it an easy to use app where you could describe how the warehouse was organized with 20-30 lines of bin#s and positions and let the system generate the rest. Then it could parse APIs containing various properties per bin (full/empty, inventory amount, frequency of usage, days-since-last-used etc.) Clicking on any bin would open up a panel with more information and you'd have filtering/highlighting capability for the whole warehouse.<p>I made good progress initially but got busy with life and never got around to solving the too-many-bins problem. I still don't know how to improve the performance. Even when entire objects are outside the view, they still take up resources and time. I see you mentioned LOD support in Three.js - no idea if it would help me or not because each object is already as simple as it can be - just a box.<p>If someone wants to hack on this and make it functional, I'll help however I can.
评论 #5391830 未加载
评论 #5389434 未加载
评论 #5392071 未加载
rurounijonesabout 12 years ago
My god, that is amazing and wonderful.<p>You should be hired by the uk.gov team to work on this full-time.<p>This, combined with various statistical information (crime, traffic, other stuff from the ONS) would be a huge boon to anyone using it and the interface makes it beginner friendly.
评论 #5389707 未加载
arpinehabout 12 years ago
I would love to see more details about this.<p>How did you implement your data path from getting GIS data (shapefiles I presume) to PostGIS then GeoJSON and finally into ThreeJS?<p>What about combining the statistical data with the location?<p>And the heatmap/choropleth, is that something Three.js can do?<p>I have no knowledge of developing 3D stuff, but I have been looking into using D3 with canvas rendering just for this kind of visualizations. I'm playing with multidimensional data as stacked 3D cubes. So, getting something like this would really bootstrap my project to another level. Any thoughts about open sourcing?<p>In all, this looks very useful and expendable. The sky is the limit. Literally, when is sky coming? ;)
评论 #5390741 未加载
dirkk0about 12 years ago
I am working on something similar with the prospect of getting CannonJS physics to work so that one can walk the city (in my case procedurally generated): <a href="https://twitter.com/dirkk/status/309024330115842049" rel="nofollow">https://twitter.com/dirkk/status/309024330115842049</a><p>I also tried a multi-device approach for visualisation: <a href="http://www.youtube.com/watch?v=-TiZzovx5YE" rel="nofollow">http://www.youtube.com/watch?v=-TiZzovx5YE</a><p>Any chance of collaboration?<p>From this thread I reckon there are quite a few people working on something similar. I guess it would be extremely cool if we could join forces.
评论 #5390748 未加载
skoreabout 12 years ago
Crossing my fingers <i>real</i> hard for somebody to pick this up eventually to make a no-nonsense FOSS SimCity clone out of this. Please, please, please.
评论 #5391129 未加载
评论 #5389655 未加载
AndyBMapManabout 12 years ago
The Ordnance Survey doesn't even hold height data on all buildings in the UK. They've started a few isolated projects but nothing as a deliverable dataset yet. I don't think there's a US equivalent despite your link to NYC Open Data.<p>You might want to look to Germany and CityGML. You might discover some town datasets that are complete in height and geometry detail.<p>If you happen on a LIDAR data source you've then got to tidy up against the buildings but you will run into errors caused by the time spent between the two data capture points. There's SRTM but i'm sure it'll be too coarse for your needs. I'm sure there's a replacement to SRTM but the name escapes me.<p>There's LandXplorer - now owned by Autodesk which will generate models from oblique aerial photogrammetry. There's also CityEngine that'll create fake cities based upon road networks.<p>@AndyBMapMan.
评论 #5391135 未加载
bvdbijlabout 12 years ago
Wow, very interesting, this tickles my fancy... Imagine something like this but with an airfield, you could model the airfield and every airplane landing and getting up in real-time.
评论 #5389663 未加载
gmacabout 12 years ago
Looks awesome.<p>The Kinect could be a fun way to explore your visualizations -- seen here hooked up to Google Earth: <a href="https://github.com/jawj/pigeonsim" rel="nofollow">https://github.com/jawj/pigeonsim</a><p>Also, I'm sure <a href="http://www.bartlett.ucl.ac.uk/casa" rel="nofollow">http://www.bartlett.ucl.ac.uk/casa</a> would love to hear from you.
评论 #5389491 未加载
chinchangabout 12 years ago
Its really inspiring to go through the dev stages you guyz went through while building it. Thanks for sharing :)
评论 #5389126 未加载
ameenabout 12 years ago
Excellent! Love the blog post. And ViziCities already looks beautiful. I can only imagine how wonderful it's going to be once a lot more vectors (population, vehicles, weather, energy, etc) are added in.<p>Would a simulation component be added in? Cause if it is, It'll be nothing short of awesome.<p>All the best!
评论 #5389403 未加载
olalondeabout 12 years ago
If you haven't already, you guys should absolutely get some inspiration from Baidu's amazing 3D city maps. <a href="http://j.map.baidu.com/m8vSh" rel="nofollow">http://j.map.baidu.com/m8vSh</a>
评论 #5390813 未加载
rohernabout 12 years ago
This is a terrific blog post. Excellent project and excellent sharing. I feel like we have a lot of games set in real world cities to look forward to. Also: autonomous vehicle pathing?
评论 #5389327 未加载
LAMikeabout 12 years ago
This is amazing! It was cool to see the process of turning data points into a 3d city.. Combine this with the Occulus Rift and the Singularity won't be that far away :)
评论 #5389710 未加载
n3rdyabout 12 years ago
Are those clouds I see in that blurred image?<p>Are you teasing us with the prospect of 3d weather (perhaps by using radar data)?<p>If not that's cool, but if so, great idea.
评论 #5390743 未加载
a_n_onymousabout 12 years ago
FWIW, Nokia L&#38;C does not have "massive development teams" working on HTML5 visualization of geo-data, quite the opposite...
评论 #5390758 未加载
Tychoabout 12 years ago
This should be used as some sort of case study in CS/IT courses. "How to be incredibly friggin' awesome."
评论 #5390752 未加载
madlagabout 12 years ago
Really amazing to get this after only one month, when you know how difficult is building 3D stuff !
评论 #5389669 未加载
kmfrkabout 12 years ago
You guys are friggin' wizards.
评论 #5389377 未加载
superqdabout 12 years ago
Great project. Looks really nice.
评论 #5393245 未加载
matthojoabout 12 years ago
Beautiful.
评论 #5389118 未加载