0

私はラファエル紙がグーグルマップのように機能するようにしています。

地図のようなメインコンテンツがあり、グーグルマップのピンやマーカーのように、その上に多くのオーバーレイがアタッチされます。

したがって、ズームするときは、メインコンテンツをズームする必要があります。これらのオーバーレイは正しい位置に移動する必要がありますが、元のサイズのままです。（たとえば、グーグルマップでは、都市をズームすると、それらのオーバーレイは常に画面上の同じサイズの正しい住所に添付されます）。

私は現在、何千もの論文を作成しており、ズームが発生したときに手動でその位置を維持しています。しかし、これは多くの作業を引き起こします。ですから、すべてを一枚の紙に描くことができるかどうかを知るのは興味深いことです。ズームが発生したときにこれらの要素のサイズが変更されないように、魔法をかけるだけです。何かのようなもの：

    paper.rect(0, 0, 10, 10).attr({resize: false})
4

2 に答える 2

0

必要なのは2つの論文だけです。片方をもう片方の上に置きます。下の用紙をズームするときは、を使用しますsetViewBox。一番上の紙で、位置を再計算し、.transform('T...)各要素を変換（）します。

于 2013-03-26T22:13:29.173 に答える
0

それは可能ではありません。魔法のようにresize：falseを設定した場合でも、各マーカーを新しい位置に移動する必要があります。

私が自分で使用する関数をあなたに与えることができます：

markAdjustPosition : function(mark){
        var w = mark.data('width');
        var h = mark.data('height');
        var dx = w/2 - w/(2*_data.scale);
        var dy = h - h/_data.scale;
        mark.attr({width: w/(_data.scale), height: h/(_data.scale)}).transform('t'+dx+','+dy);
},

この関数は、マーカーのターゲットポイントが下端の中央にあることを考慮してマーカーを再配置します（Googleマップのマーカーのように）。

この関数に渡すマークは、ラファエルの要素です。最初に正しいデフォルトの幅/高さを追加する必要があります。

Mark.data("width") = 12;
Mark.data("height") = 24;

_dataはプラグイン内のすべてのデータのグローバルオブジェクトであり、_data.scaleは現在のスケールです（各ズームレベルで計算する必要があります）。

于 2013-03-27T12:39:19.430 に答える