I have defined my raphael paper like below:
var paper = Raphael("my-paper", '100%', '100%');
//render some shapes on my paper
var e = paper.ellipse(50, 50, 40, 20);
var c = paper.circle(50, 50, 40);
var r = paper.rect(40, 40, 50, 50, 10);
As you saw above, I defined my Raphael paper, then drew some shapes on my paper. I have following two questions to ask:
1. How to get the center point x and y value of my paper. (x: horizontal location, y: vertical location)
2. I would like to scale everything on my paper to twice bigger size, I know I can use Raphel scale function. I would like to scale all the elements on the paper relative to the center of my paper, so, I need to do something like:
e.scale(2, 2, CENTER_X, CENTER_Y)
( CENTER_X
and CENTER_Y
are asked in question 1 )
I'd like the result looks like zoom in, am I using in the right way or are there other ways to do it?
I have defined my raphael paper like below:
var paper = Raphael("my-paper", '100%', '100%');
//render some shapes on my paper
var e = paper.ellipse(50, 50, 40, 20);
var c = paper.circle(50, 50, 40);
var r = paper.rect(40, 40, 50, 50, 10);
As you saw above, I defined my Raphael paper, then drew some shapes on my paper. I have following two questions to ask:
1. How to get the center point x and y value of my paper. (x: horizontal location, y: vertical location)
2. I would like to scale everything on my paper to twice bigger size, I know I can use Raphel scale function. I would like to scale all the elements on the paper relative to the center of my paper, so, I need to do something like:
e.scale(2, 2, CENTER_X, CENTER_Y)
( CENTER_X
and CENTER_Y
are asked in question 1 )
I'd like the result looks like zoom in, am I using in the right way or are there other ways to do it?
Share Improve this question asked Jun 7, 2011 at 14:07 LeemLeem 18.3k39 gold badges112 silver badges164 bronze badges 1- Are you still looking for this answer? I can provide you with a working example... – ffleandro Commented Jul 10, 2012 at 14:05
2 Answers
Reset to default 8paper.width and paper.height should return the dimensions of the paper which would give you the center.
You can find center of the paper like this
var x = this.paper.canvas.offsetLeft;
var y = this.paper.canvas.offsetTop;
var centerX = x + paper.width/2 ;
var centerY= y + paper.height/2;