Menu
I work on a d3js project and I saw some tutorial with append("g") and other with append("svg:g") without getting the difference between both.
850
4) Create our SVG - We then append a g element to our SVG element so that everything added to the g element will be grouped together. The transformation is used to move our coordinate grid down by 200 pixels.
It appends a 'g' element to the SVG. g element is used to group SVG shapes together, so no it's not d3 specific.
The <g> SVG element is a container used to group other SVG elements. Transformations applied to the <g> element are performed on its child elements, and its attributes are inherited by its children. We can create a group element with D3. js by appending a g element using any selection.
append() function is used to append a new element to the HTML tag name as given in the parameters to the end of the element. If the type that is given is a function then it must be evaluated for each element that is in the selection. Syntax: selection.
In the very early days of D3 you were required to use the svg:g syntax because of the way SVG elements are appended to the DOM. Later versions of D3 don't require these "hints" to insert SVG elements, so the proper way to do this now would be with a simple g.
The technical details behind this are rather dull, SVG requires a namespace, so when you insert or manipulate SVG elements you use document.createElementNS('a', "http://www.w3.org/2000/svg) white plain HTML uses document.createElement('a'). Since D3 can manipulate both SVG and HTML d3.append('svg:a') was a way of saying this is an SVG anchor.
165
I got an answer on d3js API, its a namespace question. In svg:g, svg is the namespace (optional). My fault, sorry i must better read API
33
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
