您应该更改组件,如下所示
导入Highcharts和漏斗
import * as Highcharts from 'highcharts';
require('highcharts/modules/funnel')(Highcharts);
宣布
var require: any;
chart: any;
在ngOnInit中添加此项
Highcharts.chart('jaibalaya', {
chart: {
type: 'pyramid'
},
title: {
text: '',
x: -50
},
plotOptions: {
series: {
dataLabels: {
enabled: true,
format: '<b>{point.name}</b> ({point.y:,.0f})',
color: 'black'
}
}
},
legend: {
enabled: true
},
credits: {
enabled: false
},
series: [{
data: [
['Inactive', 15],
['Small', 20],
['Medium', 25],
['Big', 20],
['Top', 10]
]
}]
});
HTML中的变化
<div id="jaibalaya" style="min-width: 410px; max-width: 600px; height: 400px; margin: 0 auto">
</div>
要更改pyramid
图表中的颜色,您可以使用colors
数组:
Highcharts.chart('jaibalaya', {
chart: {
type: 'pyramid'
},
colors: ['red', 'yellow', 'blue', 'green', 'orange'],
...
});