javascript - Hierarchical Edge Bundling json数据集构建理解

标签 javascript json d3.js bundle-layout

我想了解如何构建数据集以通过分层边缘捆绑进行可视化。

这是我的测试数据集

  [
        {"name":"Flare.Expertise.Informatics","imports":["Flare.Expertise.Informatics.Programming","Flare.Expertise.Informatics.Networking","Flare.Expertise.Informatics.Security","Flare.Expertise.Informatics.BioInformatics","Flare.Expertise.LifeScience.Zoology","Flare.People.APerson","Flare.People.BPerson","Flare.People.CPerson","Flare.People.DPerson"]},
        {"name":"Flare.People","imports":["Flare.People.APerson","Flare.People.BPerson","Flare.People.DPerson"]},
        {"name":"Flare.Expertise.LifeScience","imports":["Flare.Expertise.LifeScience.Biology","Flare.Expertise.LifeScience.Zoology","Flare.People.APerson","Flare.People.CPerson"]},
        {"name":"Flare.Expertise.Informatics.Programming","imports":["Flare.People.APerson","Flare.People.BPerson"]},
        {"name":"Flare.Expertise.Informatics.Networking","imports":["Flare.People.APerson","Flare.People.DPerson"]},
        {"name":"Flare.Expertise.Informatics.Security","imports":["Flare.People.BPerson","Flare.People.DPerson"]},
        {"name":"Flare.People.BPerson","imports":["Flare.Expertise.Informatics.Security","Flare.Expertise.Informatics.Programming"]},
        {"name":"Flare.People.APerson","imports":["Flare.LifeScience.Zoology","Flare.Expertise.Informatics.Networking","Flare.Expertise.Informatics.Programming"]},
        {"name":"Flare.People.DPerson","imports":["Flare.Expertise.Informatics.Networking","Flare.Expertise.Informatics.Security","Flare.Expertise.Business.Commerce"]},
        {"name":"Flare.People.CPerson","imports":["Flare.Informatics.BioInformatics","Flare.LifeScience.Biology","Flare.Expertise.Business.Marketing"]},
        {"name":"Flare.Informatics.BioInformatics","imports":["Flare.People.CPerson"]},
        {"name":"Flare.LifeScience.Zoology","imports":["Flare.People.APerson"]},
        {"name":"Flare.Expertise.Business","imports":["Flare.Expertise.Business.Marketing","Flare.Expertise.Business.Commerce","Flare.People.CPerson","Flare.People.DPerson"]},
        {"name":"Flare.Expertise.Business.Commerce","imports":["Flare.People.DPerson"]},
        {"name":"Flare.LifeScience.Biology","imports":["Flare.People.CPerson"]}
        ]   

所以主要有2类

  1. 耀斑.专长

  2. Flare.People

    Flare.Expertise 有 3 个主要类别:信息学、生命科学、商业。每个子类别都有进一步的类别,例如生命科学:动物学和生物学

Flare.People 有 4 个人:APerson、BPerson、CPerson 和 DPerson

我需要展示所有人都有不同的专长。例如 CPerson 有关于生物信息学和生物学的信息。因此,一个人可以在多个主要类别和各个子类别中拥有专业知识

我正在尝试在 D3 Hierarchical bundling example 上实现算法.我收到一个错误 未捕获的类型错误:无法读取未定义的属性“push”

我无法修复这个错误。如果我更改推送运算符,我会得到空白页。对我来说,问题似乎与数据集有关。我不明白数据集中的错误在哪里。所以,请帮我解决这个错误。否则,请告诉我如何在我的数据中可视化上述关系

最佳答案

我从这个博客中找到了解决方案

http://ianh.co/modeling-data-with-the-d3-js-bundle-layout/

据此,“imports”中的所有类别都必须出现在“name”中。

通过它,我能够更正我的数据集并能够使用它。

关于javascript - Hierarchical Edge Bundling json数据集构建理解,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30545247/

相关文章:

javascript - 无法渲染 React 组件,我的理解或代码中有错误?

javascript - $.ajax() 中的 this 关键字调用其他函数来设置 url

javascript - 有没有办法在 Node 或客户端javascript中将json数据导出到docx、pdf和excel?

javascript 获取日期时间输入并根据输入过滤列表

javascript - c3js条形图onclick事件被触发两次

javascript - 在 JavaScript 上验证 GitHub API

javascript - 如何在重定向之前保持请求完成

c# - 在 javascript 中读取 JavaScriptSerializer c#

php - 来自 php MySQL 查询的 JSON 显示不存在的列

javascript - 如何使用最新的d3加载json文件?