Где я ошибаюсь с feColorMatrix для инвертирования цветов?
Я рисую объекты и использую фильтр для инвертирования цветов. Однако цвета передаются неправильно.
<svg xmlns = "http://www.w3.org/2000/svg" xmlns:xlink = "http://www.w3.org/1999/xlink" version = "1.1" width = "441" height = "433">
<defs>
<filter id = "f1">
<feColorMatrix in = "SourceGraphic" type = "matrix" values = "-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"/>
</filter>
</defs>
<circle cx = "220.5" cy = "86" r = "30" style = "stroke-width:1;fill:rgb(255,200,145);stroke:rgb(255,200,145)" filter = "url(#f1)"/>
</svg>Цвет должен выглядеть так. Канал R должен измениться с 255 на 0. G с 200 на 55. B со 145 на 110. Вместо этого они отображаются на 0, 174, 220 соответственно.
Ответы 1
Вам нужно установить color-interpolation-filters = "sRGB". В противном случае фильтр будет использовать linearRGB.
«Линейный» относится не к числам, используемым для кодирования веб-цветов, а к линейным цветностям. Цветовое кодирование CSS происходит в цветовом пространстве sRGB с нелинейными значениями цветности. Если используется цветовое пространство linearRGB, вычисление фильтра сначала преобразует входящие значения sRGB, затем выполняет операцию цветовой матрицы, а затем преобразует обратно. Это приводит к неочевидным числам, которые вы видите.
Установка выполнения фильтра на sRGB позволяет избежать этого, но это не означает, что один результат более «правильный», чем другой. Это просто еще одна интерпретация того, что противоположно цвету.
<svg xmlns = "http://www.w3.org/2000/svg" xmlns:xlink = "http://www.w3.org/1999/xlink" version = "1.1" width = "441" height = "433">
<defs>
<filter id = "f1" color-interpolation-filters = "sRGB">
<feColorMatrix in = "SourceGraphic" type = "matrix" values = "-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"/>
</filter>
</defs>
<circle cx = "220.5" cy = "86" r = "30" style = "stroke-width:1;fill:rgb(255,200,145);stroke:rgb(255,200,145)" filter = "url(#f1)"/>
</svg>
Отлично, спасибо. Я удивлен, что это работает так по умолчанию. Любое другое графическое программное обеспечение, о котором я могу думать, дает нормальную инверсию RGB. В документации также подразумевается, что матрица просто составляет линейную комбинацию значений RGB.