SVG ist besser als Canvas

[j4nk3y]

Servus Matthias,

Ich hab auch mit canvas angefangen und bin erst später auf SVG umgestiegen.

Glaub mir es ist genial.

Nach einigem Experimentieren: Das stimmt. Vorallem, was ich nicht ganz nachvollziehen kann, sind schräge Linen wesentlich schärfer, woran auch immer das liegen mag.

Aber eine Frage habe ich. Habe heute morgen dann auch herausgefunden, dass das Koordinatensytem die Einheit Pixel hat, was das zeichnen von Linien und Flächen extrem vereinfacht wenn x und y die selbe Einheit haben.

Nun habe ich gerade einen kleinen test gestartet, etwa so.

<svg id="style_top" width="100%" height="6em" viewBox="0 0 1218 77">
		<title>Test</title>
		<polyline points="250,0 250,20 968,20 968,0 250,0" stroke-width="1" stroke="rgba(250,180,150,0.75)" fill="rgba(250,180,150,0.45)" />
	</svg>

#style_top
{
	position: absolute;
	height: 6em;
	width: 100%;
	margin: 0em;
	padding: 0em;
	z-index: 5;
}

1. Wenn die Grafik nur als Dekoration dient und das <title>-Element von einem Screenreader gelesen werden kann, kann man das dann auch weglassen? Ich meine es muss ja nicht sein, dass einige male gesagt wird Style-Element, Style-Element,... oder was auch immer ich da einsetzen möchte.

2. Bis zu einer gewissen Breite wird das Quadrat (wird später umfangreicher daher kein rect) am oberen Rand dargestellt. Logisch wegen den x Koordinaten 250,0 und 968,0. Aber wenn das Fenster verkleinert wird rutscht die Null Koordinate nach unten obwohl der Container seine Größe nicht ändert. Kann man das beheben?

Gruß
Jo