Highcharts 词云 - 对每个词做一个 link

Question

我引用了这个demo做了一个词云。 https://codesandbox.io/s/yz3t3

现在我的问题是如何为这个页面的highcharts词云制作的每个词制作一个link。 https://ftmscan.com/topstat#Token

当您在该网站上切换词云中的任何文本时，您将被重定向到另一个页面。如何为每个文本制作这样的 link - 这就是我要问的。

几天来我一直在努力做到这一点，但似乎没有任何答案。任何帮助将不胜感激，并提前致谢。

Answer 1

https://api.highcharts.com/highcharts/series.wordcloud.events.click

将系列设置为可点击，然后检查点击事件以了解具体点击内容的详细信息。

event.point 似乎掌握了最相关的信息。它有一个 ID、一个名称、一个类别等。您应该能够使用其中的一些信息来查找单击的是哪个词。

工作示例：

const options = {
  series: [
    {
      type: "wordcloud",
      data: data,
      events: {
        click: e => {
          alert(e.point.name);
          /* Do stuff here, based on e.point.name */
        }
      }
    }
  ]
};

Answer 2

您可以使用 series.point.events.click 作为包含逻辑的回调。这是您可以开始的基本代码：

  point: {
    events: {
      click() {
        const point = this;

        console.log(point);

        if (point.name === "Aenean") {
          window.open("https://www.highcharts.com/");
        }
        if (point.name === "Lorem") {
          window.open("https://www.highcharts.com/");
        }
      }
    }
  }

您可以根据需要轻松改进它 - 您可以在此回调中使用开关或编写一个函数来决定打开特定 link.

演示：https://codesandbox.io/s/highcharts-react-demo-forked-2idvg?file=/demo.jsx:1187-1564

Highcharts 词云 - 对每个词做一个 link

Highcharts word cloud - Make a link to each word

javascript

highcharts

reactjs