Is scaling and changing position within a scaled Group counter intuitive, or is just for me?

[TT TY]

I think is not very easy to use the scale in paper.js because:

imagine I have a map that it's scale=1 and I want to change it to scale=0.5 i do scale(0.5) it's all right until now, but now I want to have it back to it's original size i should do scale(2) which is quite counterintuitive as this will act upon the already scaled item. Ok, I understand if this is based on some design choices and cannot be changed. If there is anyway to do scaling always relative to it's original size please inform me, it's just paining me this.

Now I also have a problem with Groups and inner Items:

If I have a group.scale(0.5) and set the position of an item {x: 100, y: 0} will move100 px visible instead of 100px*scale which would result in 50 px visible.

It's there any easier way to change the position to 100 scaled px instead of always 100 visible px? This adds an amount of complexity of adding the scale value all over the app and changing the scale is complicated too.

If not, thanks anyway

[Robin Hood]

I ran into the same problem, I guess the only workaround is to remember the original size.

[TT TY]

well, I thought I could do a tool to scale normally because I can't manage and work with the kind of scale provided by paper.js. :s

[Ryan Beasley]

Just add your own scaling function that keeps track of the cumulative scaling operations:

var x = 10;

var y = 10;

var rad = 10;

var aCircle = paper.Path.Circle(x, y, rad);

aCircle.myScale = 1.0;

aCircle.scaleAbsolute = function(absScale) {

this.scale(absScale / myScale);

this.myScale = absScale;

}

aCircle.scaleAbsolute(4);

aCircle.scaleAbsolute(0.5);

You may want to inject your function into Path or PathItem, instead of redefining it for each of your items.

Similarly, you can create a translateScaled() function that incorporates the absolute scale into translation operations.

~Ryan

[Ryan Beasley]

Oops, I didn't test that before posting.  It should be

var aCircle = paper.Path.Circle(new paper.Point(x, y), rad);

~Ryan

[TT TY]

Well, thank you ;)

It actually works fine. This is how I've done:

            paper.Item.inject({

                __scale:1 

                

                ,setAbsScale: function(scale){

                    this.scale(scale / this.__scale);

                    this.__scale = scale;

                }

                ,getAbsScale: function(){

                    return this.__scale;

                }

            })