Есть ли способ получить координаты мыши относительно страницы на mouseOver точки в Highcharts? - PullRequest
Новая
       75

Есть ли способ получить координаты мыши относительно страницы на mouseOver точки в Highcharts?

2 голосов
/ 16 марта 2020

Я пытаюсь создать сплайн-диаграмму highchart с позицией tooltip в right corner и всплывающей подсказкой mouseover, указывающей c точек. В общем, я хотел бы показать две подсказки для некоторых пунктов. До сих пор я был в состоянии сделать это только на click событии, где мы располагаем информацией о событии с mouse координатами относительно страницы. Есть ли способ показать два tooltips для одной и той же точки? Я хочу, чтобы one tooltip был расположен в right corner и other one рядом с точкой, как показано ниже JSfiifle. 

"point": {
          "events": {
            "mouseOver": function(e) {
              var selectedPoints = $('#' + this.series.chart.renderTo.id).highcharts().getSelectedPoints();
              if (selectedPoints.length) {
                selectedPoints[0].select();
              }
              if (e.target.marker && !e.target.marker.radius) {
                return;
              }
            },
            "mouseOut": function(e) {
              util.hideBandInsightsPopup();
            },
            "click": function(e) {
              if (e.point && e.point.marker && !e.point.marker.radius) {
                return;
              }

              $("#factor-popup-content").html("my popup content");

              var yPixel = e.pageY + 5;
              var currentPointHeight = yPixel + $("#factor-popup").height();
              if ($("#factor-popup").height() < 300 && currentPointHeight > $(window).height()) {
                var adjustHeight = currentPointHeight - $(window).height() + 30;
                yPixel = yPixel - adjustHeight;
              }
              $("#factor-popup").css({
                'position': 'fixed',
                'top': (yPixel) + 'px',
                'left': (e.pageX) + 5 + 'px'
              }).show();
            }
          }
        }

Вот Jsfiddle http://jsfiddle.net/zLpakfj2/4/

1 Ответ

1 голос
/ 16 марта 2020

Исходное событие не передается в событие mouseOver, но вы можете добавить его, например, к точке следующим образом: 

(function(H) {
  H.wrap(
    H.Pointer.prototype,
    'getHoverData',
    function(
      proceed,
      existingHoverPoint,
      existingHoverSeries,
      series, isDirectTouch,
      shared,
      e
    ) {

      var result = proceed.apply(this, Array.prototype.slice.call(arguments, 1));

      if (result.hoverPoint) {
        result.hoverPoint.originalEvent = e;
      }

      return result;
    });
}(Highcharts));

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

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

...