Voxel Spacing

Après quelques heures de développement voici une petite experience en javascript qui utilise le canvas et ImageData. Vous trouverez plus d'info sur

ps. pour la capture d'écran j'ai tricher un peux, il s'agit d'une résolution ou la demo n'est pas vraiement fluide...

tags >> annonce, javascript permalink >>commentaires >> ajout

e-mail ou homepage:
Sylvain GardenGénial. Je suggère de changer la résolution dynamiquement : low pendant les déplacements, high en immobile... comme le font certains appli Flash.
SelimMerci Sylvain c'est une très bonne idée! Je vais tenter d'implémenter ça dés que j'ai un peu de temps...
francisHey man. That is excellent. I didn't know that you could implement double buffering like that. You've sped up my canvas game 2X. Thanks :)
RocketCool stuff ;-)

Try to modify your experiment and code and added some features:
- better antialising
- water level
- ground detection (little bit buggy)
- beautifying the landscape terrain gfx
- water waves simulation (basic)

And used this for a bumpmapped terrain :

Rather poor frame rates, but acceptable on a dual core ;-) Best with Chrome 9/10 (beta) or FF 4.0 (beta)

Experiments will be continued ;-)
blakeI used an old technique that was useful back in the 1980s, and seems to be useful again now because I was able to get a 10 FPS boost in your program. How I did it:

var precalcLookup = function () {
var lookup = [];
for (var j = 0; j < constants.screen.height; j++) {
lookup[j] = (j * constants.screen.width);
return lookup;

Then replace the renderer with:

var calc = 0;
for (var j = (constants.screen.height - screenProjectedTop); j > fillGoal; j--) {
calc = (i+lookupTable[j])*4;
image[calc] = Math.ceil(renderCache.r);
image[calc+1] = Math.ceil(renderCache.g);
image[calc+2] = Math.ceil(renderCache.b);
image[calc+3] = 255;

Note: If you don't use the lookup table it drops down to 28 - 33 FPS in IE for example. But, with the lookup table it sits around 40 - 50 FPS. You should do this for all calculations, I only bothered with this one location.
blakeCode is here:

Images for the terrain texture and heightmap are here:

Here are a couple of screenshots of my rework of the code I was able to hit 125 FPS on regular quality, and on the higher one I hit around 25 FPS. I also added some more info to the screen like avgfps,min,max,etc... and I've fine tuned a lot of the code to reduce calculations done...:,wC8Ktad#0,wC8Ktad#1
liste des tags