Raphael.js How to get center point location of paper and scale relative to the center?
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?
paper.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;
精彩评论