Фигура (shape)

Примитивы shape — произвольные фигуры, геометрия которых определяется во время отрисовки. В отличие от примитивов path, которым нужна строка пути SVG, shape использует объект фигуры с функцией рисования, вызываемой при отрисовке. При выводе на Canvas это может ускорить работу, поскольку не нужно разбирать промежуточное представление вроде пути SVG.

Основное применение shape — динамические карты, где объект фигуры создаётся преобразованием geoshape.

Свойства примитива shape

Свойство Тип Описание
shape Shape Объект фигуры с методом рисования, вызываемым средством отрисовки. Его нельзя задать напрямую: он должен быть создан преобразованием данных, например geoshape.

Общие свойства примитивов

Свойство Тип Описание
x Number Основная координата x в пикселях.
x2 Number Дополнительная координата x в пикселях.
xc Number Координата центра по x. Несовместима с x и x2.
width Number Ширина примитива в пикселях, если поддерживается.
y Number Основная координата y в пикселях.
y2 Number Дополнительная координата y в пикселях.
yc Number Координата центра по y. Несовместима с y и y2.
height Number Высота примитива в пикселях, если поддерживается.
opacity Number Непрозрачность примитива от 0 (прозрачный) до 1 (непрозрачный).
fill Color Цвет заливки.
fillOpacity Number Непрозрачность заливки от 0 до 1.
stroke Color Цвет обводки.
strokeOpacity Number Непрозрачность обводки от 0 до 1.
strokeWidth Number Толщина обводки в пикселях.
strokeCap String Вид конца линии: butt (по умолчанию), round или square.
strokeDash Number[ ] Массив длин штрихов и промежутков для пунктирной или точечной линии.
strokeDashOffset Number Смещение начала штрихового узора в пикселях.
strokeJoin String Вид соединения сегментов обводки: miter (по умолчанию), round или bevel.
strokeMiterLimit Number Предел заострения соединения, после которого оно срезается.
blend String Режим смешивания цвета примитива с фоном. Допускается любое значение CSS mix-blend-mode, кроме "normal". Значение по умолчанию null соответствует режиму normal для SVG и source-over для Canvas.
cursor String Вид указателя мыши над примитивом. Допускается любое корректное значение CSS cursor.
href URL Адрес, открываемый при щелчке. Если задан, примитив действует как гиперссылка.
tooltip Any Текст подсказки при наведении. Если значение — объект (кроме Date или массива), каждая пара «ключ — значение» показывается на отдельной строке, например "key1: value1\nkey2: value2". Массивы показываются в квадратных скобках [value1, value2, ...]. Остальные значения преобразуются в строки. Вложенные объекты не раскрываются рекурсивно.
zindex Number Целое число, задающее порядок наложения соседних экземпляров примитива. По умолчанию 0; элементы с большим значением рисуются поверх элементов с меньшим. При использовании в кодировании влияет только на порядок внутри одного набора и не меняет слой относительно других определений примитивов. В отличие от свойства sort на уровне определения примитива, zindex меняет только порядок отрисовки, но не порядок самих элементов, например точек линии или области. Обычно его используют, чтобы выделенный элемент рисовался поверх соседних.

У примитивов, поддерживающих ширину и высоту (включая rect и area), горизонтальный размер определяется в таком порядке приоритета: свойствами x и x2, затем x и width, затем x2 и width, затем xc и width. Если указаны все три свойства — x, x2 и width, — значение width игнорируется. Свойства y, y2, yc и height обрабатываются аналогично.

Для примитивов без ширины или высоты (включая path и arc) применяются похожие вычисления, но они определяют только итоговое положение по x и y. Свойство width может повлиять на итоговую координату x, но само по себе не отображается.

Если для одного измерения используются несколько координатных свойств (x и x2 либо y и y2), их нужно задавать в одном наборе кодирования, например вместе в "enter": {...} или в "update": {...}. Разделение между наборами может привести к неожиданному результату.

Свойства доступности ≥ 5.11

Свойства доступности определяют атрибуты ARIA при выводе SVG. Vega автоматически создаёт атрибуты ARIA для элементов контейнера SVG <g> в каждом определении примитива; это настраивается через свойства доступности примитива. Приведённые ниже свойства задаются в наборах кодирования и добавляют атрибуты ARIA отдельным экземплярам.

Свойство Тип Описание
aria Boolean Логический признак (по умолчанию true), определяющий, нужно ли добавлять атрибуты ARIA при выводе SVG. При false элемент SVG получает атрибут aria-hidden и исключается из дерева доступности.
description String Текстовое описание экземпляра примитива для ARIA (только при выводе SVG). Если задано, становится значением атрибута aria-label.