Что такое система координат пользователя, когда речь идет о графике или SVG - PullRequest
Новая
       8

Что такое система координат пользователя, когда речь идет о графике или SVG

0 голосов
/ 26 октября 2018

Я читаю панорамирование и масштабирование svg-изображений и постоянно сталкиваюсь с выражением

новая пользовательская система координат

Например, в этой записи

В нем говорится

Новое пользовательское пространство (т. Е. Новая текущая система координат) также может быть установлено путем указания преобразований

Iв общем, понимаю, что это значит, это создание новой пользовательской системы координат в новом источнике, но мне бы очень хотелось хорошее определение.

Может кто-нибудь предоставить одну

1 Ответ

0 голосов
/ 26 октября 2018

Звучит так, как будто у вас есть суть.

SVG начинается с начальной пользовательской системы координат , которая соответствует 1: 1 с системой координат области просмотра . * Его источник (0,0) находится в левом верхнем углу области просмотра.

Если к элементу контейнера (например, <g>) к нему применен transform, то мы рассмотримчто он устанавливает новую пользовательскую систему координат .Все дочерние элементы внутри этого элемента контейнера не имеют представления о том, что они находятся в другом месте на странице.Его (0,0) может вообще не быть в левом верхнем углу окна просмотра.Это может быть под другим углом.И он может быть масштабирован или перекошен относительно пользовательской системы координат своего родителя.1 единица в системе координат родителя, может быть 5 в этой.

Так почему это полезно?Ну, на самом простом уровне, это простой способ переместить группу фигур в другую позицию на странице.Некоторые конструкции, которые вы, возможно, захотите построить, могут быть проще обернуть вокруг головы, если вы создадите их с центром в (0,0), а затем переместите их на их окончательное место позже.Подумайте о форме звезды или о форме с симметрией.

Но вы также можете иметь целый набор вложенных пользовательских систем координат.Изобразите SVG, представляющий руку человека с суставами на плече, локте и запястье. 

<g id="shoulder" transform="...">
  <path .../><!-- upper arm -->

  <g id="elbow" transform="...">
    <path .../><!-- lower arm -->

    <g id="wrist" transform="...">
      <path .../><!-- hand -->
    </g>
  </g>
</g>

Такое расположение очень полезно для анимации.Вы можете расположить локоть под любым углом, который вы выберете.Затем, если вы поворачиваете плечо, вся рука остается вместе в существующей позе.Нижние части руки не заботятся о том, какое положение или угол могут иметь верхние части.

Если бы они не были вложены таким образом, вам пришлось бы явно обновить положение нижней руки и рукикаждый раз, когда плечо двигалось.И перемещайте руку каждый раз, когда вы двигаете нижнюю руку.

Таким образом, дерево вложенных преобразований, подобное этому, является нормой в большинстве графических файлов описания сцены.И в 2D, и в 3D.

Надеюсь, это объяснение помогло.

* Если, конечно, SVG не имеет viewBox.Это приведет к тому, что исходная пользовательская система координат будет преобразована так, чтобы viewBox помещался в область просмотра.

...