javascript - una - D3 Seleccionar un elemento dentro de un SVG

qué elemento html se usa para mostrar una medición escalar dentro de un rango

Question

Estoy tratando de crear algunos gráficos en D3. Hasta el momento me encanta, pero me estoy quedando un poco atrapado. Quiero crear un área para contener los puntos de datos y otra para contener el eje y las etiquetas. Creo que iré incluso más fino que eso para hacer que la actualización del gráfico sea más eficiente. Pero el problema que estoy teniendo es que parece que no puedo seleccionar elementos secundarios dentro del SVG.

Esto es lo que tengo:

var graph = d3.select(''#Graph svg'')
if (graph[0][0] == null){
    graph = d3.select(''#Graph'')
        .append("svg:svg")
        .attr("width",width)
        .attr("height",height)
        .attr("class","chart");
}

graph.append("svg:g")
    .attr("id","data")

Ahora no he encontrado una manera de seleccionar ese contenedor de datos. Yo he tratado

d3.select("#Graph svg data")

Pero sin suerte. ¿Algunas ideas?

Answer 1

Al crear su contenedor de datos con append , puede guardar la selección en una variable.

var dataContainer = graph.append("svg:g")
    .attr("id","data");

Si lo hace de esta manera, no tendrá que hacer la selección (de manera similar a como lo hizo con el gráfico en la 1.ª línea), porque ya está almacenado en su var dataContainer .

Answer 2

Probemos este código

d3.select("#Graph svg").selectAll("g")

"g" significa seleccionar todo el nodo "g" debajo del nodo svg.