Как получить ширину элемента svg с помощью d3js?
Я использую d3js, чтобы найти ширину элемента svg, приведенный ниже:
<script>
var body = d3.select("body");
console.log(body);
var svg = body.select("svg");
console.log(svg);
console.log(svg.style("width"));
</script>
<svg class="svg" height="3300" width="2550">
<image x="0" y="0" height="3300" width="2550" xlink:href="1.jpg"></image>
<rect class="word" id="15" x="118" y="259" width="182" height="28"
text="Substitute"></rect>
</svg>
Но он вернул эту ошибку:
Uncaught TypeError: Невозможно вызвать метод getPropertyValue из null
Я думаю, переменная svg является нулевым массивом.
Как я могу получить ширину элемента svg с помощью d3js?
Ответы
Ответ 1
<svg class="svg" height="3300" width="2550">
<image x="0" y="0" height="3300" width="2550" xlink:href="1.jpg"></image>
<rect class="word" id="15" x="118" y="259" width="182" height="28"
text="Substitute"></rect>
</svg>
<script>
var body = d3.select("body");
console.log(body);
var svg = body.select("svg");
console.log(svg);
console.log(svg.style("width"));
</script>
Просто поместите свой script после того, как элемент svg будет загружен браузером, и все будет в порядке.
Ответ 2
если у вас есть элемент SVG w/id = frame...
frame = d3.select('#frame')
.attr('class', 'frame')
fh = frame.style("height").replace("px", "");
fw = frame.style("width").replace("px", "");
fh и fw теперь могут использоваться в математических выражениях.
вы также можете вернуться к jQuery
fw = console.log($("#frame").width());
fh = console.log($("#frame").height());
которые являются числами и могут использоваться в математических выражениях
Ответ 3
var svg = d3.select("body")
.append("svg")
.attr("width", "100%")
.attr("height", "100%");
var w = parseInt(svg.style("width"), 10);
var h = parseInt(svg.style("height"), 10);
Ответ 4
Попробуйте использовать svg.attr( "width" ). Он просто дает строчную строку.
Ответ 5
Если этот svg сохраняется в переменной, например:
var vis = d3.select("#DivisionLabel").append("svg")
.attr("width", "100%")
.attr("height", height);
Тогда непосредственно можно использовать переменную vis
, чтобы получить ширину svg:
console.log(vis.style("width"));
Результат - в единице "px". Обратите внимание, что vis.style( "width" ) возвращает строку.