2016-09-27 11 views
1

2dゲーム目的のために、私はフラフラ紙を別のコーナーに設定する必要があります。デフォルトでは、原点は用紙の左上隅に設定されています。どのようにして、新しい原点に対して要素を描くことができるようにするか?ラプラスjs紙の座標原点を変更する方法

答えて

0

公式な方法はないと思います。 作成後、すべての図形(width_of_canvas - shape_of_width)/ 2と(height_of_canvas - shape_of_height)/ 2を変換できます。だから、あなたはそれらをあなたの起源にして、このような関数で変換することができます。

var paper = Raphael("canvas", 400, 400); 
var offsetWidth = paper.width/2, 
offsetHeight = paper.height/2; 
var paperBorder = paper.rect(0,0,paper.width, paper.height).attr({ stroke:"black"}) 
var rectangle = paper.rect(0, 0, 50, 50).attr({ 
    stroke:"black", 
    fill:"aqua" 
}) 

function transformToCenter(shape) { 
    var shapeProps = shape.getBBox(); 
    var itemOffsetWidth = offsetWidth - shapeProps.width/2, 
    itemOffsetHeight = offsetHeight - shapeProps.height/2; 
    shape.transform("t" + itemOffsetWidth + " " + itemOffsetHeight); 
} 
transformToCenter(rectangle); 

JSFiddle Example

+0

どうもありがとうございました。私はこれを試してみる。 –

+0

それが動作するかどうかを知ってみましょう。 –

+0

私の意図は、紙自体の起源を設定して、新しいモデルを追加するとそれに関連する位置になるようにすることでした。しかし、あなたが言ったように、すべてを描いて変形する以外の方法はないようです。これはうまくいきました。 –

関連する問題