Использование D3 Масштабируемых дерева Карты код в качестве шаблона

Question

Somewhat related stack overflow question about loading json without http request in D3

Я только начинаю изучать Javascript, но я, возможно, масштабно думал, что я мог бы взять код из этого very cool zoomable treemap by Mike Bostock, жесткого кода моего собственного JSON в файл вместо того, чтобы использовать d3.json, и легко иметь карту деревьев, отражающую мои новые данные. Как практика, я вставил пробный json, который, как я знаю, должен быть отформатирован правильно, используя метод, рекомендованный вышеуказанным вопросом переполнения стека. Заменить часть кода выглядит следующим образом:

var root = {"name": "flare","children": [{"name": "analytics","children": [{"name": "cluster","children": [{"name": "MergeEdge", "size": 10 }]}]}]}; 

function(root) { 

initialize(root); 
accumulate(root); 
layout(root); 
display(root); 

Первоначально выглядел так, с закрывающей скобкой в ​​самом конце сценария, который я снял:

d3.json("flare.json", function(root) { 

    initialize(root); 
    accumulate(root); 
    layout(root); 
    display(root); 

Но когда я открываю html-файл в моем браузере, я просто получаю пустой серый квадрат вместо treemap. Я понимаю, что делаю какую-то очень основную ошибку, я просто не могу даже понять, что это такое. Мой подход «шаблона» обречен до тех пор, пока я не узнаю больше о d3/javascript, или это простое решение для этого?

Answer 1

Возможно, это не полное решение вашей проблемы, но по крайней мере вам нужно будет работать с JSON.parse (JSON_STRING_HERE), а не напрямую.