score:0

Accepted answer

You can pass the event and context this into the label click function handler.

        label: {
                onclick: function (event) {
                func(event,this);
                this.renderer.label(
                    'You just clicked a custom menu item',
                    100,
                    100
                )

            },
            text: 'Show label'
        }


function func(event,context){
   console.log("chart id => ",context.renderTo.getAttribute('id'));
}

Updated Code

Highcharts.chart('container', {

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

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

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

    plotOptions: {
        series: {
            label: {
                connectorAllowed: false
            },
            pointStart: 2010
        }
    },
exporting: {
        menuItemDefinitions: {
            // Custom definition
            label: {
                onclick: function (event) {
                func(event,this);

                    this.renderer.label(
                        'You just clicked a custom menu item',
                        100,
                        100
                    )

                },
                text: 'Show label'
            }
        },
        buttons: {
            contextButton: {
                menuItems: ['downloadPNG', 'downloadSVG', 'separator', 'label']
            }
        }
    },
    series: [{
        name: 'Other',
        data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111]
    }],

    responsive: {
        rules: [{
            condition: {
                maxWidth: 500
            },
            chartOptions: {
                legend: {
                    layout: 'horizontal',
                    align: 'center',
                    verticalAlign: 'bottom'
                }
            }
        }]
    }

});
function func(event,context){
  console.log("chart id => ",context.renderTo.getAttribute('id'));
}

Working jsFiddle demo - https://jsfiddle.net/sc0Lg4uh/1/

Check console.log for id of the container.

score:1

You can access the id of the rendered HTML element using the renderTo method provided by Highchart. Your exporting section should be:

exporting: {
    menuItemDefinitions: {
        // Custom definition
        label: {
            onclick: function () {
                chartId = this.renderTo.id
                alert(chartId)
                this.renderer.label(
                    'You just clicked a custom menu item',
                    100,
                    100
                )

            },
            text: 'Show label'
        }
    },
    buttons: {
        contextButton: {
            menuItems: ['downloadPNG', 'downloadSVG', 'separator', 'label']
        }
    }
}

Documentation

https://api.highcharts.com/highcharts/chart.renderTo


Related Query

More Query from same tag