如何通过单击数据中气泡图上的数据点来获取其他信息

时间:2018-11-28 21:13:24

标签: highcharts

我正在使用此https://www.highcharts.com/demo/bubble-3d。我想要的是我可以从数据中获取有关每个数据点的其他信息。我不想向数据点添加警报。如我所见,这里的大多数示例都将设置警报并获取有关各个点的信息。提前非常感谢您。

1 个答案:

答案 0 :(得分:0)

点击某个点时,可以使用Highcharts annotations显示其他信息。

代码:

  series: [{
    data: [{
      x: 1,
      y: 93,
      z: 55,
      yourProperty: 'Special bubble!'
    }]
  }],
  plotOptions: {
    bubble: {
      point: {
        events: {
          click: function() {
            var point = this,
              series = point.series,
              chart = series.chart,
              annotation;

            if (point.yourProperty) {
              annotation = chart.addAnnotation({
                labels: [{
                  point: point.id,
                  text: point.yourProperty
                }],
                labelOptions: {
                  align: 'right',
                  allowOverlap: true
                }
              });

              setTimeout(function() {
                chart.removeAnnotation(annotation.id);
              }, 2000);
            }
          }
        }
      }
    }
  }

演示:https://jsfiddle.net/BlackLabel/z7jvben9/1/