SVG viewBox реверсирование Y-координаты

Question

Я использую SVG для рисования на HTML-странице разных форм. Эти различные формы извлекаются из объектов геометрии пространственной базы данных в Microsoft Sql Server. Проблема, с которой я сталкиваюсь, заключается в том, что система коордов (Svg и Microsoft Sql Server) отличается. 0,0 начинается в Svg в верхнем левом углу, тогда как в Microsoft Sql Server он начинается в нижнем левом углу. Мне нужно отменить только Y-координаты. Я также использую viewBox для корректного отображения данных (для разных преобразований). Есть ли способ решить мою проблему, не касаясь кодов объекта и работая только с атрибутами моего окна просмотра? Я создаю объекты динамически и предпочитаю решение «viewBox».

Заранее благодарен!

Answer 1

Я не думаю, что вы можете использовать viewBox. Спецификации SVG говорят, что если вы хотите определить новую систему координат, вам нужно использовать преобразование. Вы хотите отразить все вокруг горизонтальной линии по центру изображения. Для этого оберните все элементы в группе как так:

<svg> 
    <g transform="matrix(1 0 0 -1 0 height)"> 
    all the other elements... 
    </g> 
</svg> 

Где height высота вашего SVG. Одна из потенциальных проблем заключается в том, что текст будет перевернут.