SVG Plots Farben ändern

[choetzu]

Hallo,

ich komme nicht weiter. Gerne möchte ich die Farben der Plots ändern, aber es scheint nicht gemäss der bereits vorhandenen Forenbeiträgen nicht zu gehen.

Ich habe Darkstyle, siehe Anlage, und möchte gerne folgendes machen.

• Farben der Linien, Steps etc änder
• Hintergrundfarbe ändern
• Schriftfarbe ändern

Was habe ich gemacht:
1. Ich habe das "attr WEB stylesheetPrefix choetzu" gesetzt
2. Ich habe das File darksvg_style.css in choetzudarksvg_style.css kopiert.
3. Dort habe ich die entsprechenden Farb-codes geändert.
4. shutdown restart

Nix passiert.

Hier noch das File choetzudarksvg_style.css

Code Auswählen Erweitern

@import url("darksvg_style.css");

background { fill:#000000; }

/* Author: Volker */
text { font-family:Arial, Helvetica, sans-serif; font-size:12px; fill:#ffffff;}
text.title {font-family:Arial, Helvetica, sans-serif; font-size:16px; fill:#CCCCCC;}
text.legend{ cursor:pointer; }
text.copy  { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}
text.paste { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}


path.SVGplot     { stroke:black; fill:none; }
rect.SVGplot     { stroke:black; fill:none; }
polyline.SVGplot { stroke:black; fill:none; }
.border  { stroke:black; fill:url(#gr_bg);}
.vgrid   { stroke:gray; stroke-dasharray:2,6;}
.hgrid   { stroke:gray; stroke-dasharray:2,6;}
.pasted  { stroke:black; stroke-dasharray:1,1;}

.SVGplot.l0     { stroke:red;     } 
.SVGplot.l1     { stroke:green;   } 
.SVGplot.l2     { stroke:blue;    } 
.SVGplot.l3     { stroke:magenta; } 
.SVGplot.l4     { stroke:brown;   } 
.SVGplot.l5     { stroke:black;   } 
.SVGplot.l6     { stroke:olive;   } 
.SVGplot.l7     { stroke:gray;    } 
.SVGplot.l8     { stroke:yellow;  } 
.SVGplot.l0fill { stroke:#f00; fill:url(#gr_0); }
.SVGplot.l1fill { stroke:#291; fill:url(#gr_1); }
.SVGplot.l2fill { stroke:#f00; fill:url(#gr_2); }
.SVGplot.l3fill { stroke:#f0f; fill:url(#gr_3); }
.SVGplot.l4fill { stroke:#ff0; fill:url(#gr_4); }
.SVGplot.l5fill { stroke:#0ff; fill:url(#gr_5); }
.SVGplot.l6fill { stroke:#000; fill:url(#gr_6); }
.SVGplot.l0dot  { stroke:red;   stroke-dasharray:2,4; }
.SVGplot.l1dot  { stroke:green; stroke-dasharray:2,4; }
.SVGplot.l0fill_stripe { stroke:red; fill:url(#gr0_stripe);}
.SVGplot.l1fill_stripe { stroke:green; fill:url(#gr1_stripe);}
.SVGplot.l0fill_gyr    { stroke:red; fill:url(#gr0_gyr);}

text.SVGplot.l0     { stroke:none; fill:red;     }
text.SVGplot.l0     { stroke:none; fill:red;     }
text.SVGplot.l1     { stroke:none; fill:green;   }
text.SVGplot.l2     { stroke:none; fill:blue;    }
text.SVGplot.l3     { stroke:none; fill:magenta; }
text.SVGplot.l4     { stroke:none; fill:brown;   }
text.SVGplot.l5     { stroke:none; fill:black;   }
text.SVGplot.l6     { stroke:none; fill:olive;   }
text.SVGplot.l7     { stroke:none; fill:gray;    }
text.SVGplot.l8     { stroke:none; fill:yellow;  }
text.SVGplot.l0fill { stroke:none; fill:#f00; }
text.SVGplot.l1fill { stroke:none; fill:#291; }
text.SVGplot.l2fill { stroke:none; fill:#00f; }
text.SVGplot.l3fill { stroke:none; fill:#f0f; }
text.SVGplot.l4fill { stroke:none; fill:#ff0; }
text.SVGplot.l5fill { stroke:none; fill:#0ff; }
text.SVGplot.l6fill { stroke:none; fill:#000; }
text.SVGplot.l0dot  { stroke:none; fill:red;     }
text.SVGplot.l1dot  { stroke:none; fill:green;   }
text.SVGplot.l0fill_stripe {stroke:none; fill:red;  }
text.SVGplot.l1fill_stripe {stroke:none; fill:green;}
text.SVGplot.l0fill_gyr    {stroke:none; fill:red;  }

Wo liegt der Fehler? Ich komm nicht drauf..

[choetzu]

ich komm auch ein paar Tage später nicht darauf.. Kann mir hier jemand helfen? Danke.

[rudolfkoenig]

FHEMWEB benoetigt pro Style 3 Dateien, falls nicht alle vorhanden sind, wird auf das default zurueckgegriffen (ohne XXX):
- XXXstyle.css: CSS Attribute fuer die HTML Elemente
- XXXsvg_style.css: CSS Attribute fuer die SVG-Plots (Textfarbe, Liniendicke, etc)
- XXXsvg_defs.svg: Hintergrund und Verlaeufe in den SVG-Plots

Eine Alternative wird mit f18 gerade getestet: hier uebernimmt die Faerbung aus den Attributen nach Laden der Seite ein JavaScript-Programm. Die Informationen fuer die Farben stammen aus dem (grafisch spezifizierbaren) FHEM-Attribut.

[choetzu]

Super, genau das hab ich gesucht!! Herzlichen Dank! F18 gefällt auch, wird dies weiter entwickelt? Mit zusätzlichen Einstellungsmöglichkeiten? Lg


Gesendet von iPhone mit Tapatalk

[holle75]

Möchte mich hier kurz dranhängen (auch wenn schon älter)

f18 ist prima. Da ich VOR f18 über die von Rudi genannten files meine Änderungen gemacht habe, aber von js keine Ahnung habe diese Frage.

Um den Hintergrund der SVG Plots jetzt bei f18 zu verändern, muß ich das allgemeine Hintergrund attr bearbeiten. Dies bezieht sich, wie der Name schon sagt, auf den kompletten Hintergrund. Ich würde aber gerne nur den Hintergrund der Plots ändern. Wo "greife ich an"?