#javascript #json #d3.js
#javascript #json #d3.js
Вопрос:
итак, новичок в javascript, я ломал голову над тем, как загрузить исходный код JSON json в d3.js График радиальной дендрограммы. находится здесь: d3.js Пример графа радиальной дендрограммы
текущий план состоит в том, чтобы импортировать JSON в python или, возможно, преобразовать json в 2 столбца (идентификатор, значение) csv с использованием python.
но я хотел бы понять, как это можно сделать, поскольку я ломал голову над javascript и d3.js уже почти 2 дня.
По сути, я пытаюсь загрузить данные в d3.js чтобы обеспечить визуализацию следующего
с корневой системой
РЕДАКТИРОВАТЬ: чтобы показать обнадеживающий поток усиков
system --> model_type --> system_revision --> firmware_version --> firmware_build, system_name
чтобы следовать примеру csv, приведенному в ссылке выше.
id,value
systems,
systems_PowerEdge R720xd,
systems_PowerEdge R720xd_I,
systems_PowerEdge R720xd_I_1.50.50,
systems_PowerEdge R720xd_I_1.50.50_34,ldc0000
это тот результат, который я хотел бы получить.
Ответ №1:
Просто возвращаюсь к этому вопросу со вчерашнего дня. Как я уже говорил в своем комментарии, вам необходимо преобразовать вашу структуру JSON в иерархию родительских / дочерних элементов, требуемую d3.hierarchy. К сожалению, ваши исходные данные на самом деле не являются иерархическими, поэтому я вижу единственный способ сделать это очень вручную:
var root = {
id: "system",
children: []
};
data.systems.forEach(function(d,i){
var key = Object.keys(d)[0],
sysInfo = d[key].sysInfo;
root.children.push({
id: sysInfo.system_model,
children: [{
id: sysInfo.system_revision,
children: [{
id: sysInfo.firmware_version,
children: [{
id: sysInfo.firmware_build
}, {
id: key
}]
}]
}]
});
});
root = d3.hierarchy(root);
После этого код дендрограммы остается неизменным, за исключением исправления текстовых меток:
.text(function(d) { console.log(d); return d.data.id });
Полный рабочий код.