2016-07-26 5 views
0

シャドウを使用してSVGを作成し、SVGをズームイン/ズームアウトすると、シャドウを再計算するために重大なパフォーマンス上の問題が発生します。SVG filterRes代替/置き換えの戦略

以前は、これを回避するためにfilterRes=''を使用できました。しかし、filterresは廃止され、SVG仕様から削除されました。

filterRes=''に代わるものを探しています。ズームイン/ズームアウトなどの作業を行う際にSVGシャドウなどの作業を行うと、シャドウが再計算されます。


フィルタレットが廃止されたときに浮上したパフォーマンスの障害を克服した経験がある人はいますか?フィルタを使用して提供する機能を置き換えるための戦略の例は何ですか?

答えて

0

最も簡単なことは、画像の影をあなたのSVGの影をレンダリングすることです。それから、異なる解像度でその影を生成するソリューションがあり、必要に応じて適切なサイズにプルすることができます。 <canvas>を使ってシャドークライアント側を作成し、それをbase64でエンコードされたイメージソースとしてsvgに渡すこともできます。

ところで

...それは強く、アプリケーションやパフォーマンス要件によって異なりますので、3または事前レンダリングされた、または何かもっと複雑なニーズ「resultionのステップ」が適用されるためにを持ってするのに十分であり得ます。 <filter>要素をJavascriptで参照して、直接フィルタ属性を操作することもできます。

0

CPUではなくGPUでスケーリングを行うようにブラウザを説得することができれば、これはパフォーマンスが向上しますJavaScriptやviewBoxアニメーションではなく、3Dトランスフォームを使用してSVGをズームイン/ズームアウトすることができます。

関連する問題