Question

我在同步图表上遇到了不正确点的工具提示的问题。在同步图表上显示十字准线，并使用ordinal:false绘制等距刻度。

当十字光标随鼠标移动并在工具提示上显示最近点的数据时，就会发生此问题。

预期的行为是：没有数据时，应显示十字准线，而不显示工具提示。

这是我发现的https://jsfiddle.net/jknipp/g3vr5v44/13/

Answer 1

要获得所需的效果，只需返回false（如果window.isOutOfSync，而不是此处的No data字符串即可。

formatter: function(tooltip) {
          var header,
            s = [];

          console.log(window.isOutOfSync);
          if (window.isOutOfSync) {
            console.log("don't show tooltip");
            //return false;
            console.log(this)
            return false;
          }

          $.each(this.points, function(i, point) {

            // check to see if the point is in the overall graph
            //var overallChart = $("#total_success_rates").highcharts();
            //console.log(overallChart);

            var isSuccessRate = (point.series.name == 'Success');

            if (header == null) {
              var config = point.point.getLabelConfig();
              header = tooltip.tooltipFooterHeaderFormatter(config);
            }
            s.push(formatSuccessRateToolTip(point.y, isSuccessRate));
            // $("#" + point.series.name.toLowerCase() + "-rate").html(point.y + "%");
          });

          return header + s.reverse().join('<br>');
        }

[编辑]

此外，请在两个图表的reflow()函数内调用chart.events.load，如下所示：

  chart: {
    renderTo: container,
    type: 'areaspline',
    events: {
        load() {
        this.reflow()
      }
    },
    height: '220',
    spacingBottom: 20,
    spacingTop: 20,
    spacingLeft: 20,
    spacingRight: 20
  },

实时示例： https://jsfiddle.net/27veyw1d/

高图：图表上最接近的点将突出显示并显示工具提示，而不是鼠标指向的点

1 个答案: