Question

我使用自定义方式在Highchart中显示工具提示，当我选择类型系列时，一切都运行良好：spline ..但是当我尝试对type: "error bar"系列执行相同操作时，很难选择这条线。有没有办法增加这类系列的选择范围？

这段代码表示代码如何显示工具提示。我想我应该添加一些代码来悬停事件？

events : {
    click : function(evt) {
        this.chart.myTooltip.refresh(evt.point, evt);
    },
    mouseOut : function() {
        this.chart.myTooltip.hide();
    }                       
}

完整代码

x = null;

$(function() {
  $('#container').highcharts({
    xAxis: {
      categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
        'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ]
    },
    tooltip: {
      valueSuffix: '°C',
      enabled: false
    },
    chart: {
      events: {
        load: function() {
          this.myTooltip = new Highcharts.Tooltip(this, this.options.tooltip);
        }
      }
    },
    plotOptions: {
      series: {
        stickyTracking: false,
        events: {
          click: function(evt) {
            this.chart.myTooltip.refresh(evt.point, evt);
          },
          mouseOut: function() {
            this.chart.myTooltip.hide();
          }
        }
      }
    },
    series: [{
      name: 'Tokyo',
      data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
    }, {
      name: 'Temperature error',
      type: 'errorbar',
      data: [
        [6, 8], [5.9, 7.6], [9.4, 10.4], [14.1, 15.9], [18.0, 20.1], [21.0, 24.0],
        [23.2, 25.3], [26.1, 27.8], [23.2, 23.9], [18.0, 21.1], [12.9, 14.0]
      ]
    }]
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.src.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

Answer 1

您可以对问题进行一些小的解决方法。您可以添加更大的lineWidth和透明颜色的新errorbar系列。

LocalTime

当您不直接点击错误栏时，它应该让您有机会显示错误栏的工具提示。

在这里，您可以找到一个示例：http://jsfiddle.net/4qLgu8so/1/

亲切的问候，

将选择范围扩大到误差棒系列

完整代码

1 个答案: