Yadgar: SVG: Beispiel für <line> funktioniert nicht!

Hi(gh)!

Wohl wissend, dass ein SVG-Buch von 2001 nicht der Weisheit letzter Schluss sein kann, arbeite ich jetzt die ersten Kapitel von Helma SPONA: SVG - Das Einsteigerseminar durch... und stoße schon wieder auf offensichtlich fehlerhafte Listings!

Wieso funktioniert das hier:

<!DOCTYPE html>
<html>
  <head>
    <title>Linien</title>
    <meta charset="utf8" />
  </head>
  <body>
    <svg width="300" height="300">
      <line x1="0" y1="0" x2="100" y2="100" />
      <line x1="100" y1="0" x2="0" y2="100" />
    </svg>  
  </body>
</html>

auf dem neuesten Firefox für Linux nicht? Laut Illustration im Buch sollte man zwei sich kreuzende schwarze Diagonalen sehen, tatsächlich bleibt das Fenster aber leer - und die Fehlerkonsole zeigt ebenfalls rein gar nichts an! Was ist da los?

Bis bald im Khyberspace!

Yadgar

  1. Lieber Yadgar,

    Wohl wissend, dass ein SVG-Buch von 2001 nicht der Weisheit letzter Schluss sein kann, arbeite ich jetzt die ersten Kapitel von Helma SPONA: SVG - Das Einsteigerseminar durch...

    Du willst also Schmerzen. Na dann: bitteschön.

    und stoße schon wieder auf offensichtlich fehlerhafte Listings!

    Das ist von Dir jetzt sehr unverschämt! Wie kannst Du einem Buch von 2001(!!) Fehlerhaftigkeit vorwerfen, wenn sich die Browser seit 20 Jahren so stark weiterentwickelt haben, dass inzwischen mehr nötig ist, um das von Dir erwartete Ergebnis zu zeigen?!

    https://wiki.selfhtml.org/wiki/SVG/Tutorials/Einstieg/Grundformen#Kreise_und_Linien

    Liebe Grüße

    Felix Riesterer

    1. Hallo Felix,

      Das ist von Dir jetzt sehr unverschämt!

      Nein, er stellt einen berechtigten Anspruch. Man sollte erwarten können, dass SVGs aus dem Jahr 2000 auch heute noch funktionieren. Die Webstandards geben sich seit jeher größte Mühe, breaking changes zu vermeiden.

      Aber der Default für stroke ist seit jeher none. Das habe ich überprüft - siehe meine Antwort an Gunnar. Glaubst Du, dass 2001 ein <line> Element ohne stroke-Angabe korrekt gezeichnet wurde? Das kann man vermutlich heute nicht mehr überprüfen. Und vielleicht hat der von Frau Spona verwendete SVG Viewer sich auch nicht ganz Spec-konform verhalten. Man weiß es nicht.

      Wenn die Onlineversion des Buchs der Printversion 1:1 entspricht, ist das Buch an dieser Stelle tatsächlich fehlerhaft. Zumindest ist es nicht der Spec entsprechend Möglicherweise hat Frau Spona in ihren Tests mit styles gearbeitet; das Beispiel im Onlinebuch zeigt zu Beginn drei Punkte.

      Eine Rezension bei Amazon.de schreibt ähnlich Vernichtendes.

      Rolf

      --
      sumpsi - posui - obstruxi
  2. @@Yadgar

    Laut Illustration im Buch sollte man zwei sich kreuzende schwarze Diagonalen sehen, tatsächlich bleibt das Fenster aber leer

    Nicht leer; es zeigt die ostfriesische Nationalflagge: weißer Adler auf weißem Grund. (Otto)

    Wurde da irgendwann in der Zwischenzeit mal die Spec geändet und der Defaultwert für stroke von currentColor auf none gesetzt? Oder hast du das Beispiel aus dem Buch abgespeckt?

    Jedenfalls: wenn du eine Farbe angibst (entweder als Attribut oder als CSS-Eigenschaft), dann ist auch was zu sehen.

    Es ist übrigens selten eine gute Idee, width und height im SVG anzugeben. Verwende viewBox und skaliere mit CSS.

    😷 LLAP

    --
    „Dann ist ja auch schrecklich, dass wir in einem Land leben, in dem nicht nur Bildungswillige leben, sondern auch hinreichende Zahlen von Bekloppten. Das darf ich so locker formulieren, ich bin ja jetzt Rentner und muss nicht mehr auf jedes Wort achten.“
    — Joachim Gauck über Impfgegner
    1. Hallo Gunnar,

      ich habe jetzt etliche Versionen der SVG 2, 1.1 und 1.0 Specs durchgeschaut, bis hin zum allerersten öffentlichen Working Draft aus 1999. Der initial value für stroke ist immer none gewesen.

      Das Buch ist online verfügbar. Das fehlende viewbox Attribut war Frau Spona zum Zeitpunkt des Schreibens entweder unbekannt (es war nicht Teil des initial Working Draft, sondern kam zuerst als fit-box-to-viewport hinein, dann fitBoxToViewport und schließlich im WD vom 12.8.1999 als viewbox) oder sie hat es didaktisch wegreduziert.

      Das von Yadgar erwähnte Beispiel findet sich im online-Teil. Auf die Notwendigkeit einer stroke-Farbe wird dort nicht eingegangen. In einem Abschnitt davor wird auf „die wichtigsten“ Attribute eingegangen, aber nur x und y erklärt und stroke kurz in einem Beispiel erwähnt, aber nicht beschrieben. Entweder steht's nicht im Buch oder dieser Teil ist nicht online.

      Die nachfolgenden 3 Abschnitte zu rect, circle und ellipse funktionieren dann, weil das gefüllte Formen sind und der Defaultwert für fill black ist.

      Rolf

      --
      sumpsi - posui - obstruxi
  3. Servus!

    Hi(gh)!

    Wieso funktioniert das hier:

        <svg width="300" height="300">
          <line x1="0" y1="0" x2="100" y2="100" />
          <line x1="100" y1="0" x2="0" y2="100" />
        </svg>  
    
    
    nicht? Laut Illustration im Buch sollte man zwei sich kreuzende schwarze Diagonalen sehen, tatsächlich bleibt das Fenster aber leer - und die Fehlerkonsole zeigt ebenfalls rein gar nichts an! 
    

    Wo könnte man einen solchen Hinweis auf die (Arbeit mit der ) Konsole im Einstieg in SVG-Tutorial unterbringen?

    Herzliche Grüße

    Matthias Scharwies

    --
    Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
  4. Hallo Yadgar,

    auf dem neuesten Firefox für Linux nicht? Laut Illustration im Buch sollte man zwei sich kreuzende schwarze Diagonalen sehen, tatsächlich bleibt das Fenster aber leer - und die Fehlerkonsole zeigt ebenfalls rein gar nichts an! Was ist da los?

    Wie bereits gesagt, wird stroke="farbwert" benötigt. Dann erscheint auch das Kreuz. stroke-width steht auf 1, kann ebenso geändert werden.

    Ich vermute, dass der Code ohne stroke bei der Autorin dennoch funktioniert hat, sofern das damals™ meistens verwendete Plug-in "Adobe SVG Viewer (ASV)" den Wert black voreingestellt hatte, analog zu fill bei Grundformen.

    Grüße,
    Thomas