About cocos2d isometric camera

Question

I want to implement a isometric view. see the image. How to set CCLayer CCCamera property can do this? Rotate and Scale can not to do this, because rotate and scale at same time.

Answer 1

Obviously this is far too late for you to use, but for anyone looking at this by googling "cocos2d isometric transformation rotate skew" or something like that like I was: I figured out the right skews and rotations. A two-layer approach was needed due to the lack of a diagonal scale or Z rotation. For javascript devs: this makes an isometrically transformed DrawNode. I'm not sure what performance impact this has, but since it's only using the native functions I don't believe it has much if any. For other languages, it should be trivial to port.

var MapContainer = cc.Layer.extend({
  ctor: function(){
    this._super();

    this.scaleX = .947;
    this.setAnchorPoint({x:0, y:0});
    this.drawNode = new MapDrawNode();
    this.addChild(this.drawNode);

    return true;
  },
  drawNode: null
});
var MapDrawNode = cc.DrawNode.extend({
  ctor: function(){
    this._super();

    this.setAnchorPoint({x:0, y:0});
    this.y = 360; // shifts everything up, adjust as needed. Mine is 1/2 window size
    this.transform();

    // Your init code here

    return true;
  },
  transform: function(){
    this.setScaleX(0.81649658);
    this.setScaleY(0.81649658);
    this.setSkewX(16.3);
    this.setSkewY(16.3);
    this.setRotationY(45);
    this.setRotationX(45);
  }
});

Proof: check the image at the url since I don't have 10 rep to post it inline. http://i.stack.imgur.com/T3uU8.png