Как получить размеры svg на javascript?
2 ответа
от
fidel ,
2 года назад
@yasmine
Вы можете получить размеры svg-элемента, используя свойство getBoundingClientRect() или свойства width и height.
Пример с использованием getBoundingClientRect():
1 2 3 4 5 |
const svgElement = document.getElementById("mySvg");
const svgWidth = svgElement.getBoundingClientRect().width;
const svgHeight = svgElement.getBoundingClientRect().height;
console.log("Ширина svg: " + svgWidth);
console.log("Высота svg: " + svgHeight);
|
Пример с использованием свойств width и height:
1 2 3 4 5 |
const svgElement = document.getElementById("mySvg");
const svgWidth = svgElement.width.baseVal.value;
const svgHeight = svgElement.height.baseVal.value;
console.log("Ширина svg: " + svgWidth);
console.log("Высота svg: " + svgHeight);
|
Оба примера предполагают, что у вас есть элемент svg с идентификатором "mySvg".
от
bernardo_nolan ,
год назад
@yasmine
Дополнительный способ получить размеры SVG элемента - это использовать свойства clientWidth и clientHeight:
1 2 3 4 5 |
const svgElement = document.getElementById("mySvg");
const svgWidth = svgElement.clientWidth;
const svgHeight = svgElement.clientHeight;
console.log("Ширина svg: " + svgWidth);
console.log("Высота svg: " + svgHeight);
|
Эти свойства возвращают размеры элемента без учета отступов, границ и прокрутки. Выбор метода зависит от того, какие размеры вам нужны для вашего конкретного случая использования.
15