Search code examples
javascriptamchartsamcharts5

Clickable columns to redirect to another page amcharts stacked bar chart

i am using stacked bar chart in amcharts am5 want to add url's for each column bar and redirecting on a url when someone clicks on a column bar There are some posts on the stackoverflow on how to add links to columns, but they are for Amcharts4 and don't work on Amcharts5. .

Codepen demo from the site

I will appreciate any suggestions

Solution

  • Found a way to do that by adding

    /*   Mouse pointer change for columns */
series.columns.template.events.on("pointerover", function (ev) {
        document.body.style.cursor = "pointer";
    });
    series.columns.template.events.on("pointerout", function (ev) {
        document.body.style.cursor = "default";
    });
    /*   column click to url */
series.columns.template.events.on("click", function(ev) {
  console.log(ev.target.dataItem.dataContext.url);
   window.location.assign(ev.target.dataItem.dataContext.url); }