0

Raphael を使用して、div に複数のポリゴンを SVG イメージとして表示しようとしています。Raphael が用紙オブジェクトを作成するための引数として取得する div のサイズを設定しましたが、div 要素のサイズは考慮されず、画像は div 境界の外側に描画されます (これは、ポリゴン座標は div 境界を超えています)。

SVG を通常の画像のように動作させ、ブラウザ ウィンドウのサイズが変更されると自動的に拡大縮小し、SVG が div 境界の外側に描画されないようにする方法はありますか (動作のように)?

乾杯、マックス

4

3 に答える 3

1

1つの問題が2つあるようです。

「画像のようにブラウザウィンドウで自動的にスケーリングする」ことについては、この例のコードを見てください。

http://www.irunmywebsite.com/raphael/scaleraphael.php

于 2011-09-08T12:32:24.330 に答える
1

Raphael の要素が含まれている要素を埋めるようにするには (お望みのように聞こえます)、次を使用します。

var paper = Raphael("someElement", "100%", "100%");

Firefox と Chrome でのみテストしましたが、問題なく動作するようです。

于 2010-10-02T05:04:16.187 に答える
0

divのオーバーフロースタイルを、overflow:auto または overflow:hidden に設定します。div のデフォルトは、overflow:visible です。これにより、SVG が div の外側でにじみます。ただし、全体が見えるように SVG 全体を「縮小」したい場合は、キャンバス上の各 Raphael 要素を拡大縮小および変換 (つまり、ズーム) する必要があります。スクロールとズームの両方を実行しましたが、明らかに、スクロールの方がはるかに簡単です。

于 2010-07-01T18:44:56.807 に答える