I want to implement a speedometer with an inner and outer(additional indicator in a triangle shape) dial using Highcharts gauge in Angular14. Is there any way, to show an additional indicator using the Highcharts gauge in Angular14? My expectation is shown in the figure. enter image description here
First, you need a custom plugin, which creates a triangle dial when series.isTrianglePoint
is set to true
. Plugin is inside a customPlugin.ts
file and is imported inside app component. Then, you can use two series with two separate dials, one with isTrianglePoint: true
.
Live demo: https://stackblitz.com/edit/highcharts-angular-line-jdhsit
API Reference: https://www.highcharts.com/docs/extending-highcharts/extending-highcharts https://github.com/highcharts/highcharts-angular#to-load-a-wrapper https://api.highcharts.com/highcharts/series.gauge.dial