D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
Fil
Full window
Github gist
getBoundingClientRect
forked from
mbostock
's block:
getBBox
<!DOCTYPE html> <meta charset="utf-8"> <body> <script src="//d3js.org/d3.v3.min.js"></script> <script> var svg = d3.select("body").append("svg") .attr("width", 960) .attr("height", 500); var text = svg.append('g') .attr("transform", "translate(100,40) scale(0.31)") .append("text") .attr("x", 80) .attr("y", 250) .attr("dx", "5.35em") .attr("dy", ".35em") .attr("text-anchor", "middle") .style("font", "300 128px Helvetica Neue") .text("Hello, getBoundingClientRect!"); var clientrect = text.node().getBoundingClientRect(), svgrect = svg.node().getBoundingClientRect(); var rect = svg.append("rect") .attr("x", clientrect.left - svgrect.left) .attr("y", clientrect.top - svgrect.top) .attr("width", clientrect.width) .attr("height", clientrect.height) .style("fill", "#ccc") .style("fill-opacity", ".3") .style("stroke", "#666") .style("stroke-width", "1.5px"); </script>
https://d3js.org/d3.v3.min.js