Все сервисы Хабра
Сообщество IT-специалистов
Ответы на любые вопросы об IT
Профессиональное развитие в IT
Закрыть
Задать вопрос
Дима Паутов
@bootd
Гугли и ты откроешь врата знаний!
JavaScript
SVG
Как узнать ширину и высоту элемента path с помощью javascript?
Мне нужно узнать размер элемента path в моём svg. Но беда в том, что используя метод width(), то значение я получаю 0
Вопрос задан
более трёх лет назад
2552 просмотра
Комментировать
Подписаться
2
Оценить
Комментировать
Facebook
Вконтакте
Twitter
Решения вопроса
1
teotlu
@teotlu
Навёрстываю упущенное
clientWidth не работает, проверил.
Зато сработает
вот это
. На всякий случай тоже проверил, работает.
Ответ написан
более трёх лет назад
12
комментариев
Нравится
12
комментариев
Facebook
Вконтакте
Twitter
Дима Паутов
@bootd
Автор вопроса
А можно ваш пример? У меня не срабатывает, ошибка
Вот пример: console.log(el.getBoundingClientRect). Пишет: el.getBoundingClientRect is not a function
Написано
более трёх лет назад
Александр
@lebonnet
аналогично
jsfiddle.net/2prybs45
Написано
более трёх лет назад
Дима Паутов
@bootd
Автор вопроса
lebonnet
: такой вопрос, почему он через $('path') не хочет, а document.getElementsByTagName('path') хочет?
Написано
более трёх лет назад
Денис Инешин
@IonDen
Дима Турков
: $('path') возвращает jQuery объект, а не ноду. Чтобы из jQuery объекта эту ноду выдрать, нужно сделать так: $('path')[0]
Написано
более трёх лет назад
Александр
@lebonnet
Дима Турков
:
Денис Инешин
: у меня не получилось ни через jQuery, ни нативно, у кого заработало покажите пример.
Написано
более трёх лет назад
Евгений Петров
@Petroveg
Денис Инешин
: Самое удивительное, что getElementsByTagName вернёт коллекцию, из которой нужно дёргать узел или по индексу, или по имени...
Написано
более трёх лет назад
Денис Инешин
@IonDen
lebonnet
: вот пример на чистом JS:
jsfiddle.net/IonDen/refm825y
Написано
более трёх лет назад
Александр
@lebonnet
Евгений Петров
: точно, блин там же массив!
jsfiddle.net/2prybs45/1
Написано
более трёх лет назад
teotlu
@teotlu
jsfiddle.net/ce0twtgu/2
— вот пример. Выдрал из какого-то своего svg кусок.
Написано
более трёх лет назад
Евгений Петров
@Petroveg
lebonnet
: Только getBoundingClientRect и getClientRects — трудоёмкие операции. Выполняйте запрос 1 раз, после чего уже обращаетесь к свойствам.
Написано
более трёх лет назад
Евгений Петров
@Petroveg
lebonnet
: И getElementsByTagName вернёт коллекцию, а не массив. Похоже, но не одно и то же.
Написано
более трёх лет назад
Дима Паутов
@bootd
Автор вопроса
Многое узнал. Большое спс всем!
Написано
более трёх лет назад
Пригласить эксперта
Ответы на вопрос
1
Дмитрий
@dmitrynod
попробуй $('svg#test').get(0).clientWidth должно сработать
Ответ написан
более трёх лет назад
3
комментария
Нравится
3
комментария
Facebook
Вконтакте
Twitter
Дима Паутов
@bootd
Автор вопроса
Я исправил вопрос, мне не сам SVG элемент нужен, а его дочерние, в моем случае это элемент path!
Написано
более трёх лет назад
Дмитрий
@dmitrynod
Дима Турков
: селектор просто для примера. Так же можно выбрать path и от него уже get(0).clientWidth
Написано
более трёх лет назад
teotlu
@teotlu
Дмитрий
: это не работает.
Написано
более трёх лет назад
Ваш ответ на вопрос
Войдите, чтобы написать ответ
Войти через центр авторизации
Похожие вопросы
JavaScript
+3 ещё
Простой
Почему при отправке HTML-формы данные не поступают в mysql?
1 подписчик
25 июл.
143 просмотра
1
ответ
JavaScript
Простой
Как получить переменную из esm-модуля?
1 подписчик
24 июл.
119 просмотров
1
ответ
JavaScript
+2 ещё
Простой
Как сделать так чтоб push уведомления отправлялись в фоне при открытом но неактивном pwa приложении?
1 подписчик
24 июл.
55 просмотров
0
ответов
JavaScript
+2 ещё
Средний
Есть для готовый плагин для проверки css-переменных со следующими фичами (см. описание)?
1 подписчик
24 июл.
54 просмотра
0
ответов
JavaScript
+1 ещё
Простой
Каким образом отлавливать и корректно устранять конкурирующие запросы javascript на сайте?
1 подписчик
21 июл.
495 просмотров
1
ответ
JavaScript
Простой
Как улучшить изображение от генерации pdf в изображение?
1 подписчик
21 июл.
99 просмотров
1
ответ
JavaScript
Простой
Как в javascript сделать увеличение последующего значения на определенное число?
1 подписчик
19 июл.
210 просмотров
2
ответа
JavaScript
+1 ещё
Простой
Как сделать zoom в smartslider?
1 подписчик
16 июл.
52 просмотра
0
ответов
JavaScript
Простой
Переменная, созданная в разных местах работает в addEventListener по-разному, почему?
2 подписчика
16 июл.
197 просмотров
2
ответа
JavaScript
+1 ещё
Простой
Как сделать, чтобы свойства класса прописывались не DOM-узлу, а классу, создаваемому в JS?
1 подписчик
14 июл.
159 просмотров
2
ответа
Показать ещё
Загружается…
Вакансии с Хабр Карьеры
JavaScript Developer (KSC)
Лаборатория Касперского
•
Москва
JavaScript Developer (NGFW)
Лаборатория Касперского
Frontend developer (JavaScript, jQuery)
Karma8
от 150 000 до 320 000 ₽
Минуточку внимания
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.
Войти через центр авторизации
Закрыть
Реклама