littlerave
Posts: 37
Joined: Sun May 16, 2021 4:17 pm

Drilldown on double click in angular

Hello,

I'm trying to get drilldown to work with a double click in angular. I've followed this question on stackoverflow https://stackoverflow.com/questions/545 ... highcharts and installed the necessary package, imported it to my component but I still get complaints that dblclick is not assignable to type 'PointEventsOptionsObject'.

Code: Select all

import CustomEvents from 'highcharts-custom-events';
CustomEvents(Highcharts);

export class MapComponent {
  public chartOptions!: Highcharts.Options;

  constructor() {
    this.chartOptions = {
      plotOptions: {
        series: {
          point: {
            events: {
              dblclick: () => this.isDoubleClick = true
            }
          }
        }
      }
    }
  }
}
So how do I get the double click event into the chart options?
magdalena
Posts: 517
Joined: Tue Aug 24, 2021 1:32 pm

Re: Drilldown on double click in angular

Hello,

Thanks for contacting us with your question!

The solution is to extend PointEventsOptionsObject, as in the following example:

Demo:
https://stackblitz.com/edit/highcharts- ... mponent.ts

API Reference:
https://www.highcharts.com/docs/advance ... clarations

Feel free to ask any further questions!
Regards!
Magdalena Gut
Developer and Highcharts Support Engineer
littlerave
Posts: 37
Joined: Sun May 16, 2021 4:17 pm

Re: Drilldown on double click in angular

Thank you for the response. I was able to integrate the double click event into my component. However, it only fires if I click anywhere that does not trigger a drilldown event. If I double click on a country with a drilldown, it unfortunately does not trigger. I would basically require to fire the double click event to set a variable, then the drilldown event, in which I check whether the click was a double click. Is that possible or do I have to abandon the drilldown event entirely and instead call the respective event handler in my double click method?
magdalena
Posts: 517
Joined: Tue Aug 24, 2021 1:32 pm

Re: Drilldown on double click in angular

Hi,

this option is not available from the API, so It could be not best supported with events.
Could you reproduce the issue in an online editor that I could work on? It could be much easier to find the solution.

Regards!
Magdalena Gut
Developer and Highcharts Support Engineer
littlerave
Posts: 37
Joined: Sun May 16, 2021 4:17 pm

Re: Drilldown on double click in angular

Thank you for your reply. I ended up removing the drilldown attributes from the map data, so the double click event always fired and then manually called the drilldown event handler. Since my drilldown attributes are the same as the the data's ids, this was a simple fix.
magdalena
Posts: 517
Joined: Tue Aug 24, 2021 1:32 pm

Re: Drilldown on double click in angular

Congratulations on finding the solution and thanks for sharing it with us! :)

In case of any further questions, feel free to contact us again,
Regards!
Magdalena Gut
Developer and Highcharts Support Engineer

Return to “Highcharts Maps”