Javascript SVG的色彩平衡效果_Javascript_Css_Svg_Filter

Javascript SVG的色彩平衡效果

javascript css svg filter

Javascript SVG的色彩平衡效果,javascript,css,svg,filter,Javascript,Css,Svg,Filter,我需要使用CSS和SVG过滤器在我的图像上应用“颜色平衡”过滤器那个么，我怎样才能添加一个滤镜颜色平衡，怎样才能恢复图像中的原始颜色呢这是我的代码，但我没有看到任何更改 <html> <style> #filt{ filter:url(feColor-balance.svg#balance); } </style> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"&

我需要使用CSS和SVG过滤器在我的图像上应用“颜色平衡”过滤器

那个么，我怎样才能添加一个滤镜颜色平衡，怎样才能恢复图像中的原始颜色呢

这是我的代码，但我没有看到任何更改

<html> 
<style>
#filt{
filter:url(feColor-balance.svg#balance);
}
</style>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <defs>
    <filter id="balance">
        <feColorMatrix type="matrix"
            values="1.3 0 0 0 0
                0 1.1 0 0 0
                0 0 0.7 0 0
                0 0 0 1 0"/>
    </filter>
</defs>

<image xlink:href="http://www.mivision.com.au/uploads/ufiles/xx/oct/mv_Feb_Feature_eyes_in_art_My_beautiful_retina.jpg" x="5" y="5" width="190" height="290"/>

<image xlink:href="http://www.mivision.com.au/uploads/ufiles/xx/oct/mv_Feb_Feature_eyes_in_art_My_beautiful_retina.jpg" id="filt" x="205" y="5" width="190" height="290"/>


</svg>

</body>
</html>


#过滤{
过滤器：url（feColor balance.svg#balance）；
}

您的过滤器位于同一个文件中，因此它只是#balance而不是feColor-balance.svg，除非您将其称为html文件，这是不寻常的

您还需要为svg元素提供宽度和高度值，否则它只能在Chrome上工作，直到svg大小错误得到修复

<html> 
<style>
#filt{
filter:url(#balance);
}
</style>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100%">
  <defs>
    <filter id="balance">
        <feColorMatrix type="matrix"
            values="1.3 0 0 0 0
                0 1.1 0 0 0
                0 0 0.7 0 0
                0 0 0 1 0"/>
    </filter>
</defs>

<image xlink:href="http://www.mivision.com.au/uploads/ufiles/xx/oct/mv_Feb_Feature_eyes_in_art_My_beautiful_retina.jpg" x="5" y="5" width="190" height="290"/>

<image xlink:href="http://www.mivision.com.au/uploads/ufiles/xx/oct/mv_Feb_Feature_eyes_in_art_My_beautiful_retina.jpg" id="filt" x="205" y="5" width="190" height="290"/>


</svg>

</body>
</html>


#过滤{
过滤器：url（#余额）；
}

谢谢，那么您知道我应该输入哪个矩阵值才能得到原始颜色吗？身份过滤器是你的意思吗？