La transformación SVG gira 90, 180 o 270 grados que no funciona en círculo en Safari iOS 10
Quiero crear un gráfico de anillos utilizando un elemento de círculo SVG configurandostroke-dasharray y variandostroke-dashoffset. El elemento SVG debe rotarse 270 (o -90) grados para que la "barra" del gráfico comience en la parte superior. Aquí está el código:
El ángulo de rotación se especifica utilizando el primer número entransform="rotate(270, 80, 80)".
El problema es: cuando se ve en Safari en iOS 10, esta rotación no se aplica. De hecho, establecer una rotación de 90, 180 o 270 grados no tiene ningún efecto. Los mismos ángulos pero negativos (por ejemplo -90) tampoco se aplican.
Aquí hay una captura de pantalla del violín anterior en Safari en iOS 10.0.1:
Y aquí está el mismo violín en Safari en iOS 9.3.5:
Como solución alternativa, descubrí que usar algo como 270.1 grados resuelve el problema, sin embargo, me gustaría saber por qué 270 no funciona y si hay una mejor manera de tratarlo.