Wie man den index eines Punktes in Highcharts?

Bin ich mit "Zeit-Daten mit unregelmäßigen Abständen" chart von Highcharts. Wie Sie wissen, wenn die Maus über die Punkte der Linie, die der formatter-Funktion ausgeführt wird, und zeigt einige Informationen. Ich möchte wissen index der Punkt, dass die Maus darüber bewegt. Wenn also die Maus bewegt sich über ersten Punkt der Linie, der tooltip zeigt "1" und die zweite Stelle zeigt "2" und so weiter. thnx.

  • Edgar ' s Antwort scheint die beste zu sein, keine Bearbeitung erforderlich.
InformationsquelleAutor Morteza | 2011-12-14
  1. 62

    Dieser arbeitete für mich mit v2.2: 

    this.series.data.indexOf( this.point )
    • Arbeitete für mich auch. Einfach!
    • hervorragende, kurze und einfache!!!. obwohl ich nicht glaube, müssen Sie die diese.Punkt (in den Klammern ) , nur mit diesem
    • Dies sollte die akzeptierte Antwort. Die akzeptierte Antwort ist ein hässlicher hack.
    • genial! thx JD Smith!
    • Schlicht und einfach. Danke!
    InformationsquelleAutor Edgar
  2. 12

    Eine Möglichkeit ist die pre-Prozess die Daten zu enthalten, die eine Eigenschaft mit dem index. In der Schnee-Tiefe Beispiel könnten Sie tun, eine Vorbereitung wie diese:

    function prepare(dataArray) {
    return dataArray.map(function (item, index) {
        return {x: item[0], y: item[1], myIndex: index};
    });
};

    konvertieren Sie das array von [x, y] werden, um ein Objekt wie { x: x, y: y, myIndex: i}. Dann seine einfach zu Holen, dass der index in den Formatierer mit:

    formatter: function() {
     return 'point ' + this.point.myIndex;
}

    Beispiel auf jsfiddle

    • Dieser code scheint nicht mehr schneller. Ich Teste es in meinem Projekt So schnell wie ich kann. Thnx eolsson.
    • Ja, es sollte schneller sein, als die Suche für den index, aber auch mehr Speicherplatz.
    • Wow.. Jetzt habe ich erfahren, dass ich hinzufügen kann, mehr Attribute außer name,x,y,Hinweis im Objekt-array. +1 für das
    • Während dies sollte marginal schneller sein, @Edgar, der die Lösung unten ist mehr allgemein. In einigen code wo die Daten nicht konstant ist (zum Beispiel, wenn Sie Daten filtern Punkte und einige entfernt bekommen), die Indizes veralten können. Geschwindigkeit sollte nicht das Thema sein, es sei denn, der Datenbestand ist riesig.
    InformationsquelleAutor eolsson
  3. 5

    Für den Datensatz zu tun, es direkt in einer netten Art und Weise

    Es ist speichern in:

    this.points[0].point.x
    • Dies funktioniert für mich, nicht sicher, warum du downvoted.
    • Ich kann dir genau sagen, warum das dann downvoted: weil Sie sich auf die Inhalte von X ein index. In meinem Fall war X ein Datum, also habe ich die Termine. Allerdings mit seriesMapping ich zugeordnet der Dritten Spalte der CSV-zu einer tatsächlichen index und dann zugegriffen es mit dieser Zeile 🙂 +1 von mir
    InformationsquelleAutor user789148
  4. 2

    Da die Daten sortiert sind, können Sie eine binäre Suche.

    Eine binäre Suche durchführen sollten, auch für eine große Anzahl von Punkte (aus dem wikipedia-Artikel: "Zum Beispiel, für die Suche eine Liste mit einer million Elementen nimmt so viele, wie eine million Iterationen mit linearer Suche, aber nie mehr als zwanzig Iterationen mit binärer Suche."

    Beispiel:

    var bsComparator = function(a, b) {
    if (a.x < b.x) { return -1; }
    if (a.x > b.x) { return 1; }
    return 0;
};
var binarySearch = function(series_data, point) {
    var low = 0, high = series_data.length - 1,
        i, comparison;
    while (low <= high) {
        i = Math.floor((low + high) / 2);
        comparison = bsComparator(series_data[i], point);
        if (comparison < 0) { low = i + 1; continue; }
        if (comparison > 0) { high = i - 1; continue; }
        return i;
    }
    return null;
};


tooltip: {
    formatter: function() {
        var pointIndex = binarySearch(this.series.data, this.point);
        return "Point index: " + pointIndex;
    }
}

    (die binarysearch-Methode die oben beschriebene Funktion ist inspiriert von http://www.dweebd.com/javascript/binary-search-an-array-in-javascript/)

    InformationsquelleAutor codeape
  5. 1

    Klingt wie Sie brauchen nur den x-Wert (d.h. die Zeit). Verwendung:
    this.xData.indexOf(point.x)

    diese.die Punkte werden gruppiert in größeren Serien so wäre eine tiefere Suche durch die Punkte[0]...Punkte[n].

    InformationsquelleAutor danb201268326
  6. 1

    Dies ist alles, was für mich gearbeitet auf Highstock JS v4.2.4:

    var index = this.points[0].point.dataGroup.start;
    InformationsquelleAutor coderama
  7. 0

    Dies ist in etwa so hacky, wie es kommt, und langsam wie die Hölle mit einer Menge von Punkten, aber es wird funktionieren. Die Allgemeine Idee ist, sich durch all die Punkte, die in der Reihe' Daten, bis Sie denjenigen finden, der passend zu den aktuellen Punkt:

    tooltip: {
     formatter: function() {
         for(var i=0;i<this.series.data.length;i++){
              var item = this.series.data[i];
              if(item.x == this.x && item.y == this.y)
               return 'point ' + i;
         }
         return 'not found'
     }
  }

    Live-Beispiel: http://jsfiddle.net/Fuv4h/

    • Das ist genau das, was ich will. Aber wie du bereits erwähnt hast diesen code braucht so viel Zeit, um auszuführen, speziell wenn die Zeile voll ist der Punkte. BTW, ich danke dir.
    InformationsquelleAutor Jamiec
  8. 0

    Wenn Sie Zugang zu Ihrem Ausgangspunkt können Sie dann einfach zugreifen,
    this.point.index oder einfach this.index wenn this bezieht sich auf den Punkt selbst
    um Zugang zu seinem index,

    In meinem Fall verwende ich immer, weil seine einfacher dann @Edgar Lösung, die ist auch toll.

    InformationsquelleAutor Saif Ullah
Schreibe einen Kommentar