D3 Выбор элемента внутри SVG

Question

Я пытаюсь создать несколько графиков в D3. Пока это нравится, но я немного застрял. Я хочу создать одну область для хранения точек данных, а другую - для хранения оси и меток. Я думаю, что поеду еще более мелкозернистым, чем это сделать, чтобы повысить эффективность графика. Но проблема, с которой я сталкиваюсь, заключается в том, что я не могу выбрать подэлементы в SVG.

Вот что у меня есть:

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") 

Теперь я не нашел способ, чтобы выбрать этот контейнер данных. Я пробовал

d3.select("#Graph svg data") 

Но не повезло. Есть идеи?

Answer 1

Давайте попробуем этот код.

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

«g» означает выбор всего узла «g» под узлом svg.

Answer 2

При создании контейнера данных с помощью append вы можете сохранить выбор в переменной.

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

Если все сделано таким образом, вам не нужно, чтобы сделать выбор (аналогично, как вы сделали с графиком на 1-й линии), так как он уже находится в вашем вар dataContainer.