Camera isometric view [SOLVED]

Hello, I'm a new user with Jme.



I want making a game in 2D isometric view. My idea for use a 3d Engine , it's easier for making animation with pipeline 3d than with thumbnails bitmaps 2d (Too much images and more time).





In my game, i need a camera with isometric view. My cam never move.



I try make a little application  for display just a box in Isometric view. My viewport must have this dimension :800 by 400.



I try with this code :




  @Override
    protected void initSystem() {
        try {
            display = DisplaySystem.getDisplaySystem(settings.getRenderer());
            display.createWindow(800,400,32,60, false);

            camera = display.getRenderer().createCamera(800, 400);
  
        } catch (JmeException e) {
                    e.printStackTrace();
                    System.exit(1);
        }

        display.getRenderer().setBackgroundColor(ColorRGBA.white);

        // initialize the camera
        camera.setParallelProjection(true);
        float aspect = (float) display.getWidth() / display.getHeight();
        camera.setFrustum( -100, 1000, -50 * aspect, 50 * aspect, -50, 50 );
  
        Vector3f loc = new Vector3f(50.0f, 50.0f, 50.0f);
        Vector3f left = new Vector3f(-1.0f, 0.0f, 0.0f);
        Vector3f up = new Vector3f(0.0f, 1.0f, 0.0f);
        Vector3f dir = new Vector3f(0.0f, 0.0f, -1.0f);

        // Move our camera to a correct place and orientation.
        camera.setFrame(loc, left, up, dir);

        /** Signal that we've changed our camera's location/frustum. */        
        camera.update();

        /** Get a high resolution timer for FPS updates. */
        timer = Timer.getTimer();

        display.getRenderer().setCamera(camera);

        KeyBindingManager.getKeyBindingManager().set("exit",
                        KeyInput.KEY_ESCAPE);

    }

    @Override
    protected void initGame() {
        scene = new Node("baseTiledMap");

        box = new Box("Box numero uno", new Vector3f(0,0,0),5,5,5);
        box.setSolidColor(ColorRGBA.red);
        box.setModelBound(new BoundingBox());
        box.updateModelBound();
        scene.attachChild(box);

        AxisRods ar = new AxisRods("rods", true, 10.0f);
        scene.attachChild(ar);

        this.buildLighting();
        
        // update the scene graph for rendering
   scene.updateGeometricState(0.0f, true);
   scene.updateRenderState();

    }



But the renderer is not good  :'(.  I try change loc , left, up , dir  for a good position of the cam but i have nothing at the screen or the renderer not look like this screenshot in attachment.

With a modeler software to view objects in isometric view , you position the camera In the top view at the left of origin. The target on the origin , you rotate the camera of 45

try this:


import com.jme.app.SimpleGame;
import com.jme.bounding.BoundingBox;
import com.jme.math.FastMath;
import com.jme.math.Quaternion;
import com.jme.math.Vector3f;
import com.jme.renderer.ColorRGBA;
import com.jme.scene.CameraNode;
import com.jme.scene.Node;
import com.jme.scene.shape.AxisRods;
import com.jme.scene.shape.Box;
import com.jme.scene.state.MaterialState;

public class TestIsometricView extends SimpleGame {

   /**
    * @param args
    */
   public static void main(String[] args) {
      new TestIsometricView().start();

   }

   private Box box;

   @Override
   protected void simpleInitGame() {
      input.removeAllFromAttachedHandlers();

      // setupCamProperties
      cam.setLeft(Vector3f.UNIT_X);
      cam.setUp(Vector3f.UNIT_Y);
      cam.setDirection(Vector3f.UNIT_Z);
      cam.setLocation(new Vector3f(0, 0, -100));
      cam.setDirection(new Vector3f(0, 0, 1));
      cam.update();

      // Attach the Cam to a CamNode to be able to handle it like a Node, and
      // set its location to Z-100
      CameraNode camNode = new CameraNode("camNode", cam);
      camNode.setLocalTranslation(0, 0, -100);
      camNode.updateGeometricState(0, true);
      camNode.updateWorldData(0);

      // Then create a node in the origin, which is responsible for the
      // rotation around the origin.
      // and set the 45

Thanks you so much . It's exactly what i want  ! I love you man  :smiley:

no problem :wink:

was about 5min of my time…



the rotation-math with quaternions is quite hard in the beginning.

you really have to care about the nodestructure and the order of the rotations.

Btw… welcome on board :wink:



and you may add a [solved] to the topic of your first post, just to indicate it for others

Oups It's not really what i want  :// .



Your code It's a perspective view for classic 3d game . I need a 2d isometric view .



Definition :

Isometric projection is a form of graphical projection, more specifically, a form of axonometric projection. It is a method of visually representing three-dimensional objects in two dimensions, in which the three coordinate axes appear equally foreshortened and the angles between any two of them are 120 degrees.

As with all types of parallel projection, objects drawn with axonometric projection do not appear larger or smaller as they extend closer to or away from the viewer.




I think,  i must use  this method :

camera.setParallelProjection(true);





But now with activate parallel projection , the renderer is not good.





P.S : Thanks  8)

sorry, my fault…

true, true, a isometric view is a parallel view.

then just replace the cam initialization with this…


protected void simpleInitGame() {
input.removeAllFromAttachedHandlers();
cam.setParallelProjection(true);
float aspect = (float) display.getWidth() / display.getHeight();
cam.setFrustum(-100, 1000, -50 * aspect, 50 * aspect, -50, 50);
cam.update();
// setupCamProperties
cam.setLeft(Vector3f.UNIT_X);
cam.setUp(Vector3f.UNIT_Y);
cam.setDirection(Vector3f.UNIT_Z);
cam.setLocation(new Vector3f(0, 0, -100));
cam.setDirection(new Vector3f(0, 0, 1));
cam.update();
.
.
.

Back , It's me again  :smiley:



Why this lignes in your code change nothing ?  I try to move the camera more closer of the origin because my model(.obj) is too little .



I not understad why this lines change nothing to comment or no.



Maybe it's about the ParallelProjection ? can you explain me please ?



cam.setLocation(new Vector3f(0, 0, -100));
cam.setDirection(new Vector3f(0, 0, 1));

camNode.setLocalTranslation(0, 0, -100);



Thanks

the problem is, that in parallel mode the zoom/location of the cam is fix.

you can't move the camera's position… what you have to do instead is to alter the frustumvalues.



i updated the testcase, use NUM+ and NUM- to zoom in/out


package com.pass.vb3d.quickwin.test;

import com.jme.app.SimpleGame;
import com.jme.bounding.BoundingBox;
import com.jme.input.FirstPersonHandler;
import com.jme.input.KeyBindingManager;
import com.jme.input.KeyInput;
import com.jme.input.NodeHandler;
import com.jme.math.FastMath;
import com.jme.math.Quaternion;
import com.jme.math.Vector3f;
import com.jme.renderer.ColorRGBA;
import com.jme.scene.CameraNode;
import com.jme.scene.Node;
import com.jme.scene.shape.AxisRods;
import com.jme.scene.shape.Box;
import com.jme.scene.state.MaterialState;

public class TestIsometricView extends SimpleGame {

   private Box box;
   private CameraNode camNode;
   private float aspect;
   private float near, far, left, right, top, bottom;
   private float zoomFactor;

   /**
    * @param args
    */
   public static void main(String[] args) {
      new TestIsometricView().start();

   }

   private void initKeyboard() {
      KeyBindingManager.getKeyBindingManager()
            .set("zoomIn", KeyInput.KEY_ADD);
      KeyBindingManager.getKeyBindingManager().set("zoomOut",
            KeyInput.KEY_SUBTRACT);
   }

   @Override
   protected void simpleInitGame() {
      input.removeAllFromAttachedHandlers();
      
      
      //setup the aspect, zoomFactor and frustumValues;
      aspect = (float) display.getWidth() / display.getHeight();
      zoomFactor = 10;

      left = -zoomFactor * aspect;
      right = zoomFactor * aspect;
      top = -zoomFactor;
      bottom = zoomFactor;
      near = 0.1f;
      far = 1000;

      initKeyboard();

      

      // setupCamProperties
      cam.setParallelProjection(true);
      cam.setFrustum(-0, 1000, left, right, top, bottom);
      cam.setLeft(Vector3f.UNIT_X);
      cam.setUp(Vector3f.UNIT_Y);
      cam.setDirection(Vector3f.UNIT_Z);
      cam.setLocation(new Vector3f(0, 0, -100));
      cam.update();

      // Attach the Cam to a CamNode to be able to handle it like a Node, and
      // set its location to Z-100
      camNode = new CameraNode("camNode", cam);
      camNode.setLocalTranslation(0, 0, -100);
      camNode.updateWorldData(0);

      // Then create a node in the origin, which is responsible for the
      // rotation around the origin.
      // and set the 45

1 Like

Hi, I tried this example with JME3, However some camera methods are not available in this version like

cam.setLeft(Vector3f.UNIT_X);

cam.setUp(Vector3f.UNIT_Y);

cam.setDirection(Vector3f.UNIT_Z);



Please guide me as how to get the true Isometric camera projection with respect to JME3 or point me to some tutorial or links where I can get more information on this projection.

Current Code is as below:



Box box = new Box(Vector3f.ZERO, 2.5f, 2.5f, 2.5f);

Spatial wall = new Geometry(“Box”, box);

Material mat_brick = assetManager.loadMaterial(“Textures/BumpMapTest/SimpleBump.j3m”);

wall.setMaterial(mat_brick);

wall.setLocalTranslation(0, 0, 0);

rootNode.attachChild(wall);



cam.setParallelProjection(true);

float aspect = (float) cam.getWidth() / cam.getHeight();

cam.setFrustum(-100, 1000, -aspect * frustumSize, aspect * frustumSize, frustumSize, -frustumSize);

camNode = new CameraNode(“camNode”, cam);

camNode.setLocalTranslation(0, 0, -100);



Node emptyNode = new Node(“emptyNode”);

emptyNode.setLocalTranslation(0, 0, 0);

Try https://wiki.jmonkeyengine.org/legacy/doku.php/jme3:advanced:camera to start…

1 Like

Hi zarch, Thanks for the quick reply and for the link. I think I will be able to do it with some study of Quaternions, to change the rotation of Camera.

Hi, I got the Isometric camera projection.

Putting the code just in-case anybody needs it:



private float frustumSize = 30;

cam.setLocation(new Vector3f(0, 0, 0));

cam.setParallelProjection(true);

float aspect = (float) cam.getWidth() / cam.getHeight();

cam.setFrustum(-1000, 1000, -aspect * frustumSize, aspect * frustumSize, frustumSize, -frustumSize);



Quaternion rot = new Quaternion(new float[] { FastMath.DEG_TO_RAD * 35.264f, FastMath.QUARTER_PI, 0 });

getCamera().setRotation(rot);

:slight_smile:

2 Likes

Hi!
Could you please show what did you get in the end?
I’m thinking about isometric game but I prefer 2d-like stile with sprites and what do it with JME, but still thinking…
Please, show some screenshots)