Свойства элемента
Выбрав элемент изображения SVG, вы откроете редактор свойств элемента с интерфейсом, аналогичным редактору свойств компонента. Изменение значений свойств в редакторе свойств элемента изменяет атрибуты элемента SVG-файла, связанного с компонентом. Для каждого свойства можно обратиться к спецификации SVG 1.1, чтобы определить допустимые значения.
Кроме того, любое свойство элемента может быть объектом привязки, а на его значения можно ссылаться, как и на любое другое свойство, используя ссылки языка выражений.
Общие свойства
Свойства, которые являются общими для всех элементов SVG и всегда отображаются в редакторе свойств элемента, независимо от типа выбранного элемента.
Имя
Свойство имени предоставляет метку для SVG-элемента, позволяя идентифицировать и использовать его в качестве цели с помощью выражений.
Имя переменной: | name |
|---|---|
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
|---|---|---|
name | String | Имя |
Заблокировать
Атрибут Заблокировать - это булево значение, которое может быть использовано для предотвращения непреднамеренных изменений элемента SVG. Когда этот параметр включен, элемент защищен от изменений.
Имя переменной: | locked |
|---|---|
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
|---|---|---|
locked | Boolean | Заблокировать |
Видимость
Атрибут видимости - это булево значение, которое управляет тем, будет ли элемент SVG видимым или скрытым во время рендеринга. Соответствует атрибуту 'visibility', определенному в спецификации SVG 1.1.
Имя переменной: | visibility |
|---|---|
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
|---|---|---|
visibility | Boolean | Видимость |
ID
HTML-идентификатор SVG-элемента, позволяющий ссылаться на него как на HTML-элемент, что дает возможность использовать скрипты, стили CSS и другие ссылки. Соответствует атрибуту 'id', определенному в спецификации SVG 1.1.
Имя переменной: | id |
|---|---|
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
id | String | ID |
Класс
Присваивает элементу одно или несколько имен классов и позволяет использовать элемент в качестве цели с помощью правил CSS или JavaScript для определенного стиля или поведения. Соответствует атрибуту 'class', определенному в спецификации SVG 1.1.
Имя переменной: | class |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
class | String | Класс |
Прозрачность
Управляет прозрачностью элемента. Значение 1.0 означает полную непрозрачность (полностью видимый элемент), а значение 0.0 - полную прозрачность (полностью невидимый элемент). Соответствует атрибуту 'opacity', определенному в спецификации SVG 1.1.
Имя переменной: | opacity |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
opacity | Float | Прозрачность |
Ширина обводки
Определяет толщину в пикселях контура или рамки вокруг фигуры.
Имя переменной: | strokeWidth |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
strokeWidth | Integer | Ширина обводки |
Цвет обводки
Определяет цвет контура или границы элемента SVG. Он может быть задан с помощью значений цвета, например шестнадцатеричного, RGB или именованных цветов.
Имя переменной: | stroke |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
stroke | Color | Цвет обводки |
Штриховая линия
Определяет шаблон чередования штрихов и промежутков, используемый для отображения контура элемента.
Соответствует атрибуту stroke-dasharray в спецификации SVG 1.1.
Имя переменной: | strokeDash |
Записи: | 1 |
Формат записи:
Имя поля | Тип | Описание |
|---|---|---|
strokeDash | Sting (nullable) | Шаблон штриховки, применяемый к обводке элемента |
Окончание линии
Определяет форму, используемую на концах открытых линий при обводке.
Соответствует атрибуту stroke-linecap в спецификации SVG 1.1. Допустимые значения: butt, round, square.
Имя переменной: | strokeLineCap |
Записи: | 1 |
Формат записи:
Имя поля | Тип | Описание |
|---|---|---|
strokeLineCap | Sting (nullable, расширяемая) | Стиль окончания линии при обводке |
Соединение линий
Определяет форму соединения в местах, где сходятся два отрезка линии.
Соответствует атрибуту stroke-linejoin в спецификации SVG 1.1. Допустимые значения: miter, round, bevel.
Имя переменной: | strokeLineJoin |
Записи: | 1 |
Формат записи:
Имя поля | Тип | Описание |
|---|---|---|
strokeLineJoin | Sting (nullable, расширяемая) | Стиль соединения углов при обводке |
Цвет заливки
Указывает цвет, используемый для заливки внутренней части элемента. Он может быть задан с помощью значений цвета, например шестнадцатеричного, RGB или именованных цветов.
Имя переменной: | fill |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
fill | Цветной | Цвет заливки |
Координата X
Представляет собой горизонтальное положение элемента. Указывает, на каком расстоянии от левой части холста SVG должен располагаться левый край элемента.
Имя переменной: | x |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
x | Float | Координата X |
Координата Y
Представляет собой вертикальное положение элемента. Определяет, на каком расстоянии от вершины холста SVG должен находиться верхний край элемента.
Имя переменной: | y |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
y | Float | Координата Y |
Точка начала преобразования
Определяет опорную точку, вокруг которой применяются все преобразования. Эта точка служит якорем для элемента и определяет, как он будет вращаться или масштабироваться.
Точку начала преобразования можно настроить, перетаскивая опорную точку на холсте, выбрав значение из выпадающего списка или указав координаты X и Y в пикселях или процентах.
Это свойство имеет несколько значений для выбора:
верхний левый угол
верхний центр
верхний правый угол
центр слева
центр в центре
центр справа
нижний левый угол
нижний центр
нижний правый угол
Имя переменной: | transformOrigin |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
transformOrigin | String | Точка начала преобразования |
Вращение
Определяет угол поворота элемента в градусах. Положительные значения поворачивают элемент по часовой стрелке.
Если элемент является частью группы, группа также может быть повернута. Каждый элемент внутри группы сохраняет свое собственное значение поворота и может быть повернут независимо от группы.
Это свойство отражает общий угол поворота элемента, учитывая его собственный угол поворота и угол поворота всех родительских групп. Например, если группа повернута на 30° и содержит прямоугольник, повернутый на 20°, прямоугольник будет отображаться как повернутый на 50°.
Имя переменной: | rotation |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
rotation | Double | Вращение |
Ширина
Определяет горизонтальный размер или ширину элемента. Измеряется в пользовательских координатах.
Имя переменной: | width |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
width | Float | Ширина |
Высота
Определяет вертикальный размер или высоту элемента. Измеряется в пользовательских координатах.
Имя переменной | height |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
height | Float | Высота |
Свойства элемента Текст
Помимо общих свойств, элементы Текст имеют следующие свойства.
Текст
Определяет текстовое содержимое элемента.
Имя переменной | text |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
text | String | Текст |
Смещение по Y
Указывает вертикальное смещение текста. Соответствует атрибуту 'dy', определенному в спецификации SVG 1.1.
Имя переменной | dy |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
dy | Float | Смещение по Y |
Смещение по X
Указывает горизонтальное смещение текста. Соответствует атрибуту 'dx', определенному в спецификации SVG 1.1.
Имя переменной | dx |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
dx | Float | Смещение по x |
Начертание шрифта
Указывает вес шрифта из следующих вариантов:
Светлый
Полужирный
Жирнее
Обычный
Имя переменной | fontWeight |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
fontWeight | String | Начертание шрифта |
Размер шрифта
Установка размера шрифта в пикселях.
Имя переменной | fontSize |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
fontSize | Integer | Размер шрифта |
Семейство шрифта
Укажите нужный шрифт, который будет применен к тексту.
Имя переменной | fontFamily |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
fontFamily | String | Семейство шрифта |
Свойства линейного элемента
Следующие свойства доступны для элементов линии.
Первая X координата
Обозначает координату по оси X первой точки линии. Соответствует атрибуту 'x1', определенному в спецификации SVG 1.1.
Имя переменной | x1 |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
x1 | Float | Первая координата X |
Первая Y координата
Обозначает координату по оси Y первой точки линии. Соответствует атрибуту 'y1', определенному в спецификации SVG 1.1.
Имя переменной | y1 |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
y1 | Float | Первая Y координата |
Вторая X координата
Обозначает координату по оси X второй точки линии. Соответствует атрибуту 'x2', определенному в спецификации SVG 1.1.
Имя переменной | x2 |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
x2 | Float | Вторая X координата |
Вторая Y координата
Обозначает координату по оси Y второй точки линии. Соответствует атрибуту 'y2', определенному в спецификации SVG 1.1.
Имя переменной | y2 |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
y2 | Float | Вторая Y координата |
Свойства элементов окружности
Дополнительные свойства, применяемые к элементам окружности.
Радиус
Определяет размер окружности от ее центра до периметра. Соответствует атрибуту 'r', определенному в спецификации SVG 1.1.
Имя переменной | r |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
r | Float | Радиус |
Координата CX
Указывает X-координату центра окружности. Соответствует атрибуту 'cx', определенному в спецификации SVG 1.1.
Имя переменной | cx |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
cx | Float | Координата CX |
Координата CY
Указывает координату Y центра окружности. Соответствует атрибуту 'cy', определенному в спецификации SVG 1.1.
Имя переменной | cy |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
cy | Float | Координата CY |
Свойства прямоугольника
Дополнительные свойства, применяемые к элементам прямоугольника.
Радиус X
Радиус X эллипса, используемого для скругления углов закругленного прямоугольника. Соответствует атрибуту 'rx', определенному в спецификации SVG 1.1.
Имя переменной | rx |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
rx | Float | Радиус X |
Радиус Y
Радиус оси Y эллипса, используемого для скругления углов закругленного прямоугольника. Соответствует атрибуту 'ry', определенному в спецификации SVG 1.1.
Имя переменной | ry |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
ry | Float | Радиус Y |
Свойства элементов эллипса
Дополнительные свойства, применяемые к элементам эллипса.
Координата CX
Указывает X-координату центра эллипса. Соответствует атрибуту 'cx', определенному в спецификации SVG 1.1.
Имя переменной | cx |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
cx | Float | Координата CX |
Координата CY
Указывает координату Y центра эллипса. Соответствует атрибуту 'cy', определенному в спецификации SVG 1.1.
Имя переменной | cy |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
cy | Float | Координата CY |
Радиус X
Управляет округлением эллипса относительно оси X. Соответствует атрибуту 'rx', определенному в спецификации SVG 1.1.
Имя переменной | rx |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
rx | Float | Радиус X |
Радиус Y
Управляет округлением эллипса относительно оси Y. Соответствует атрибуту 'ry', определенному в спецификации SVG 1.1.
Имя переменной | ry |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
ry | Float | Радиус Y |
Свойства элементов полигонов и полилиний
Следующие свойства применяются к элементам полигонов и полилиний.
Точки
Строка, определяющая список точек, которые определяют элемент полигона или полилинии. Соответствует атрибуту 'Точки', определенному в спецификации SVG 1.1.
Имя переменной | точки |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
точки | String | Точки |
Свойства элементов пути
Следующие свойства применяются к элементам пути.
Путь
Строка, определяющая путь полигона или полилинии. Соответствует атрибуту 'd', определенному в спецификации SVG 1.1.
Имя переменной | d |
Записи: | 1 |
Формат записи:
Имя поля | Тип поля | Описание поля |
d | String | Путь |
Was this page helpful?