Получить ограничительную рамку для пути SVG с помощью jQuery

Ответ 1

getBBox - это собственный SVG-метод и не является частью jquery, поэтому вам нужно написать

$("#"+ path id)[0].getBBox()

пример

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

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

Ответ 2

Собственная реализация getBBox() в Webkit не работает, вы можете найти здесь отладчик ошибок. Фактически It исправлено сейчас

Решение состоит в использовании библиотеки SVG, которая имеет собственные алгоритмы для вычисления таких вопросов, одна из которых Raphael.js.

Вы можете использовать element.getBBox(), который делает то же самое, что и нативный getBBox().

Ответ 3

Мне тоже тяжело получить синтаксис JQuery для работы. Это вернуло Uncaught TypeError: Object [object Object] не имеет метода getBBox:

console.log($("#testtext").getBBox().width);

... потому что я опустил индекс массива (спасибо @Christian Vielma, ниже)!

Однако стандартный Javascript работал у меня, и я смог отобразить ширину (в моем случае) RECT в консоли Chrome:

console.log(document.getElementById("testtext").getBBox().width);

Итак, вы можете попробовать это.

Ответ 4

Попробуйте Element.getBoundingClientRect(). Это из HTML DOM, но у меня работает на SVG-элементах (без особых преобразований).

Ответ 5

Чтобы убедиться, что ваш svg добавлен в DOM, а не отключен. Также убедитесь, что ваш элемент SVG