相关疑难解决方法(0)

从一串JSON而不是JSON文件渲染D3图

我试图从我的Rails应用程序渲染以下树形图:http: //bl.ocks.org/mbostock/4063570

我有一个具有许多属性的模型,但我想手动嵌套这些属性,只需使用字符串插值来构建我自己的JSON字符串,然后直接将其传递给d3.

这是我的代码:

    <%= javascript_tag do %>
        var width = 960,
        height = 2200;

        var cluster = d3.layout.cluster()
        .size([height, width - 160]);

        var diagonal = d3.svg.diagonal()
        .projection(function(d) { return [d.y, d.x]; });

        var svg = d3.select("body").append("svg")
        .attr("width", width)
        .attr("height", height)
        .append("g")
        .attr("transform", "translate(40,0)");

        **d3.json("/assets/flare.json", function(root) {**
        var nodes = cluster.nodes(root),
        links = cluster.links(nodes);

        var link = svg.selectAll(".link")
        .data(links)
        .enter().append("path")
        .attr("class", "link")
        .attr("d", diagonal);

        var node = svg.selectAll(".node")
        .data(nodes)
        .enter().append("g")
        .attr("class", "node")
        .attr("transform", function(d) { return "translate(" + …
Run Code Online (Sandbox Code Playgroud)

json d3.js

14
推荐指数
1
解决办法
2万
查看次数

如何从内部JSON数组而不是外部资源/文件加载d3.js中可折叠树的数据?

我希望从文件中加载JSON数据数组,以根据此处Mike Bostock示例生成可折叠树形图.该示例使用格式正确的外部JSON文件,并使用d3.json函数加载它.

我希望能够从文件中加载一个json数组,这是从flay数组生成多级数组的结果(根据这里示例问题).

一个我已经站了起来bl.ocks.org样本文件/ GitHub上显示的是什么,我想实现,而不采取多层次的JSON数据,并将其加入到可折叠的树形图中的重要组成部分两个部分

简而言之.我在文件中声明了以下数据;

var data = [
     { "name" : "ABC", "parent":"DEF", "relation": "ghi", "depth": 1 },
     { "name" : "DEF", "parent":"null", "relation": "null", "depth": 0 },
     { "name" : "new_name", "parent":"ABC", "relation": "rel", "depth": 2 },
     { "name" : "new_name2", "parent":"ABC", "relation": "foo", "depth": 2 },
     { "name" : "Foo", "parent":"DEF", "relation": "rel", "depth": 2 }
    ];
Run Code Online (Sandbox Code Playgroud)

然后通过这部分代码运行...

var dataMap = data.reduce(function(map, node) {
    map[node.name] = …
Run Code Online (Sandbox Code Playgroud)

d3.js

9
推荐指数
1
解决办法
9669
查看次数

标签 统计

d3.js ×2

json ×1