SVG-Gradient für perfekt horizontalen Pfad

8

Ich verwende SVG, um Liniendiagramme zu zeichnen, und brauche einen Farbverlauf, um darauf angewendet zu werden. Für jede Zeile verwende ich ein Pfadelement und setze den Strich auf eines meiner lineargradienten Elemente.

Das funktioniert super für alles außer rein horizontale Linien - in diesem Fall bekomme ich überhaupt keine Farben auf meiner Linie.

Ich habe eine Geige gemacht, die das Problem zeigt: Ссылка

%Vor%

Die reine horizontale Linie (erster Pfad) erscheint nicht und die zweite (leichte Änderung in y).

Ich habe einen kleinen Hack versucht, um es in Gang zu bringen - am Anfang einen gefälschten M-1, -1, der das Problem in IE und Chrome löst, aber nicht in Firefox. Das lässt mich denken, dass ich etwas in meinem Verständnis von SVG-Gradienten und -Wegen verpasse. Gibt es eine Möglichkeit, dies zum Laufen zu bringen?

    
XwipeoutX 04.11.2012, 22:33
quelle

2 Antworten

6

Der Standardwert für gradientUnits ist objectBoundingBox. Das Hauptproblem, das Sie haben, wird im letzten Abschnitt des Spezifikationstextes beschrieben. Warum verwenden Sie nicht ein Rechteck mit einer Füllung und keinen Pfad mit einem Strich, wenn Sie eine horizontale Linie haben? Oder verwenden Sie alternativ userSpaceOnUse-Einheiten.

    
Robert Longson 04.11.2012, 22:52
quelle
3

gradientUnits="userSpaceOnUse" kann es beheben.

Demo

%Vor%

Antwortdetails

    
WebBrother 29.01.2015 09:51
quelle

Tags und Links