Вложенные выборки d3.js

I'm trying to create elements foreach datapoint I have and add in a couple different elements to each element based on the current datapoint. I've tried something like:

var g = vis.selectAll("g").data(dd,function(d){ return d.data.name+d.x+d.y+d.s; });

    var gs = g.enter().append("g");         
        g.exit().remove();

    var t = gs.selectAll("text").data(function(d) { console.log(d); return d; });
    t.enter().append("text").attr("x",function(d){ return d.x+d.s/2; })
        .attr("y",function(d){ return d.y+d.s/4; })
        .attr("font-family","Verdana")
        .attr("font-size","9")          
        .attr("text-anchor","middle")
        .text(function(d){ return d.data.name; });      

    t.attr("x",function(d){ return d.x+d.s/2; })
        .attr("y",function(d){ return d.y+d.s/4; })
        .attr("font-family","Verdana")
        .attr("font-size","9")          
        .attr("text-anchor","middle")
        .text(function(d){ return d.data.name; });      

    t.exit().remove();

But all I get are a set of empty elements. Am I doing something obviously wrong?

1
nl ja de

1 ответы

Вложенные выборки предполагают какие-то вложенные данные, например. матрица. Ваши отдельные элементы данных не являются массивами, поэтому второй вызов .data() ничего не делает. Более подробную информацию смотрите в учебнике по вложенным выборам .

Мне непонятно, почему вы хотите вложенные выборы в ваше дело. Вы добавляете элемент text , который отображает имя для точки данных, поэтому вам не нужен второй (вложенный) выбор. Самый простой способ исправить (хотя бы синтаксически), однако, должен состоять в том, чтобы изменить каждый элемент dd в одноэлементный массив.

5
добавлено
Это не похоже на то, что вложенный выбор был бы полезен - они определенно не помогут вам избежать переходов с синхронизацией. Вы можете попробовать настроить пользовательские параметры для своих переходов или даже написать настраиваемый переход в зависимости от того, что именно вы хотите сделать. См. документацию .
добавлено автор Lars Kotthoff, источник
Вы можете использовать «каждый» метод для элементов g, входящих в выбор, а затем в каждой функции использовать d3.select (this) .append (el1); d3.select (это) .append (EL2); для добавления нескольких элементов в каждый элемент g. См. Например: stackoverflow.com/a/13204545/760156
добавлено автор nautat, источник
Ну, я немного упростил свою проблему. Я хочу добавить кучу вещей в каждую группу (несколько текстовых элементов, прямоугольник и т. Д.). Я уже реализовал его, используя плоскую структуру, где я вручную помещаю каждый элемент, но это делает переходы не синхронизированными. Я думал, что вложенная структура имеет смысл, поскольку я по существу хотел, чтобы каждый datapoint представлялся группой элементов. Что бы вы предложили для этого типа проблем?
добавлено автор user1167650, источник
Отложив вложенные файлы, как я могу прикрепить несколько элементов к элементу , где элементы создаются с помощью какого-либо массива данных (например, элементы входят/выходят/обновляются, а также внутренние элементы в )
добавлено автор user1167650, источник
D3.js — русскоговорящее сообщество
D3.js — русскоговорящее сообщество
57 участник(ов)

Чат для вопросов по d3.js