score:3

Accepted answer

You can turn a DOM node into a D3 selection using d3.select(). You cannot turn a DOM node into a D3 selection using selection.selectAll(). The code you want is

d3.select(personG) 
    .selectAll("circle.person")  // create new circles within g node
    // ...

Note two important points:

  1. The root of the statement is the global d3. not the selection svg.
  2. The selection is made using select() not selectAll()

Meetamit has it exactly correct.

score:1

You can turn a single DOM node into a D3 selection using d3.select():

If the selector is not a string, instead selects the specified node; this is useful if you already have a reference to a node, such as this within an event listener or a global such as document.body

Further, you can turn an array of DOM node into a d3 selection using d3.selectAll():

If the selector is not a string, instead selects the specified array of nodes; this is useful if you already have a reference to nodes, such as this.childNodes ...


Related Query