SVG фильтры в Firefox

Question

По какой-то причине я не могу получить свои фильтры SVG для работы в Firefox. Однако они работают нормально в оперы. Элемент, свойство которого я устанавливаю на фильтр, просто исчезает. Это очень странно.

Вот мой код JavaScript:

defsElement = SVGDoc.createElement("defs");
var filterElement = SVGDoc.createElement("filter");
filterElement.setAttribute( "id", "cm-mat");
filterElement.setAttribute( "filterUnits", "objectBoundingBox");

var fecolormatrixElement = SVGDoc.createElement("feColorMatrix");
fecolormatrixElement.setAttribute("type", "matrix");
fecolormatrixElement.setAttribute("in", "SourceGraphic");
fecolormatrixElement.setAttributeNS(null, "values", "1 1 1 1 1  2 2 2 2 1  1 1 1 1 1  1 1 1 1 1");
filterElement.appendChild(fecolormatrixElement);
defsElement.appendChild(filterElement);
SVGDoc.documentElement.insertBefore(defsElement, SVGDoc.documentElement.childNodes.item(1));

partRef = getElementFromID(SVGDoc.documentElement, part);
if(partRef != null)
{
    partRef.style.setProperty('filter', 'url(#cm-mat)', null);
}

Есть идеи? Спасибо

Answer 1

Пол ирландский сделал демонстрацию SVG Фильтры к HTML 5 видео.

Исходный код для живая демонстрация показывает, как переключиться между фильтрами. В этом случае все части SVG записываются непосредственно на страницу в качестве тегов, которые не вставляются динамически через JavaScript.

Это может помочь попробовать и получить его работать, используя прямые метки, затем переключитесь на JavaScript, когда он работает. Там может быть какая-то странная странная странность осуществления (ошибка), которая выражает себя только при создании динамически (/ спекуляции).

Кроме того, это может зависеть от того, какую версию Firefox вы используете. Я не уверен, что версия начала поддерживать фильтры SVG, но пост Пола, похоже, предложит, что это может потребовать ночной сборки.

Удачи!

Answer 2

Этот цветовой матрица смотрит на меня, как следует повернуть каждый компонент каждого цвета полностью, что делает элемент полностью белый.

(Также могут быть легче выяснить, если вы разместили URL полного примера, показывающего проблему, а не просто фрагмент JavaScript; это позволило бы другим людям тестировать теории о том, почему она не так.)

Answer 3

Это может быть связано с Ошибка Firefox # 308590. Отказ В короткие сроки Firefox не удается разрешать URL-адреса фильтра, когда ваш SVG загружен из URL-адреса данных или вы получилиu003Cbase> -Таг в вашем документе.

В вашем примере Firefox ищет URL (# CM-MAT), где-то вне встроенного документа. К сожалению, это было исправлено только недавно, и в моем случае я не нашел никакого обходного пути, а как-то пропустить базовую тег.

Answer 4

Ваша страница должна быть подана как XML.