跪求 js 解决 JSON 子节点转根节点,本人使用深度优先遍历算法未实现(d3.js 树状关系网络),求一段优雅的 js

2016-06-02 23:31:42 +08:00
 zxc337

有如下一段 json 数据

{
    "name": "18912386146", 
    "size": 45, 
    "children": [
        {
            "name": "13811179796", 
            "size": 10
        }, 
        {
            "name": "18511331067", 
            "size": 10
        }, 
        {
            "name": "18631867507", 
            "size": 10
        }, 
        {
            "name": "18616261983", 
            "size": 45, 
            "children": [
                {
                    "name": "13811179796", 
                    "size": 10
                }, 
                {
                    "name": "18995390312", 
                    "size": 10
                }
            ]
        }, 
        {
            "name": "13466692515", 
            "size": 10
        }, 
        {
            "name": "13650731515", 
            "size": 45, 
            "children": [
                {
                    "name": "13811179796", 
                    "size": 10
                }, 
                {
                    "name": "13037986580", 
                    "size": 10
                }, 
                {
                    "name": "18995390312", 
                    "size": 10
                }
            ]
        }, 
        {
            "name": "15809619551", 
            "size": 10
        }, 
        {
            "name": "18601191669", 
            "size": 10
        }, 
        {
            "name": "15909638715", 
            "size": 10
        }, 
        {
            "name": "15909619055", 
            "size": 10
        }, 
        {
            "name": "18902266418", 
            "size": 63, 
            "children": [
                {
                    "name": "13560047280", 
                    "size": 63
                },
                {
                    "name": "13632270695", 
                    "size": 10
                }, 
                {
                    "name": "13650731515", 
                    "size": 45
                }, 
                {
                    "name": "13268069280", 
                    "size": 167
                }
            ]
        }, 
        {
            "name": "13037986580", 
            "size": 10
        }, 
        {
            "name": "18995390312", 
            "size": 10
        }
    ]
}

上面这段 json 数据对应成图, 现在点击紫色的大圆点,即其中一个叶子节点,会反转成根节点,重新生成图形,这样一个效果; 只需要对 json 数据进行反转即可; 需要通过遍历算法转成下面这样

{
    "name": "13268069280", 
    "size": 167, 
    "children": [
        {
            "name": "18902266418", 
            "size": 63,
            "children": [
		        {
                    "name": "13560047280", 
                    "size": 63
                },
                {
                    "name": "13632270695", 
                    "size": 10
                }, 
                {
                    "name": "13650731515", 
                    "size": 45
                }, 
                {
                    "name": "18912386146", 
                    "size": 45,
                    "children": [
				        {
				            "name": "13811179796", 
				            "size": 10
				        }, 
				        {
				            "name": "18511331067", 
				            "size": 10
				        }, 
				        {
				            "name": "18631867507", 
				            "size": 10
				        }, 
				        {
				            "name": "18616261983", 
				            "size": 45, 
				            "children": [
				                {
				                    "name": "13811179796", 
				                    "size": 10
				                }, 
				                {
				                    "name": "18995390312", 
				                    "size": 10
				                }
				            ]
				        }, 
				        {
				            "name": "13466692515", 
				            "size": 10
				        }, 
				        {
				            "name": "13650731515", 
				            "size": 45, 
				            "children": [
				                {
				                    "name": "13811179796", 
				                    "size": 10
				                }, 
				                {
				                    "name": "13037986580", 
				                    "size": 10
				                }, 
				                {
				                    "name": "18995390312", 
				                    "size": 10
				                }
				            ]
				        }, 
				        {
				            "name": "15809619551", 
				            "size": 10
				        }, 
				        {
				            "name": "18601191669", 
				            "size": 10
				        }, 
				        {
				            "name": "15909638715", 
				            "size": 10
				        }, 
				        {
				            "name": "15909619055", 
				            "size": 10
				        }, 
				        {
				            "name": "13037986580", 
				            "size": 10
				        }, 
				        {
				            "name": "18995390312", 
				            "size": 10
				        }
				    ]
                }
		    ]
        }
    ]
}

不知道各位有没有比较好的算法实现?

6277 次点击
所在节点    JavaScript
23 条回复
rekulas
2016-06-03 16:24:57 +08:00
@xuzicn 确实,太恶劣了,好歹把方法名改一下,位置换一下啊
rekulas
2016-06-03 16:36:14 +08:00
如果翻转操作很频繁,用一个标识标记顶级点是哪一个就行了,有点是翻转不消耗什么资源,缺点是最后需要输出一次 tree 结构
xieranmaya
2016-06-03 16:50:03 +08:00
@xuzicn 正解

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/283114

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX