score:20
Accepted answer
myrect is a d3 selection and not an html element.
try this code:
myrect.node().getbbox();
var svgcontainer = d3.select("svg");
var myrect = svgcontainer.append("text")
.attr("x", 10)
.attr("y", 20)
.text("lorem ipsum")
.attr("font-weight", "bold")
.attr("fill", "white");
console.log("getbbox = ", myrect.node().getbbox());
svg{
background: green;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<svg width="500" height="800"></svg>
Source: stackoverflow.com
Related Query
- Why can't I get the Bounding Box of this d3.js text?
- How can I get the bounding box values of all the text elements in a selection?
- D3: get the bounding box of a selected element
- D3js : How to get the real bounding box of features crossing the anti-meridian?
- get the bounding box of a D3 graph
- Why text goes out of the box while using D3 Word Cloud example by Jason Davies?
- In a d3 line chart, how do I create a bounding box behind my text that is the same size as what I'm mousing over?
- Why does this D3 code add the <p> element outside the body, instead of inside it?
- how do i customise the c3.js chart to get like this
- D3.js - How can I add a new line to the text in this Collapsible Tree?
- Why does this syntax work over the other one with d3.json requests?
- Why are my images not showing up in the nodes of this D3 chart?
- Get click event from SVG bounding box using d3js
- adding input text box on clicking the data labels d3.js
- Why isn't my text displaying in the svg axis label? (D3 Margin Convention)
- Why does this code work for counting one item in a list but not the others?
- Why does this d3 chart render with crosses, then get rid of them upon moving a node?
- Why the line in this D3 chart isn't properly displayed when updated?
- Get bounding box of individual countries from topojson
- How to get the same text of each elements in heat map as the y axis label?
- Why image doesn't attach to the nodes in this d3 code?
- Why is d3.histogram merging the last two bins of this chart?
- why is the y position of text and rect different in svg?
- Why are the first two text labels of my bar chart not shown?
- Why dont the axis tick marks get removed?
- D3 - why is this sort function not updating all the elements in its selection?
- Why are the text labels in d3 transforming to zero on pan/zoom?
- d3.js - Why does my SVG tags get added inside the HTML tag
- Bold the text partially in a text box which popos up on mouseover-D3
- Why does D3 not update the text
More Query from same tag
- D3 link circle by node's names
- D3.js line chart - positioning the dots
- How to display property text on mouseover in d3 map
- Zoomable Sunburst with Labels issue
- D3: Example for hierarchical Matrix example
- Add a select box for a d3 network diagram
- d3.js: Transition the colours in an SVG linear gradient?
- Why is my D3 zoom transform not centering properly?
- Highlight specific link in D3.JS sankey diagram
- Text shadows and zooming
- Unable to get click event in D3 JavaScript library
- Editing element data for each element in a selectAll in d3
- Ajax D3.js Table based on CSV
- Updatable chord diagram
- d3 Bubble Chart positioning and text in side bubbles
- using CSV property to set link length, node size d3
- Iterating over all tick marks except the last one
- D3 graph is missing as much text elements as there are ticks in axis
- SVG markers not appearing in Edge and Firefox (D3.js, Angular2)
- Convert text header of image appended to node in typical graph of nodes and link, to image in D3
- D3: two x-axis with independent zoom behavior
- Cannot visualize percentage numbers (getting NaN)
- Create links from node border to node border, not center to center
- Transition partition arcs back to original angles
- plotting tick text above the axis
- c3js - Change point color on focus
- Convert string timestamp to hour axis
- D3JS with Kibana
- How to scale each node, represented as a pie chart, in a graph on mouse over using D3
- reference to angular's function from d3 data enter