HighCharts Series.update()如何处理新的工具提示定位器?

时间:2016-03-15 19:49:27

标签: javascript highcharts

我想更新工具提示为系列定位的方式。我有一个update(),如下面的代码所示。正在为pointFormatter执行console.log()语句,但不在定位器中执行。好像定位器被完全忽略了。这是为什么?是否无法更新工具提示定位器?可能还有其他方式吗?

for (var j = 0; j < series.length; j++) {
        bubbleChart.addSeries({data: series[j].data, marker:lineWidth: 0}});
            bubbleChart.series[j].update({
                tooltip: {
                    useHTML: true,
                    borderWidth: 0,
                    backgroundColor: "rgba(37,37,37,0.95)",
                    style: {
                        padding: 10
                    },
                    headerFormat: "",
                    pointFormatter: function () {
                        console.log("RARAR");
                        bubbleRadius = this.shapeArgs.r;
                        return self.getToolTip(parseInt(this.hrr_num));
                    },
                    positioner: function (boxWidth, boxHeight, point) {
                        console.log(boxWidth);
                        console.log(boxHeight);
                        console.log(point);
                        return {x: point.plotX + bubbleRadius + 45, y: point.plotY + bubbleRadius + 20};
                    },
                    followPointer: false,
                    shadow: false,
                    shape: "square",
                    hideDelay: 0
                }
            });
    }

2 个答案:

答案 0 :(得分:0)

请参阅此jsfiddle,我已实施两种更新tooltip positioner的方法。

第一个就像您使用HighCharts.Series.update()所做的那样,并且我的console.log('1a');中预期jsFiddle未被调用。

因此,我添加了另一段代码来通过调用tooltip.options来更新chart.tooltip.options.positioner并且它有效。

我注意到您正在访问bubbleRadius函数中的positioner变量,因此您可能需要稍微更改一下代码才能实现我的第二个建议解决方案。

答案 1 :(得分:0)

series下没有选项positioner - 因此更新它不会改变任何内容。还没有tooltip.update()方法,因此通常无法在运行时更新工具提示。

然而,对于回调(如格式化程序,定位器或tickPositioner),有一个简单的技巧可以使它工作,请检查:http://jsfiddle.net/dbqktrhk/2/简而言之:

  1. 获取默认positioner

    var myPositioner = Highcharts.Tooltip.prototype.getPosition;
    
  2. 使用您的变量使用默认positioner

    tooltip: {
      xDateFormat: '%Y-%m-%d',
      shared: true,
      positioner: function (labelWidth, labelHeight, point) {
        return myPositioner.call(this, labelWidth, labelHeight, point);
      }
    },
    
  3. 随时更新您的变量:

    myPositioner = function(labelWidth, labelHeight, point) {
      console.log('1a');
      return {
        x: 80,
        y: 50
      };
    };