Tooltips für mehrere Linien, die die Google-Line-Diagramm

Frage ich mich, ob jemand weiß, wie würden Sie gehen über das hinzufügen von QuickInfos, um mehrere Zeilen von Daten mit Google-Linien-Charts mit DataTable addColumn und addRow?

Ich habe gesehen, dass es mit anderen Methoden durchgeführt, aber das ist ziemlich schwer in meinem Projekt und ich fühle mich wie Blödmann nicht herauszufinden dieses heraus. Anyways, ich habe verdummt, meinen code zu präsentieren, die essentials auf mein problem.

Wie Sie sehen, zeigt die QuickInfo für die Linie 2, aber nicht für die Linie 1. Meine Frage ist: Wie erstelle ich eine tooltip-Line 1 mit dieser Methode?
Mein code:
http://jsfiddle.net/Qquse/550/

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('number', 'y');
        data.addColumn('number', 'Line 1');
        data.addColumn('number', 'Line 2');
        data.addColumn({type: 'string', role: 'tooltip'});
        data.addRow([1, 1, 2, "Some fancy tooltip"]);
        data.addRow([2, 2, 4, "Some fancy tooltip"]);
        data.addRow([3, 3, 6, "Some fancy tooltip"]);
        data.addRow([4, 4, 8, "Some fancy tooltip"]);
        data.addRow([5, 5, 10, "Some fancy tooltip"]);
        var options = {
            title: 'Graph'
        };

       var chart = new google.visualization.LineChart(document.getElementById('chart'));
       chart.draw(data, options);
    }
    google.load("visualization", "1", {packages: ["corechart"]});
    google.setOnLoadCallback(drawChart);
</script>
</head>
<body>
<div id="chart"></div>
</body>
</html>
  • Danke, mein problem gelöst.
  • löschen Sie bitte entweder deine Frage oder fügen Sie Ihre eigenen Antwort, wenn Sie denken, dass es ist nicht-trivial und nützlich für zukünftige Besucher.
  • I ' TS nicht meine Frage, vielleicht könnten Sie Fragen Leakim
InformationsquelleAutor Leakim | 2014-03-24
  1. 21

    Habe ich versucht, indem sowohl die DataColumns, dann die tooltips. Stellt sich heraus, es war in dieser Reihenfolge:

    data.addColumn('number', 'y');
data.addColumn('number', 'Line 1');
data.addColumn({type: 'string', role: 'tooltip'});
data.addColumn('number', 'Line 2');
data.addColumn({type: 'string', role: 'tooltip'});

    statt

    data.addColumn('number', 'y');
data.addColumn('number', 'Line 1');
data.addColumn('number', 'Line 2');
data.addColumn({type: 'string', role: 'tooltip'});
data.addColumn({type: 'string', role: 'tooltip'});

    Aktualisiert arbeiten fiddle: http://jsfiddle.net/Qquse/1207/

    • Danke, deine Erfahrung hat mich gerettet die gleichen schmerzhaften Experimente, wie die Dokumente, die für benutzerdefinierte tooltips in den google-charts, kein mulitple data-Spalte Beispiel dafür.
    • Danke!!! Hätte nicht gedacht, dass die Reihenfolge der Spalten egal.
    InformationsquelleAutor Leakim
Schreibe einen Kommentar