javascript - 如何更改 d3js 图表的布局？

Question

我最近开始使用 d3js，目前我正在尝试弄清楚如何使用转换。

我得到了 TreeMap example使用我自己的 json 文件。

我的问题是:如何通过从 treemap 到 tree 的转换来更改布局？

我的 json 数据如下所示:

{"name": "OS",
 "children": [
   {"name": "Linux x64",
    "children": [
      {"name": "Linux (amd64)", "size": 58154},
      {"name": "Linux (ia64)", "size": 3}
    ]
   },
   {"name": "Linux x86",
    "children": [
      {"name": "Linux (i386)", "size": 12269}
    ]
   },
   {"name": "Mac OS x64",
    "children": [
      {"name": "Mac OS X (x86_64)", "size": 53118}
    ]
   },
   {"name": "Mac OS x86",
    "children": [
      {"name": "Mac OS X (i386)", "size": 409}
    ]
   },
   {"name": "SunOS x64",
    "children": [
      {"name": "SunOS (amd64)", "size": 3}
    ]
   },
   {"name": "SunOS x86",
    "children": [
      {"name": "SunOS (x86)", "size": 8}
    ]
   },
   {"name": "Windows x64",
    "children": [
      {"name": "Windows 2003 (amd64)", "size": 32},
      {"name": "Windows 7 (amd64)", "size": 25492},
      {"name": "Windows 8 (amd64)", "size": 19},
      {"name": "Windows NT (unknown) (amd64)", "size": 76},
      {"name": "Windows Server 2008 (amd64)", "size": 349},
      {"name": "Windows Server 2008 R2 (amd64)", "size": 428},
      {"name": "Windows Vista (amd64)", "size": 1337},
      {"name": "Windows XP (amd64)", "size": 1284}
    ]
   },
   {"name": "Windows x86",
    "children": [
      {"name": "Windows 2000 (x86)", "size": 147},
      {"name": "Windows 2003 (x86)", "size": 390},
      {"name": "Windows 7 (x86)", "size": 17933},
      {"name": "Windows 8 (x86)", "size": 10},
      {"name": "Windows 95 (x86)", "size": 2},
      {"name": "Windows NT (unknown) (x86)", "size": 13},
      {"name": "Windows Server 2008 (x86)", "size": 19},
      {"name": "Windows Server 2008 R2 (x86)", "size": 43},
      {"name": "Windows Vista (x86)", "size": 4815},
      {"name": "Windows XP (x86)", "size": 34545}
    ]
   }
 ]
}

我并没有真正更改示例代码，但如果有帮助，我可以发布它。

Answer 1

您无法从 TreeMap 过渡到 Tree...过渡会更改样式或属性，但您无法从一种布局过渡到另一种布局。

对于傻瓜:转换就像将苹果的颜色从红色变为绿色或改变其大小，但您不能通过橙色来改变苹果。