Skip to content Skip to sidebar Skip to footer

Programmatically Trigger Click Event In Svg Rect Element

How to programmatically trigger click event in svg rectangle element element? like :$('#targetElm').triger('click'); ));

Here's a working example...

document.getElementById("targetElm").dispatchEvent(newEvent('click'));
<svgversion="1.1"class="highcharts-root"style="font-family:MontserratRegular;font-size:12px;"xmlns="http://www.w3.org/2000/svg"width="441"height="319.5"viewBox="0 0 441 319.5"><rectid="targetElm"onclick="alert('hi')"/></svg>

i.e. create a click event and dispatch it to the element. Although you don't seem to have any handler for the click event in your question.

Solution 2:

You can use Highcharts' internal function called firePointEvent for this:

var chart = Highcharts.chart('container', {

  series: [{
    type: 'column',
    data: [1],
    point: {
        events: {
        click: function() {
            console.log('Click event fired');
        }
      }
    }
  }]
});

chart.series[0].points[0].firePointEvent('click');

Live demo:http://jsfiddle.net/BlackLabel/xbkwqzc5/

Post a Comment for "Programmatically Trigger Click Event In Svg Rect Element"