Filtri SVG in Firefox

Question

Per qualche motivo non riesco a ottenere i miei filtri SVG al lavoro in Firefox. Lavorano bene in Opera, tuttavia. L'elemento la cui proprietà ho impostato per il filtro scompare. E 'molto strano.

Ecco il mio codice 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);
}

Qualche idea? Grazie

Answer 1

Paul Irish fatto una demo applicando Filtri SVG in HTML 5 video .

Il codice sorgente per spettacoli la dimostrazione dal vivo come passare da filtri. In tal caso, tutti i pezzi sono scritti SVG direttamente nella pagina come tag, non inseriti in modo dinamico tramite JavaScript.

Potrebbe essere utile per cercare di farlo funzionare utilizzando i tag verso l'alto, poi passare a JavaScript, una volta che sta funzionando. Ci può essere qualche strano stranezza di attuazione (bug) che si esprime solo quando creato in modo dinamico (/ speculazione).

Inoltre, può dipendere non quale versione di Firefox che si sta utilizzando. Non sono sicuro di quale versione ha iniziato sostenendo filtri SVG, ma il post di Paul sembra suggerire che può richiedere una nightly build.

In bocca al lupo!

Answer 2

che assomiglia a colori a matrice a me come correttamente a trasformare ogni componente di ogni colore a completamente via, rendendo l'elemento completamente bianco.

(Potrebbe anche essere più facile per gli altri di capire se hai postato l'URL di un esempio completo che mostra il problema piuttosto che solo un frammento di javascript, che permetterebbe ad altre persone alle teorie di test sul perché sta andando male.)

Answer 3

Questo potrebbe essere correlato a Firefox Bug # 308.590 . In breve Firefox non riesce a risolvere gli URL di filtro quando il vostro SVG viene caricato da un data-URL o hai un -Tag nel documento.

Nel tuo esempio aspetto di Firefox per url (# cm-mat) da qualche parte al di fuori del documento incorporato. Purtroppo è stato riparato solo di recente e nel mio caso ho trovato alcuna soluzione, ma di omettere la base-Tag in qualche modo.

Answer 4

le vostre esigenze di pagina per essere servito come XML.