Disclaimer.
Некоторые умники кидают ссылки на let me google for you.
Нужно проверенное кроссбраузерное и кроссплатформенное решение для использования в продакшене, а не ссылки на гугл. Спасибо.
Суть вот какая. Нужно масштабировать в браузере на мобильных устройствах с помощью pinch-to-zoom и rotate svg-карту.
Используя scale3d или scale, в момент увеличения, карта становится растровой, чтобы быстро все обрабатывалось. Но после отпускания пальцев она по-прежнему растровая, если не включить css-transitions или не произвести redraw. Включать css-transitions глупо, потому что все лагает, так как браузер пытается между каждым состоянием сделать анимацию. Но зато она делает redraw.
В итоге я остановился на хаке
$('svg').hide();
$('svg').get(0).offsetHeight();
$('svg').show();
В результате без "мигания" элемента svg становится заново четкой без растровых артефактов увеличения. Есть одно но у этого приема:
1) Не работает в iphone
2) Это грязный хак, который к тому же может привести к дальнейшим проблемам.
Как, собвстенно, сделать этот redraw нормально?
