Simple 3D Transforms

It would be great if I could rotate / move a 2d plane into the 3rd dimension, with correct perspective.

On the old Super Nintendo, there was a chip / api called Mode 7. Its what enabled games like FZero and the original Mario Cart to be made possible.

http://en.wikipedia.org/wiki/F-Zero

I believe the effect is achieved by mapping the full track on a 2D plane and rotating it to form the ground.

Do you guys think this would be possible? I dont expect a full 3D engine but if you could give us what the SNES could do I believe it will push the game edition in new directions.

Heres the mode 7 writeup http://en.wikipedia.org/wiki/Mode_7

Also when I said "simple" I obviously meant that for me, I realise that it wont be that simple for you guys!

Matthew

do you have some graphic plates we can play with?

Carlos

Hi Carlos

Not to hand, I would suppose they would need to be constructed to fit the engine.

From looking at some online examples you would either use 1 large texture with the whole track mapped on it or stitch a series of track elements together to form a longer, more curved track.

I have found an online example of the effect in flash and browser playable.

http://www.fastfroots.de/

This also discussed the effect in flash using actionscript

http://www.protopop.com/lab/actionscript/mode7/

This is the best track example I could find. Part of the effect is that the texture is not smoothed I believe and they run a different filter on it.

The resulting effect would look like this

Ive mocked up the provided track graphic in opengl (no smoothing) to demonstrate how the image when warped becomes the track

It could be useful if there is any kind of image transformation. Not just scaling and fading. With full image transformation i could write some demos to simulate some 3d stuff.

If I may second this suggestion:

Arbitrary setting of the 4 xy points of a quad (rect or image) would give enormous flexibility in processing images, backdrops, tiles etc.

absolutely, amazing things could be done with this simple functionality

I would love this to be implemented.

Not sure if this would work, but could use a webOverlay with CSS 3D transforms to display your background?

Check out this series covering CSS 3D-transformations:

http://www.eleqtriq.com/2010/05/understanding-css-3d-transforms/ Part 1

http://www.eleqtriq.com/2010/05/css-3d-matrix-transformations/ Part 2

Disclaimer: I have no idea how to implement this. I'm just throwing ideas out there...

Its possible if Ansca build in a distinct api like Nintendo did.

Complicated yes, but I think having that effect built in would provide a similar boost to Corona as did the original mode 7 for Nintendo. If you were around at the time you should recall the excitement about how a 2D system could simulate a 3D environment.

This is exactly what Corona needs, the competitive advantage.

There is a reason why you remember some of the most popular games on the SNES.

Pilot Wings
Axelay
Super Mario Cart
F Zero
The Star Wars games

They all used Mode 7

Matthew

want to help me implement it?

c

That would be awesome Carlos !

in Flash 7 they did it with scaled rectangles & masks (which Corona doesn't have), before there were any bitmap manipulation functions

some example sources here
http://www.gotoandplay.it/_articles/2006/09/mode7racing.php
http://www.gotoandplay.it/_articles/2004/11/mode7proto.php

j

Carlos, sure thing!

I will email you shortly with an idea or two ive been playing with.

If you dont get it let me know on here.

Matt

This should be high on priority list imo. Just imagine the games we could create using mode 7 :)

I think what you are talking about is not the raster technique used in the early racing games, it's more like the "shape transform" tool in Flash where you can freely move an images corners to "deform" it, isn't it?

If you could freely move the four corners of an image (and the image's content will always align to these four corners), all you need to do is to use some 3D rotation formula on those corners (from within LUA) to fake any 3D rotation on that object.

Carlos is looking into integrating some transformation functions at the moment, but no eta

I would say that yes, being able to deform a shape or rotate and move it in the z axis would allow the above game / style to easily be replicated

those flash versions just use lines of increasing height. plus a mask.

this code is from http://www.gotoandplay.it/_articles/2004/11/mode7proto.php

"pic" and "picPeke" are just top down versions of the track. ("picPeke" appears to be a blurred version presumably for distance)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
//======INI-createStrips========================================
//controla la creacion de los strips
function creaStrips() {
        var a = 1;
        var depth = 5;
        var grosor = 1;
        var multiply = 1.02;
        var factorScala = 5;
        var alturaStrip = 240/2;
        var acumula = grosor;
        //
        for (grosor=1; grosor<grosorFinal; grosor=grosor*multiply) {
                grosor = grosor*multiply;
                grosorFloor = Math.floor(grosor);
                //
                if (grosorFloor<2) {
                        strip = _root.attachMovie("picPeke", "pic"+a, depth);
                } else {
                        strip = _root.attachMovie("pic", "pic"+a, depth);
                }
                strip.pic._xscale = 100;
                strip.pic._yscale = 100;
                //posiciona
                strip._x = 200;
                //200
                strip._y = 400;
                //350
                //the ground is scaled only once, when created. not on every frame
                strip._xscale = a*grosor*factorScala;
                strip._yscale = a*grosor*factorScala;
                //end function
                mask = _root.attachMovie("mask", "mask"+a, (depth+1));
                mask._height = grosorFloor;
                mask._y = alturaStrip;
                strip.setMask(mask);
                //
                strip.onEnterFrame = function() {
                        //the pic is rotated, but the 'move' symbol inside the pic is what is moved.
                        this.pic._rotation = -_root.rotation;
                        this.pic.move._x += -_root.sinness;
                        this.pic.move._y += _root.cosness;
                };
                //
                alturaStrip = alturaStrip+grosorFloor;
                depth = depth+2;
                a++;
        }
        //end while
}
//======END-createStrips========================================

I did an experiment a while ago using lines of increasing height to get a background.

http://developer.anscamobile.com/forum/2010/08/22/simple-3d-texture-background

Its not great but proved something like that is possible.

I would have thought though that if its done in opengl by transforming a plane it would be a lot simpler to implement, 100% hardware accelerated and with a lot less overhead.

The real mode 7 used something similar with interrupts and the flash version relies on the computing power of a desktop.

we need openGL copyPixels ;)

views:2325 update:2011/9/19 9:18:26
corona forums © 2003-2011