可点击的列以重定向到另一页 amcharts 堆叠柱状图

huangapple go评论65阅读模式
英文:

Clickable columns to redirect to another page amcharts stacked bar chart

问题

I am using stacked bar chart in amcharts am5.
想要为每个列条添加网址,并在有人点击列条时重定向到一个网址。
关于如何在列条上添加链接,stackoverflow上有一些帖子,但它们是针对Amcharts4的,不适用于Amcharts5。

Codepen demo from the site

我会感激任何建议。

英文:

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

答案1

得分: 0

/* 鼠标指针在列上的更改 /
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";
});
/
单击列跳转到URL */
series.columns.template.events.on("click", function(ev) {
console.log(ev.target.dataItem.dataContext.url);
window.location.assign(ev.target.dataItem.dataContext.url);
}

英文:

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); }

huangapple
  • 本文由 发表于 2023年6月15日 18:52:53
  • 转载请务必保留本文链接:https://go.coder-hub.com/76481765.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定