У меня есть данные в следующем формате, которые поступают как переменная.
var groupeddata =
[{ Title: "Dummy Data", ID: "46", RFU: 20291, Name: "Name1", barcolor: "#ff7f00"},
{Title: "Dummy Data", ID: "50", RFU: 15000, Name: "Name2", barcolor: "#ff7f00"},
{Title: "Dummy Data", ID: "40", RFU: 14000, Name: "Name3", barcolor: "#ff7f00"},
{Title: "Dummy Data2", ID: "46", RFU: 21000, Name: "Name1", barcolor: "#8B008B"},
{Title: "Dummy Data2", ID: "50", RFU: 18095, Name: "Name2", barcolor: "#8B008B"},
{Title: "Dummy Data2", ID: "56", RFU: 27278, Name: "Name3", barcolor: "#8B008B"}];
Мне удалось создать сгруппированную гистограмму, если данные сгруппированы по идентификатору с помощью функции d3.nest, как я обсуждал в предыдущей задаче: https://bl.ocks.org/Coola85/b05339b65a7f9b082ca210d307a3e469
Однако, если есть две полосы с одинаковыми значениями свойства «Имя» и разными идентификаторами, как в приведенном выше случае, они появляются далеко. Например, Name3 показывает полосу с идентификатором 40 (строка 3 данных) и идентификатором 56 (строка 6 данных) (https://bl.ocks.org/Coola85/86391f03bab40b16bdc24f1eedfba35f/). Кроме того, было бы хорошо, если бы метки деления оси X также были простыми числами 1, 2, 3 вместо номеров идентификаторов. Я не хочу, чтобы имена появлялись на метках галочки оси x, так как имена будут слишком длинными, чтобы поместиться в фактический набор данных.
Некоторое время я безуспешно пытался сделать это, и любая помощь приветствуется.
Обновление 1 Чтобы уточнить, вот изображение того, как я хочу, чтобы он выглядел: Идеальный выход. Обратите внимание: текст и пунктирные стрелки предназначены только для ссылка и нежелательна в конечном результате.
Приносим извинения за путаницу и благодарим Йена за ответ. Я обновил пост, добавив в него изображение, чтобы вы могли увидеть, что я хочу получить в результате. Также обратите внимание, что отметки по оси X - это только 1, 2 и 3, а не имена. Если я вкладываюсь по именам, а затем сортирую и представляю данные, имена появляются на метках по оси X, что нежелательно, поскольку имена в окончательных данных длинные.
Думаю, вы почти у цели - просто ваш d3.nest
некорректен. Ваша группировка на ID
на данный момент, но глядя на ожидаемый результат, который нигде не нужен.
Измените группировку, чтобы использовать Name
:
var databyID = d3.nest()
.key(function(d) { return d.Name; })
.entries(groupeddata);
Это произвело следующее, что, я думаю, именно то, что вы хотите
Спасибо, Ян. Да. Я дошел до этого, заменив d.ID на d.Name. Я могу производить то, что есть у вас. Однако я не хочу, чтобы метки ниже были Name1, Name2, Name3. Вместо этого я хочу, чтобы они были либо идентификаторами, либо просто общими 1, 2, 3.
Чтобы заменить их, вам понадобится какая-то форма поиска между '1' ==> 'Name1'
и т. д. Можете ли вы просто изменить форму данных с самого начала? Это будет самый простой способ
После сортировки данных я могу клонировать databyID, а затем заменить ключи, сохранив порядок? Затем отправьте новый массив с 1 2 3 в диаграмму d3js? Возможно ли это, или моя логика в чем-то ошибочна? Новичок в javascript не уверен, какую точную функцию мне нужно использовать для выборочной замены всех ключей. Примечание. В окончательном наборе данных не будет «Имя», в нем будет что-то совершенно случайное.
Не могли бы вы изобразить, как вы хотите, чтобы это выглядело? Я нахожу этот вопрос немного запутанным в данный момент ...