Spec-Zone.ru › Web APIs

SVGSVGElement

Базовая Широко поддерживается *

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с января 2020 года.

* Некоторые части этой функции могут иметь различный уровень поддержки.

  • Подробнее
  • Полная совместимость
  • Отправить отзыв

Интерфейс SVGSVGElement предоставляет доступ к свойствам элементов <svg>, а также методы для их управления. Этот интерфейс также содержит различные вспомогательные методы общего использования, такие как операции с матрицами и возможность управления временем перерисовки на устройствах визуального отображения.

EventTarget Node Element SVGElement SVGGraphicsElement SVGSVGElement

Свойства экземпляра

Этот интерфейс также наследует свойства от своего родителя, SVGGraphicsElement.

SVGSVGElement.x Только для чтения

Анимационное SVGAnimatedLength значение, соответствующее атрибуту x заданного элемента <svg>.

SVGSVGElement.y Только для чтения

Анимационное SVGAnimatedLength значение, соответствующее атрибуту y заданного элемента <svg>.

SVGSVGElement.width Только для чтения

Анимационное SVGAnimatedLength значение, соответствующее атрибуту width заданного элемента <svg>.

SVGSVGElement.height Только для чтения

Анимационное SVGAnimatedLength значение, соответствующее атрибуту height заданного элемента <svg>.

SVGSVGElement.pixelUnitToMillimeterX Устаревшее

Число с плавающей точкой, представляющее размер пикселя (как определено в CSS2) вдоль оси x области просмотра, что соответствует значению где-то в диапазоне от 70 dpi до 120 dpi. В системах, поддерживающих это, оно может фактически соответствовать характеристикам целевого носителя. В системах, где невозможно определить размер пикселя, используется подходящее значение по умолчанию.

SVGSVGElement.pixelUnitToMillimeterY Устаревшее

Число с плавающей точкой, представляющее размер пикселя вдоль оси y области просмотра.

SVGSVGElement.screenPixelToMillimeterX Устаревшее

События пользовательского интерфейса (UI) в DOM Level 2 указывают координаты экрана, в которых произошло данное событие UI. Когда браузер фактически знает физический размер «единицы экрана», этот атрибут с плавающей точкой отражает эту информацию; в противном случае пользовательские агенты предоставляют подходящее значение по умолчанию (например, .28mm).

SVGSVGElement.screenPixelToMillimeterY Устаревшее

Соответствующий размер пикселя экрана по оси y области просмотра.

SVGSVGElement.useCurrentView Устаревшее Нестандартный

Начальный вид (т.е., до масштабирования и перемещения) текущего внутреннего фрагмента документа SVG может быть либо «стандартным», т.е., основанным на атрибутах элемента <svg>, таких как viewBox, либо на «пользовательском» виде (т.е., гиперссылка на определённый элемент <view> или другой элемент). Если начальный вид «стандартный», то этот атрибут false. Если начальный вид «пользовательский», то этот атрибут true.

SVGSVGElement.currentView Устаревшее Нестандартный

Объект SVGViewSpec, определяющий начальный вид (т.е., до масштабирования и перемещения) текущего внутреннего фрагмента документа SVG. Значение зависит от ситуации: Если начальный вид был «стандартным», то:

  • значения для viewBox, preserveAspectRatio и zoomAndPan внутри currentView будут соответствовать значениям соответствующих атрибутов DOM, которые находятся в SVGSVGElement напрямую
  • значение для transform внутри currentView будет null

Если начальный вид был ссылкой на элемент <view>, то:

  • значения для viewBox, preserveAspectRatio и zoomAndPan внутри currentView будут соответствовать соответствующим атрибутам данного элемента <view>
  • значение для transform внутри currentView будет null

Если начальный вид был ссылкой на другой элемент (кроме <view>), то:

  • значения для viewBox, preserveAspectRatio и zoomAndPan внутри currentView будут соответствовать значениям соответствующих атрибутов DOM, которые находятся в SVGSVGElement напрямую для ближайшего предка элемента <svg>
  • значение для transform внутри currentView будет null

Если начальный вид был ссылкой на фрагмент документа SVG с использованием идентификатора фрагмента спецификации просмотра SVG (т.е., #svgView(…)), то:

  • значения для viewBox, preserveAspectRatio, zoomAndPan, transform внутри currentView будут соответствовать значениям из идентификатора фрагмента спецификации просмотра SVG
SVGSVGElement.currentScale

В элементе <svg>, этот атрибут с плавающей точкой указывает текущий коэффициент масштабирования относительно начального вида, учитывая операции масштабирования и перемещения пользователя. Атрибуты DOM currentScale и currentTranslate эквивалентны 2×3 матрице [a b c d e f] = [currentScale 0 0 currentScale currentTranslate.x currentTranslate.y]. Если включено «масштабирование» (т.е., zoomAndPan="magnify"), эффект заключается в том, что дополнительное преобразование размещается на самом внешнем уровне фрагмента документа SVG (т.е., вне самого внешнего элемента <svg>).

SVGSVGElement.currentTranslate Только для чтения

Объект SVGPoint, представляющий коэффициент смещения, учитывающий операции пользователя по «масштабированию», соответствующий самому внешнему элементу <svg>. Поведение не определено для элементов <svg> , которые не находятся на самом внешнем уровне.

Методы экземпляра

Этот интерфейс также наследует методы от своего родителя, SVGGraphicsElement.

SVGSVGElement.suspendRedraw() Устаревший

Принимает значение таймаута, которое указывает, что перерисовка не должна происходить до:

выполнения соответствующего unsuspendRedraw() вызова, выполнения unsuspendRedrawAll() вызова или истечения таймера.

В средах, не поддерживающих интерактивность (например, печать), перерисовка не будет приостановлена. Вызовы suspendRedraw() и unsuspendRedraw() должны, но не обязаны, выполняться в парных вызовах.

Чтобы приостановить действия перерисовки при выполнении набора изменений в SVG DOM, необходимо выполнить вызов метода, подобный следующему:

const suspendHandleID = suspendRedraw(maxWaitMilliseconds);

и после изменений выполнить вызов метода, подобный следующему:

unsuspendRedraw(suspendHandleID);

Обратите внимание, что несколько вызовов suspendRedraw() могут использоваться одновременно, и каждый такой вызов обрабатывается независимо от других вызовов метода suspendRedraw().

SVGSVGElement.unsuspendRedraw() Устаревший

Отменяет указанный suspendRedraw(), предоставив уникальный идентификатор обработчика приостановки, возвращённый предыдущим вызовом suspendRedraw().

SVGSVGElement.unsuspendRedrawAll() Устаревший

Отменяет все активные вызовы метода suspendRedraw(). Этот метод наиболее полезен в конце набора вызовов SVG DOM для того, чтобы убедиться, что все ожидающие вызовы метода suspendRedraw() были отменены.

SVGSVGElement.forceRedraw() Устаревший

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

SVGSVGElement.pauseAnimations()

Приостанавливает (т.е., останавливает) все выполняющиеся в настоящее время анимации, определенные внутри фрагмента SVG документа, соответствующего этому элементу <svg>, заставляя таймер анимаций соответствующего фрагмента документа остановиться, пока он не будет возобновлён.

SVGSVGElement.unpauseAnimations()

Возобновляет (т.е., возобновляет) текущие анимации, определённые внутри фрагмента SVG документа, заставляя таймер анимаций продолжить работу от времени, на котором он был приостановлен.

SVGSVGElement.animationsPaused()

Возвращает true если этот фрагмент SVG документа находится в состоянии паузы.

SVGSVGElement.getCurrentTime()

Возвращает текущее время в секундах, отнесённое к началу текущего фрагмента SVG документа. Если getCurrentTime() вызывается до начала временной шкалы документа (например, скриптом, выполняемым в элементе <script> до того, как событие SVGLoad документа было отправлено), то возвращается 0.

SVGSVGElement.setCurrentTime()

Корректирует часы для этого фрагмента SVG документа, устанавливая новое текущее время. Если setCurrentTime() вызывается до начала временной шкалы документа (например, скриптом, выполняемым в элементе <script> до того, как событие SVGLoad документа было отправлено), то значение секунд в последнем вызове метода задаёт время, к которому документ будет переведён, после того, как начнется временная шкала документа.

SVGSVGElement.getIntersectionList()

Возвращает NodeList элементов графики, содержимое которых пересекается с заданным прямоугольником. Каждый кандидатный графический элемент считается совпадением только в том случае, если тот же графический элемент может быть целевым для событий указания, как определено в pointer-events обработке.

SVGSVGElement.getEnclosureList()

Возвращает NodeList графических элементов, чьё рендерное содержимое полностью содержится в заданном прямоугольнике. Каждый кандидатный графический элемент рассматривается как совпадение только в том случае, если тот же графический элемент может быть целевым для событий указания, как определено в pointer-events обработке.

SVGSVGElement.checkIntersection()

Возвращает true если рендерное содержимое данного элемента пересекается с заданным прямоугольником. Каждый кандидатный графический элемент считается совпадением только в том случае, если тот же графический элемент может быть целевым для событий указания, как определено в pointer-events обработке.

SVGSVGElement.checkEnclosure()

Возвращает true если рендерное содержимое данного элемента полностью содержится в заданном прямоугольнике. Каждый кандидатный графический элемент считается совпадением только в том случае, если тот же графический элемент может быть целевым для событий указания, как определено в pointer-events обработке.

SVGSVGElement.deselectAll()

Снимает выделение с любых выделенных объектов, включая выделения текстовых строк и областей ввода.

SVGSVGElement.createSVGNumber()

Создаёт объект SVGNumber вне любых деревьев документов. Объект инициализирован значением 0.

SVGSVGElement.createSVGLength()

Создаёт объект SVGLength вне любых деревьев документов. Объект инициализирован значением 0 пользовательских единиц.

SVGSVGElement.createSVGAngle()

Создаёт объект SVGAngle вне любых деревьев документов. Объект инициализирован значением 0 градусов (без единиц).

SVGSVGElement.createSVGPoint()

Создаёт объект SVGPoint вне любых деревьев документов. Объект инициализирован точкой (0,0) в системе координат пользователя.

SVGSVGElement.createSVGMatrix()

Создаёт объект SVGMatrix вне любых деревьев документов. Объект инициализирован единичной матрицей.

SVGSVGElement.createSVGRect()

Создаёт объект SVGRect вне любых деревьев документов. Объект инициализирован так, что все значения установлены в 0 пользовательских единиц.

SVGSVGElement.createSVGTransform()

Создаёт объект SVGTransform вне любых деревьев документов. Объект инициализирован преобразованием единичной матрицы (SVG_TRANSFORM_MATRIX).

SVGSVGElement.createSVGTransformFromMatrix()

Создаёт объект SVGTransform вне любых деревьев документов. Объект инициализирован заданной матрицей преобразований (т.е., SVG_TRANSFORM_MATRIX). Значения из параметра матрицы копируются, параметр матрицы не используется как SVGTransform::matrix.

SVGSVGElement.getElementById()

Ищет в этом фрагменте SVG документа (т.е., поиск ограничен подмножеством дерева документа) элемент, чей id задан значением elementId. Если элемент найден, возвращается этот элемент. Если такого элемента не существует, возвращается null. Поведение не определено, если более одного элемента имеют этот идентификатор.

Обработчики событий

Следующие Window onXYZ обработчики событий также доступны как псевдонимы, направленные на объект window. Однако рекомендуется подписываться на них на объекте window напрямую, а не на SVGSVGElement.

Примечание: Использование addEventListener() на SVGSVGElement не сработает для обработчиков событий onXYZ перечисленных ниже. Подписывайтесь на события на объекте window вместо этого.

SVGSVGElement.onafterprint

Вызывается после того, как связанный документ начал печать или предварительный просмотр печати был закрыт.

SVGSVGElement.onbeforeprint

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

SVGSVGElement.onbeforeunload

Вызывается, когда окно, документ и его ресурсы должны быть загружены.

SVGSVGElement.ongamepadconnected

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

SVGSVGElement.ongamepaddisconnected

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

SVGSVGElement.onhashchange

Вызывается, когда идентификатор фрагмента URL был изменен (часть URL, начинающаяся с и следующая за символом #).

SVGSVGElement.onlanguagechange

Вызывается, когда меняется предпочтительный язык пользователя.

SVGSVGElement.onmessage

Вызывается, когда окно получает сообщение, например, из вызова Window.postMessage() из другого контекста просмотра.

SVGSVGElement.onmessageerror

Вызывается, когда окно получает сообщение, которое нельзя десериализовать.

SVGSVGElement.onoffline

Вызывается, когда браузер потерял доступ к сети, и значение Navigator.onLine переключается на false.

SVGSVGElement.ononline

Вызывается, когда браузер получил доступ к сети, и значение Navigator.onLine переключается на true.

SVGSVGElement.onpagehide

Вызывается, когда браузер скрывает текущую страницу в процессе отображения другой страницы из истории сеанса.

SVGSVGElement.onpageshow

Вызывается, когда браузер отображает документ окна из-за навигации.

SVGSVGElement.onpopstate

Вызывается, когда активная запись истории изменяется во время навигации по истории сеанса пользователем.

SVGSVGElement.onrejectionhandled

Вызывается всякий раз, когда JavaScript Promise отклоняется, и отклонение было обработано.

SVGSVGElement.onstorage

Вызывается, когда область хранения (localStorage) была изменена в контексте другого документа.

SVGSVGElement.onunhandledrejection

Вызывается всякий раз, когда Promise отклоняется, но отклонение не было обработано.

SVGSVGElement.onunload

Вызывается, когда документ загружается.

Спецификации

Спецификация
Scalable Vector Graphics (SVG) 2
# InterfaceSVGSVGElement

Совместимость с браузерами

Рабочий стол Мобильный
Chrome Edge Firefox Opera Safari Chrome Android Firefox for Android Opera Android Safari на IOS Samsung Internet WebView Android
SVGSVGElement 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
animationsPaused 1 79 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
checkEnclosure 1 12 1.5–21 ≤12.1 3 18 4–21 ≤12.1 1 1.0 3
checkIntersection 1 12 1.5–21 ≤12.1 3 18 4–21 ≤12.1 1 1.0 3
createSVGAngle 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
createSVGLength 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
createSVGMatrix 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
createSVGNumber 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
createSVGPoint 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
createSVGRect 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
createSVGTransform 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
createSVGTransformFromMatrix 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
currentScale 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
currentTranslate 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
currentView 21–56 Нет 1.5–21 15–43 7 25–56 4–21 14–43 7 1.5–6.0 4.4–56
deselectAll 1 12 25 ≤12.1 3 18 25 ≤12.1 1 1.0 3
forceRedraw 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
getCurrentTime 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
getElementById 7 12 1.5 ≤12.1 5.1 18 4 ≤12.1 5 1.0 3
getEnclosureList 1 12 Нет ≤12.1 3 18 Нет ≤12.1 1 1.0 3
getIntersectionList 1 12 Нет ≤12.1 3 18 Нет ≤12.1 1 1.0 3
height 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
pauseAnimations 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
preserveAspectRatio 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
setCurrentTime 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
suspendRedraw 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
unpauseAnimations 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
unsuspendRedraw 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
unsuspendRedrawAll 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
useCurrentView 1–56 Нет 15–107 ≤12.1–43 3 18–56 15–107 ≤12.1–43 1 1.0–6.0 ≤37–56
viewBox 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
width 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
x 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3
y 1 12 1.5 ≤12.1 3 18 4 ≤12.1 1 1.0 3

См. также

  • <circle>

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/SVGSVGElement

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API