Svg Bild wird nicht in Firefox angezeigt

Ihr SVG wird nicht so skaliert, dass es in Ihr 10x10-Bildrechteck passt, weil es keine viewBox hat. SVG-Renderer müssen die Dimensionen des SVG-Inhalts kennen, um zu wissen, wie sie skaliert werden. Dafür ist das viewBox-Attribut zuständig.

Fügen Sie dem root <svg> -Element in knitter.svg Folgendes hinzu:

Außerdem müssen Sie Ihre Namespaces für svg und xlink definieren. Obwohl Sie vielleicht gerade diese zur besseren Übersicht entfernt haben (?).

Ihr Springer ist 45 x 45 Pixel groß. Die obere linke Ecke (10 x 10) Pixel ist leer.

Sie möchten, dass das Bild für die obere linke Ecke im <image> Markup angezeigt wird, damit Firefox nichts anzeigt, weil dort nichts ist.

Wenn Sie den Springer sehen möchten, stellen Sie <image> width und height 45 so ein, dass sie mit den zugrunde liegenden knight.svg Dimensionen übereinstimmen.

Weder Chrome noch Opera scheinen das Bild korrekt anzuzeigen

Ein 'image'-Element richtet ein neues Ansichtsfenster für die referenzierte Datei ein, wie in Ein neues Ansichtsfenster erstellen beschrieben. Die Grenzen für das neue Ansichtsfenster werden durch die Attribute 'x', 'y', 'width' und 'height' definiert