SVG-Bilder, die in Safari in einer Größe von weniger als 20 Pixel verschwommen sind


7

Ich mache eine mobile Demo für das iPad, das wir in Safari testen. Ich verwende Symbole, um meine Bilder nicht dreimal skalieren zu müssen. Das Problem ist, dass alle von mir verwendeten Symbole, die kleiner als 20 Pixel sind, auf dem Bildschirm verschwommen sind, bis Sie hineinzoomen. Hat jemand anderes dieses Problem und weiß, wie das Problem behoben wird? Zu Ihrer Information Ich habe diese Bilder in Illustrator gespeichert


2
Kleine Bilder sind wahrscheinlich genauso antialiasiert wie große, aber das Verhältnis von "unscharfen" Pixeln zu gefüllten Pixeln ist logisch größer. Stellen Sie sich Ihr Bild mit 4 x 4 Pixel vor. Dann sind keine vollständig gefüllten Pixel mehr vorhanden. Ohne das Ausschalten von Antialiasing (von dem ich nicht weiß, ob es möglich ist und das ich sowieso nicht empfehlen würde) gibt es nicht viel zu beheben.
usr2564301

Ich habe den ganzen Tag Dinge ausprobiert. Das 20px-Problem funktionierte nur mit einigen .svg-Bildern. Das Material, das ich in Illustrator erstellt und als SVG gespeichert habe, sah nicht so gut aus wie einige der SVG-Grafiken, die ich in Illustrator gespeichert habe. Vielleicht waren einige der Einstellungen, die ich ausgewählt habe, nicht optimal. Ich habe in Chrome und Ffox eingecheckt und alles sah sehr scharf aus, so dass dieses Antialiasing-Problem nur in Safari auftritt. Ich werde sehen müssen, ob Safari auf dem PC genauso und vor allem auf dem Tablet gerendert wird.
John Dangerous

Antworten:


1

Danke für das Teilen. Ich werde nachlesen. In Safari auf dem Ipad sah alles gut für mich aus, also ist alles in Ordnung, aber Safari auf dem Desktop sah meiner Meinung nach nicht so gut aus, spielte aber für diese Demo keine Rolle
John Dangerous

1
Wir haben diesen Artikel darüber gefunden, wie verschiedene Browser SVG anzeigen. optische cortex.com/svg-rendering-in-browsers
John Dangerous
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.