如何反转(转置)从 Angular 12 中的高脚椅动态生成的 HTML table 的行和列?

How to invert (transpose) the rows and columns of an HTML table which is generated dynamically from highchair in Angular 12?

https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/export-data/showtable/

在上面的示例中,我使用以下代码创建了高位图 table。

Highcharts.chart('container', {

title: {
    text: 'Solar Employment Growth by Sector, 2010-2016'
},

subtitle: {
    text: 'A demo of displaying a data table in Highcharts'
},

credits: {
    text: 'Source: thesolarfoundation.com'
},

chart: {
    borderWidth: 1,
    borderColor: '#ccc',
    spacingBottom: 30
},

yAxis: {
    title: {
        text: 'Number of Employees'
    }
},
legend: {
    layout: 'vertical',
    align: 'right',
    verticalAlign: 'middle'
},

plotOptions: {
    series: {
        pointStart: 2010
    }
},

series: [{
    name: 'Installation',
    data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
}, {
    name: 'Manufacturing',
    data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434]
}, {
    name: 'Sales & Distribution',
    data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387]
}, {
    name: 'Project Development',
    data: [null, null, 7988, 12169, 15112, 22452, 34400, 34227]
}, {
    name: 'Other',
    data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111]
}],

exporting: {
    showTable: true
}

});

以上部分,

 exporting: {
        showTable: true
    }

这部分负责生成highchart数据table。我得到的 table 应该还原,即行到列和列到行。

我尝试使用 javascript dom 操作来转换它,但我只需要针对高图的一些特定方法。

API里面没有切换行列的功能,只是为了导出table。模块数据 data.switchRowsAndColumns 中的所有数据都可以更改,但我认为这不是你的情况。

你可以尝试改变核心并使用扩展方法how to extending Highcharts

https://code.highcharts.com/modules/export-data.src.js

中找到这个 Chart.prototype.getTableAST

旧版本示例显示如何包装核心并更改在导出时创建 table 的方式:https://jsfiddle.net/BlackLabel/npwjxkuL/