highcharts - 如何使用数据库数据集构建 HighCharts 组织结构图

Question

我正在尝试从我的数据库中创建一个组织结构图。这些是数据集中返回的字段：

Product_ID Parent_Product_ID Product_Name Product_Description Manager_Name Parent_Name Level

当我查看 HighChart 组织图表示例时，我看到以下属性：

keys: ['from', 'to'],
            data: [
             ['Shareholders', 'Board'],
                ['Board', 'CEO'],
                ['CEO', 'CTO'],
            ['CEO', 'CPO'],
            ['CEO', 'CSO'],
                ['CEO', 'HR'],
                ['CTO', 'Product'],
                ['CTO', 'Web'],
                ['CSO', 'Sales'],
                ['HR', 'Market'],
                ['CSO', 'Market'],
                ['HR', 'Market'],
                ['CTO', 'Market']
        ],
         nodes: [{
            id: 'Shareholders'
        }, {
            id: 'Board'
        }, {
            id: 'CEO',
            title: 'CEO',
            name: 'Grethe Hjetland',
            image: 'https://wp-assets.highcharts.com/www-highcharts-com/blog/wp-content/uploads/2020/03/17131126/Highsoft_03862_.jpg'
        }, {
            id: 'HR',
            title: 'HR/CFO',
            name: 'Anne Jorunn Fjærestad',
            color: '#007ad0',
            image: 'https://wp-assets.highcharts.com/www-highcharts-com/blog/wp-content/uploads/2020/03/17131210/Highsoft_04045_.jpg'
        }, {
            id: 'CTO',
            title: 'CTO',
            name: 'Christer Vasseng',
            image: 'https://wp-assets.highcharts.com/www-highcharts-com/blog/wp-content/uploads/2020/03/17131120/Highsoft_04074_.jpg'
        }, {
            id: 'CPO',
            title: 'CPO',
            name: 'Torstein Hønsi',
            image: 'https://wp-assets.highcharts.com/www-highcharts-com/blog/wp-content/uploads/2020/03/17131213/Highsoft_03998_.jpg'
        }, {
            id: 'CSO',
            title: 'CSO',
            name: 'Anita Nesse',
            image: 'https://wp-assets.highcharts.com/www-highcharts-com/blog/wp-content/uploads/2020/03/17131156/Highsoft_03834_.jpg'
        }, {
            id: 'Product',
            name: 'Product developers'
        }, {
            id: 'Web',
            name: 'Web devs, sys admin'
        }, {
            id: 'Sales',
            name: 'Sales team'
        }, {
            id: 'Market',
            name: 'Marketing team',
            column: 5
        }],

变量“this.data”包含数据库查询结果。
Product_ID 和 Parent_Product_ID 是将行联系在一起的键。
数据似乎是唯一的 Product_ID 和 Parent_Product_ID 值。
节点是其余的数据。

如何转换我的数据集以填充这 3 个属性？

标签： highcharts