Flot: schnappen Sie den nächsten Punkt zum Fadenkreuz

Question

Ich habe meine Grafiken angepasst und ich habe versucht, den nächsten Punkt zum Fadenkreuz zu bekommen. Am nächsten kam ich, indem ich die mouseActiveRadius-Option hinzufügte, jedoch nicht den gewünschten Effekt. Dies ist, was passiert:

Wie zu sehen ist, der falsche Punkt hervorgehoben wird.

Mein Grundstück Code:

$.plot("#players_chart", 
     [{ 
      label: "Total number of players", 
      data: data.data_labels 
     }], 
     { 
      series: { 
       lines: { 
        show: true 
       } 
      }, 
      xaxis: { 
       mode: "time", 
       minTickSize: [1, "day"], 
       timeformat: "%a" 
      }, 
      yaxis: { 
       tickDecimals: 0 
      }, 
      crosshair: { 
       mode: "x" 
      }, 
      grid: { 
       hoverable: true, 
       autoHighlight: true, 
       mouseActiveRadius : 1000 
      } 
     } 
    ); 

Gibt es eine Möglichkeit, eine Art von horizontalen Radius dem Fadenkreuz anstelle der Gitter hinzufügen?

Vielen Dank im Voraus.

Answer 1

Die Standardpunktmarkierung ist vom Fadenkreuz-Plugin getrennt und funktioniert nur mit der Entfernung vom Cursor. Wenn Sie nur mit horizontaler Entfernung arbeiten möchten, können Sie die Markierung manuell vornehmen.

Setzen Sie autoHighlight: false und binden Sie ein plothover Ereignis, wo Sie den nächsten Punkt auf der X-Achse suchen und markieren Sie diesen Punkt.

Ähnliche Code ist in der example for the crosshair plugin.