Das SVG-Format scheint mir eher ein Nischenprodukt zu sein. Theoretisch
kann man damit aber prima von Scripten Diagramme erstellen lassen, ohne
von irgendwelchen PNG/GIF-Libraries abhängig zu sein. Mein Chrome zeigt
die auch richtig an. Aber wie ist die allgemeine Verbreitung? Wie sieht
es mit dem Einbinden von Links auf SVG-Grafiken in Forenposts aus? usw.
Was sind eure Erfahrungen mit dem Format?
Der Dieter schrieb:> es mit dem Einbinden von Links auf SVG-Grafiken in Forenposts aus? usw.
Was hat das 'hochladen' einer Datei mit 'einbinden' von 'links' zu tun?
> von irgendwelchen PNG/GIF-Libraries abhängig zu sein. Mein Chrome zeigt
Ein Firefox kann das seit seit ~15 Jahren ~v3.0
GIF ist kein vektorformat dient eben einfach der Darstellung.
Mit svg geht nat. mehr da man z.b. die Daten der Pfade verarbeiten kann
=============
Da fällt mir grade wieder etwas ein:
@Autor: Old P. (old-papa)
Antwort mit Zitat
Re: Suche Tool zum Bearbeiten von Oszilloskop Bilder
>> Das mit den "xy-datensätze aus der abfotografierten Röhre" musst Du mir>> erklären. Wie soll das gehen?
Wie hier z.B. Ein vorliegendes Rasterbild entweder vektorisieren oder
von hand nachzeichnen und dann einfach den entsprechenden Pfad kopieren.
path stroke="#048" stroke-width="3" fill="none" d="M0 500L100 400 200
450 300 100 400 0 500 10 600 0 700 300 800 200 900 400 1000 500"
M 0,500 100,400 200,450 300,100 400,0 500,10 600,0 700,300 800,200
900,400 1000,500
0,0 oben Links das kann man ja dann nach belieben weiterverarbeiten.
Sehr praktisch. Nach den Enttäuschungen mit der schlechten Performance
diverser webbasierter UIs - unglaublich, was JS da an Ressourcen frisst
- wollte ich die Diagramme dann als PNG ausliefern. Bin schnell drauf
gekommen, dass SVG hier besser ist, und nach der recht schnellen
Lernkurve über den Aufbau und den Umgang mit SVG läuft das sehr gut.
Vorteile:
- skalierbar
- kann direkt als Textdatei geschrieben werden
- es können Templates erstellt werden, in die dann reingezeichnet wird
- unterschiedliche Liniendicken, Flächenfüllung, Transparenz geht ohne
Aufwand
- kleine Dateigrößen - gut das hängt von der Punktdichte ab
Nachteil:
- Schriften werden wie bei HTML mit Font angegeben, ist die Schrift
nicht verfügbar, wird eine ähnliche passende genommen. Es ist mir nicht
gelungen, Fonts wie bei HTML über das Web / Intranet nachzuladen.
Umgangen habe ich die Fonts-Problematik, indem ich Roboto nehme, das ist
auf dem Raspi und auf Android-Tablets drauf, auf dem PC hab ich es
nachinstalliert. Und natürlich kann man wie bei HTML eine Fontgruppe
definieren: font-family="Roboto, Tahoma, Verdana, sans-serif" Damit
trifft man immer was... ;-)
(auf der Webseite hat das Bild einen schwarzen Hintergrund)
SVG ist einfach geil! Kleine Dateigrößen, skalierbarkeit etc.
Ich benutze wo immer es geht SVG, als Werkzeug benutze ich Inkscape, da
muss man sich aber erstmal einarbeiten.
Ivo
Karl K. schrieb:> Nachteil:> - Schriften werden wie bei HTML mit Font angegeben, ist die Schrift> nicht verfügbar, wird eine ähnliche passende genommen. Es ist mir nicht> gelungen, Fonts wie bei HTML über das Web / Intranet nachzuladen.>
Man kann Fonts als src direkt ins (lokale) CSS, Base64 codiert
einbinden, dann benötigt man keine externe Serververbindung ...
Sieht dann ungefähr so aus:
@font-face {
font-family: 'Pacifico';
src:
url(data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAGy …)
format('woff');
font-weight: normal;
font-style: normal;
}
Mehr dazu gibt z.B. hier:
https://www.mediaevent.de/font-in-css-einbetten/
Im Sourcecode sieht das so aus:
view-source:https://www.mediaevent.de/wp-content/uploads/2014/10/e2.svg
Frank E. schrieb:> Man kann Fonts als src direkt ins (lokale) CSS, Base64 codiert> einbinden, dann benötigt man keine externe Serververbindung ...
Die Serververbindung brauch ich ja sowieso, um die Seite zu laden. Das
wäre nur sinnvoll bei Seiten, die auch aus dem Cache genauso aussehen
sollen.
Leider kann das SVG auf die Fonts aus dem CSS nicht zugreifen,
prinzipiell nicht auf das CSS, sonst könnte man so nette Sachen machen
wie Rahmenfarben per CSS festlegen.
Zumindest habe ich keine Möglichkeit gefunden. Für einen "Digitalfont"
in 7-Segment lasse ich die Segmente deshalb einzeln zeichnen. In den
Beispielen sind die kleinen Zahlen Schrift, die großen Vektorgrafik.
Tipp, wers noch nicht gesehen hat: Man kann im Firefox mit Rechts =>
Grafik anzeigen nur die Grafik ins Browserfenster holen und sich dann
mit Rechts => Seitenquelltext anzeigen den Aufbau der SVG ansehen.