Highcharts: сделать стрелку подсказки (якорь) всегда видимой

Question

Я пытаюсь построить столбчатую диаграмму с пользовательской позицией всплывающей подсказки, используя Highcharts.Я хочу, чтобы стрелка всплывающей подсказки всегда была видна внизу подсказки.Пока это видно только когда я удаляю пользовательскую функцию позиционера всплывающей подсказки.Я попытался переопределить метод move класса Tooltip и установить skipAnchor на false.Однако, это не сработало.

Пожалуйста, посмотрите пример: https://jsfiddle.net/jezusro6/

Answer 1

Вы должны перезаписать символьный метод callout:

H.SVGRenderer.prototype.symbols.callout = function(x, y, w, h, options) {
    var arrowLength = 6,
        halfDistance = 6,
        r = Math.min((options && options.r) || 0, w, h),
        safeDistance = r + halfDistance,
        anchorX = options && options.anchorX,
        anchorY = options && options.anchorY,
        path;

    path = [
        'M', x + r, y,
        'L', x + w - r, y, // top side
        'C', x + w, y, x + w, y, x + w, y + r, // top-right corner
        'L', x + w, y + h - r, // right side
        'C', x + w, y + h, x + w, y + h, x + w - r, y + h, // bottom-rgt
        'L', x + r, y + h, // bottom side
        'C', x, y + h, x, y + h, x, y + h - r, // bottom-left corner
        'L', x, y + r, // left side
        'C', x, y, x, y, x + r, y // top-left corner
    ];

    path.splice(
        23,
        3,
        'L', anchorX + halfDistance, y + h,
        anchorX, y + h + arrowLength,
        anchorX - halfDistance, y + h,
        x + r, y + h
    );

    return path;
}

Демонстрационная версия: https://jsfiddle.net/BlackLabel/g5h27mfx/

Документы: https://www.highcharts.com/docs/extending-highcharts