diff --git a/ember-highcharts/src/components/high-charts.ts b/ember-highcharts/src/components/high-charts.ts index 85897cf..5f16b13 100644 --- a/ember-highcharts/src/components/high-charts.ts +++ b/ember-highcharts/src/components/high-charts.ts @@ -243,6 +243,19 @@ export default class HighCharts extends Component { SolidGauge.default(Highcharts); } + if ( + this.args.chartOptions?.chart?.type === 'treegraph' || + this.args.chartOptions?.chart?.type === 'treemap' + ) { + const Treemap = await import('highcharts/modules/treemap'); + Treemap.default(Highcharts); + } + + if (this.args.chartOptions?.chart?.type === 'treegraph') { + const Treegraph = await import('highcharts/modules/treegraph'); + Treegraph.default(Highcharts); + } + if (this.args.chartOptions?.chart?.type === 'waterfall') { const More = await import('highcharts/highcharts-more'); More.default(Highcharts); diff --git a/test-app/app/components/chart-treegraph.hbs b/test-app/app/components/chart-treegraph.hbs new file mode 100644 index 0000000..0e6c14c --- /dev/null +++ b/test-app/app/components/chart-treegraph.hbs @@ -0,0 +1,4 @@ + diff --git a/test-app/app/components/chart-treegraph.js b/test-app/app/components/chart-treegraph.js new file mode 100644 index 0000000..6f33945 --- /dev/null +++ b/test-app/app/components/chart-treegraph.js @@ -0,0 +1,28 @@ +import Component from '@glimmer/component'; + +export default class Treegraph extends Component { + chartOptions = { + chart: { + type: 'treegraph', + }, + title: { + text: 'Organizational Structure', + }, + }; + + chartData = [ + { + keys: ['id', 'parent'], + data: [ + ['Alice'], + ['Bill', 'Alice'], + ['Carson', 'Bill'], + ['Edward', 'Bill'], + ['Dwayne', 'Alice'], + ], + dataLabels: { + format: '{point.id}', + }, + }, + ]; +} diff --git a/test-app/app/templates/index.hbs b/test-app/app/templates/index.hbs index 6c49d36..9f3e1ac 100644 --- a/test-app/app/templates/index.hbs +++ b/test-app/app/templates/index.hbs @@ -54,3 +54,8 @@

Scatter chart

+ +
+

Treegraph chart

+ +