2015-05-05 13 views
5

Tworzę highcharts serii wykresu stosując następującą logiką:Jak uzyskać wartość punktu wykresu highcharts po najechaniu kursorem myszy?

this.series = []; 

for(var i in headerData) { 
    var header = headerData[i]; 

    this.series.push({ 
     name: header.name, 
     data:[], 
     yAxis:parseInt(header.axis), 
     id: header.id, 
     type: 'column', 
     zIndex: 1, 
     events: { 
      mouseOver: function (e) { 
       console.log('Point: ', e.point); 
      } 
     } 
    }); 
} 

I read że punkt jest własnością przypadku e, ale w moim przypadku jest undefinede.point. Nie mogę też znaleźć niczego w e powiązanego z punktem moused-over.

Czy ktoś wie, jak uzyskać wartości x i y punktu, który został zmoczony?

Odpowiedz

5

Należy ustawić wartość event dla właściwości plotOptions. Oto przykład wzięty z dokumentacji Highcharts API:

$(function() { 
    var $reporting = $('#reporting'); 

    $('#container').highcharts({ 

     title: { 
      text: 'Mouse events demo' 
     }, 
     subtitle: { 
      text: 'On point mouse over or mouse out, the values should be reported in top left' 
     }, 
     plotOptions: { 
      series: { 
       point: { 
        events: { 
         mouseOver: function() { 
          var chart = this.series.chart; 
          if (!chart.lbl) { 
           chart.lbl = chart.renderer.label('') 
            .attr({ 
             padding: 10, 
             r: 10, 
             fill: Highcharts.getOptions().colors[1] 
            }) 
            .css({ 
             color: '#FFFFFF' 
            }) 
            .add(); 
          } 
          chart.lbl 
           .show() 
           .attr({ 
            text: 'x: ' + this.x + ', y: ' + this.y 
           }); 
         } 
        } 
       }, 
       events: { 
        mouseOut: function() { 
         if (this.chart.lbl) { 
          this.chart.lbl.hide(); 
         } 
        } 
       } 
      } 
     }, 

     tooltip: { 
      enabled: false 
     }, 

     series: [{ 
      data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 
     }] 
    }); 
}); 

Demo

+1

Dzięki tej technice można użyć zamiast '' this' z e.point'. –

Powiązane problemy