RapaelJSでズームイン/アウトロジック

Question

フラッシュオブジェクトを100％幅/高さに設定すると、何が起きるのでしょうか？フラッシュムービーは、ストレッチしてウィンドウを大きくするとズームインします。まあ、それは起こっていることではないが、それはそのように見える。

私はRaphaelJSと同様のことを達成しようとしています。ここで：http://jsfiddle.net/soparrissays/2rqtL/3/、私はあなたが結果ウィンドウを大きくすると円が縮小して拡大する単純な例があります。しかしそれはそれを後方に行う。サイズが小さくなるのではなく、ウィンドウのサイズが大きくなると円が大きくなるはずです。誰でもここで起こっていることを見分けることができますか？

これを達成するためにsetViewBoxを使用しようとしています。

Answer 1

viewBoxは、表示できる領域です。これを変更する必要はありません。縮尺に関係なく元の800 * 600の領域を見たいと思っています。私のキャンバスが800 * 600の場合、私はいつもこのスペースを見たいと思っています。私がしたいことは、800 * 600の領域を可視領域の内側に合わせるようにスケールすることです。あなたはを参照してくださいをウィンドウに合わせてキャンバスのサイズを変更して、静的な800×600

にビューボックスを設定することによってこれを行うことができます。http://jsfiddle.net/WgTuF/1/

Answer 2

私は正確に正しいかどうかわかりませんが、1つの解決策は以下のとおりです。

私がしたことは、最大化されたウィンドウのinnerwidthをcentPercentWidthとしました。ウィンドウのその後onresize

、イムは、現在のウィンドウ幅が

var times = centPercentWidth/width;を介して行われる最大window.Thisの幅を与えるどのくらいの時間見つけます。

その後、私は変数adjustを持っています。これは、効果の誇張を調整するためのものです。 この値を変更して、サイズ変更効果が値ごとにどのように異なるかを確認できます。今のところはその1つです（デフォルト動作）。

次に、times可変（cとd）を使用して、viewBoxのthridと4番目のパラメータの値を調べています。

フィディドを配置しました。 http://jsfiddle.net/89Qsx/

フィディボックスの中央値のサイズを変更してみてください。