Question

如何在甜甜圈Highchart中添加URL支持？我试过，但我在URL中得到了未定义的错误。非常感谢您的帮助。

这是我在系列中添加的内容

point: {
  events: {
    click: function(e) {
      location.href = e.point.url;
      e.preventDefault();
    }
  }
}

data = [{
      y: 55.11,
      color: colors[0],
      url: 'www.google.com', 
      drilldown: {
         name: 'MSIE versions',
         categories: ['MSIE 6.0', 'MSIE 7.0', 'MSIE 8.0', 'MSIE 9.0'],
         data: [10.85, 7.35, 33.06, 2.81],
         url: 'www.google.com',
         color: colors[0]
      }
}, { .......many more dataset ...

更新：

jsfiddle圆环图的例子

Answer 1

<强> check out this fiddle here

这是我用于highcharts实例的方法，其中添加了指向数据网址的链接。

在实例化新的高级图时，您需要将光标设置为指针（让用户知道他们可以点击的东西），并且您还想设置点击事件，如下所示：

   plotOptions: {
        series: {
            cursor: 'pointer',
            point: {
                events: {
                    click: function() {
                        location.href = this.options.url;
                    }
                }
            }
        }
    },

系列中的每个元素＆gt;数据现在还应包含“url”键值对，如下所示：

series: [{
    data: [{
        y: 29.9,
        url: 'http://bing.com/search?q=foo'
    }, { ... // more data sets

Answer 2

两件事：

1）在你的系列对象中，我没有看到任何选项url。

2）路径应为e.point.series.options.url;

工作代码：

        {
            name: 'Browsers',
            url: "http://www.google.com", // add url 1)
            data: browserData,
            size: '60%',
            point: {
                events: {
                    click: function(e) {
                        location.href = e.point.series.options.url; //proper path 2)
                        e.preventDefault();
                    }
                }
            },
            dataLabels: {
                formatter: function() {
                    return this.y > 5 ? this.point.name : null;
                },
                color: 'white',
                distance: -30
            }
        }

并且jsfiddle：http://jsfiddle.net/sxskW/6/（由于X-Frame-Options而没有重定向：SAMEORIGIN）。

将URL添加到Pie-Donut Highchart

2 个答案: