Как решить проблему в Google Chrome с неверным рендерингом тонких линий на изображении?

Question

[Роман Ходаковский]

На сайте есть поэтажная планировка домов. В планировке много тонких линий. При увеличении изображения в хроме тонкие линии просто не отображаются! Хотя в FireFox все хорошо. Очевидно ошибка в ренедринге, но как ее решить?

Comments

[RAX7]

Экспортируйте в png, размер попробуйте в 2 раза меньше задать
https://habrastorage.org/webt/2x/7z/e0/2x7ze0tjjdc...

Answer 1

[Евгений Корякин]

Выгружать в SVG.

Comments

[Роман Ходаковский]

Увы, в SVG нет возможности

[Евгений Корякин]

Роман Ходаковский, тогда смотрите в сторону WebGL.

Answer 2

[tyzberd]

уберите у картинки в мод окне transform: translateZ(0);
еще resize: auto; помогает, не понимаю почему

Comments

[Роман Ходаковский]

Спасибо! Уже лучше но хотелось бы качественнее. Примерно такого-же качества я смог добиться добавлением изображению фильтра с 0 значением (filter: grayscale(0%);). Думаю это из-за того что мы дергаем картинку из общего потока рендеринга и он ее перерисовывает заново.

[tyzberd]

тоесть так плохо? https://habrastorage.org/webt/h8/ya/se/h8yasejuuag...
думаю лучше не будет чем на скрине