Почему chrome так криво отображает эти svg — паттерны?

Приветствую, как пример, у меня есть парочка паттернов, в svg, используются как background-image соответственно no-repeat.
Заметил в хроме неприятную особенность: вначале некоторое кочичество повторов рисуется корректно, затем, через несколько повторов, появляются неточные соединения, далее снова все нормально, и так далее, причем как по горизонтали, так и по вертикали.
Характерно, что вижу эту проблему только в хроме, в фф и даже в ie11 этой проблемы нет.
Хотелось бы узнать причину, если она вообще есть.
Вот сами паттерны и скрины для понимания
DdL.svg
Dcc.svg
5d074844e4ef6816109728.png
5d0748559ee4e111557619.png
  • Вопрос задан
  • 103 просмотра
Решения вопроса 1
@Alrxandr_TT
Разные браузеры по разному реализуют anti-aliasing. Поэтому для устранения данного эффекта можно использовать атрибут SVG shape-rendering="crispEdges" . Этот атрибут отлично работает с горизонтальными и вертикальными линиями.
Ещё лучше при написании кода не использовать дробные значения, как у вас: 13.096px и 0.85px
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы