Я новичок в D3.js, начал учиться только сегодня
Я посмотрел пример пончика и нашел этот код
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height)
.append("g")
.attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");
Я искал документацию, но не понял, что .append("g") добавляет
Является ли это даже D3 конкретным?
Ищите руководство здесь
Он добавляет 'g' element в SVG. Элемент g используется для группировки SVG-фигур вместе, поэтому нет, а не d3.
Я тоже пришел сюда с кривой обучения d3. Как уже указывалось, это не относится к d3, оно специфично для атрибутов svg. Вот действительно хороший учебник, объясняющий преимущества svg: g (группировка).
Это не то, что отличается от варианта использования "группировки" на графических рисунках, таких как как вы делали бы в презентации PowerPoint.
http://tutorials.jenkov.com/svg/g-element.html
Как указано в ссылке выше: для перевода вам нужно использовать translate (x, y):
Элемент не имеет атрибутов x и y. Чтобы переместить содержимое из -element вы можете сделать это только с помощью атрибута transform, используя функцию "translate", например: transform = "translate (x, y)".
Элемент используется для группировки форм SVG. После сгруппировки вы можете преобразовать всю группу фигур, как если бы это была одна форма. Возможность преобразования всех фигур в пределах -элемента является преимуществом по сравнению с группировкой фигур внутри вложенного элемента. -элементы не могут быть преобразованы сами по себе. Вам нужно будет вложить -element в -element, чтобы преобразовать свои вложенные фигуры.