List of features and ideas to incorporate into the player experience.

• Rag-Doll Body Physics: http://schteppe.github.com/ammo.js-demos/demos/RagdollDemo/three.html

Description:

Parallel.js is a tiny library for multi-core processing in Javascript. It was created to take full advantage of the ever-maturing web-workers API. Javascript is fast, no doubt, but lacks the parallel computing capabilites of its peer languages due to its single-threaded computing model. In a world where the numbers of cores on a CPU are increasing faster than the speed of the cores themselves, isn't it a shame that we can't take advantage of this raw parallelism?
Parallel.js solves that problem by giving you high level access to multicore processing using web workers. It runs in your browser (as long as it supports web workers). Check it out.

http://adambom.github.com/parallel.js/

I recommend reading this as it will be beneficial on all fronts.
http://www.isaacsukin.com/news/2012/06/how-build-first-person-shooter-browser-threejs-and-webglhtml5-canvas

The roads are being draw to the scene as Line object; See http://mrdoob.github.com/three.js/docs/57/#Reference/Objects/Line
This creates the problem that the line for the roads appear to be drawn on the canvas upwards/vertical, instead of as a road should be, horizontally.

Solution is to use create a geometric object in the form of a rectangle with all of the Vector points defined precisely.

TODO:

• Flatten roads using rectangles.
• Blend rectangles together such that the roads are fluid and can curve/turn and not be choppy and be thinner than the desired road thickness.

Three.js is becoming seemingly unresponsive on start up because of the loading of the scene:

A script on this page may be busy, or it may have stopped responding. You can stop the script now, or you can continue to see if the script will complete.
Script: https://raw.github.com/mrdoob/three.js/master/build/three.js:22263

Possible fixes would be splitting up the chronological and long scene-building task into many parallel tasks using Parallel.js, etc.

Interactive objects for the player.

• Cars
• Arial-vehicles, such as Jets, Planes, Helicopters.

See tutorial on Sports Car in WebGl: http://learningthreejs.com/blog/2012/05/21/sport-car-in-webgl/
See the following for a city and helicopter example: http://alteredqualia.com/three/examples/webgl_city.html

Using the camera.position you can place the player's camera at any position, and fairly easily. What is not easy is using camera.lookAt because you must specify a point that the player's camera is looking at -- which is difficult, as there really is no absolute point. However, this can be calculated by simply imaging the lookAt point on an imaginary sphere around the camera.position. For varying mouse-speeds you can imagine a sphere with a larger/smaller radius.

Example project with code with draggable camera views:
http://www.mrdoob.com/projects/voxels/#A/

Take a look at ViziCities: http://vizicities.com/
And here is there first dev diary: http://rawkes.com/articles/vizicities-dev-diary-1

It is almost exactly what this project is, OpenStreeMaps, WebGl, Three.Js, and all! However, this project can be more, in the application of an ever expanding interactive gaming environment.

Thoughts?

https://github.com/derderderist/XMLtoJSON

I recommend using the following repo for window resize events: https://github.com/louisremi/jquery-smartresize

See repo: http://chandlerprall.github.com/Physijs/

Tutorial: http://learningthreejs.com/blog/2012/06/05/3d-physics-with-three-js-and-physijs/

Use OpenWeatherMap for retrieving weather data: http://openweathermap.org/api

• Clouds: See demo for Three.js clouds: http://www.mrdoob.com/#/131/Clouds
• Rain: Possible implementation of rain through a Three.js particular system: http://www.aerotwist.com/tutorials/creating-particles-with-three-js/
• Lightening.
• Surrounding custom environment: http://aerotwist.com/tutorials/create-your-own-environment-maps/

It would be nice, at least for testing and debugging purposes to have a floating text label of what street is just below. That way, navigating from known location to another location and tracking how successful it was displayed can be qualitatively, but precisely, determined.

Initially only use the vertices given from the Open Street Maps data and then a fixed height for all building walls. Worry about realistic / dynamic buildings later, once more data is accumulated.

• Add Buildings to Scene (with fixed height)
• Roofs
• Lighting
• Shadows

What little details should we include in the future?

• Grass, example: http://webglsamples.googlecode.com/hg/field/field.html
• Water / Lakes / Oceans / etc: http://wiki.openstreetmap.org/wiki/Tag:natural%3Dwater
• Garbage cans
• Trees
• Stop Signs/Lights in road intersections
• Road Signs
• Sky

Open Street Maps is user generated, so why now allow users of this game to edit and add map data while playing!

http://wiki.openstreetmap.org/wiki/Getting_Involved

tQuery description:

tQuery API : three.js + jQuery
Three.js Power + jQuery API Usability
tQuery API is a thin library on top of three.js It is an extension system for people to write > plugins. To help them share their code and build on top of each other. It mimics jquery api, > well know for its usuability. tQuery API aims for "it should not be harder than playing with > lego bricks."

See http://jeromeetienne.github.com/tquery/
Tutorials: http://learningthreejs.com/blog/categories/tquery/