在垂直条形图中的列右侧显示​​工具提示

Question

我有一个高图，希望工具提示悬停在列的右侧（垂直条形图），因为当前图表的顶部没有足够的空间，因此它显示在列的底部。

仅供参考-我遍历了多个站点，发现大部分示例都是针对可以左右移动的折线图给出的，而不是针对默认情况下光标位于顶部或向下的垂直条形图的

>

var tooltip = {
                'formatter': function() {
                    var name = this.series.name;
                    if (_.isObject(name)) { // jshint ignore:line
                        name = name.last + ', ' + name.first;
                    }
                    var key = this.key;
                    if (_.isArray(this.key)) { // jshint ignore:line
                        //Multi people search object
                        key = '';
                        for (var i = 0; i < this.key.length; i++) {
                            key += this.key[i].last + ', ' + this.key[i].first + '<br>';
                        }
                    } else if (_.isObject(this.key)) { // jshint ignore:line
                        key = key.last + ', ' + key.first;
                    }
                    var val = chartUtility.handleAddingThousandSeparator(sourcedata, chartUtility.handleRoundingSingleValue(sourcedata, this.point.y));
                    val = chartUtility.prefixSuffix(sourcedata, this.point, val);
                    return '<strong>' + key + '</strong><table>' + '<tr><td style="color: ' + this.series.color + '"> :' + name + ': </td>' + '<td style="text-align: right"><b>' + val + '</b></td></tr>';
                }
            };`

Answer 1

使用定位器选项，您可以这样做：

tooltip: {
positioner: function(labelWidth, labelHeight, point) {
  if (point.plotY < 55) { // for highest columns
    return {
      x: point.plotX + 100,
      y: point.plotY + 30
    };
  } else { // others columns
    return {
      x: point.plotX,
      y: point.plotY - 20
    };
  }
},
},

Fiddle