SVG要素にハイライトを追加するにはどうすればよいですか？

aはSVG要素に矩形を持つとします。赤いもの。それを強調表示する色rgba（255,255,255,0.7）で上に配置された別の矩形を追加することができます。SVG要素にハイライトを追加するにはどうすればよいですか？

2番目のSVG rect要素を追加せずにrectを強調表示できますか？おそらく、CSSフィルタを使って：？

2016-11-02 Richard

あなたはすでに持っているrectを再考することができます。 –

ハイライトを同じ色にしたいだけです。だから、色が赤であれば - どのように明るくするのですか？赤だけでなく色も何でもかまいませんか？私が半不透明な白い矩形でやっているようにそれを覆うことはこれを行います - しかし、シーンに新しい矩形を追加することなくそれを行うことは可能ですか？ – Richard

不透明度のおそらく。または、おそらくフィルターを適用します。 –

CSSフィルタは、SVG親の子要素に確実に影響しません。 JavaScriptを使用してSVGフィルタを動的に追加する必要があります。ここに明るさフィルタがあります。

<filter id="brighter"> 
    <feColorMatrix type="matrix" values="1.2 0 0 0 0 
             0 1.2 0 0 0 
             0 0 1.2 0 0 
             0 0 0 1 0"/> 
</filter>

出典

2016-11-03 02:06:57

私はこれを持っています：タイプミスはありますか？ – Richard

Ah。明るさフィルタはRGB色空間で動作するので、純粋な赤色の場合は明るくなります:)しかし、値を "1.2 0.2 0.2 0 0 0.2 1.2 0.2 0 0 0.2 0.2 1.2 0 0 0 0 1 0 " –

SVG要素にハイライトを追加するにはどうすればよいですか？

答えて

関連する問題