Подсказки для нескольких строк диаграммы Google

Мне интересно, знает ли кто, как вы собираетесь добавлять всплывающие подсказки к нескольким строкам данных с помощью графиков Google Line, используя DataTable, addColumn и addRow?

Я видел, как это делалось с использованием других методов, но это довольно сложно в моем проекте, и я чувствую себя тупым, не понимая этого. В любом случае, я опустил свой код, чтобы представить суть моей проблемы.

Как вы видите, всплывающая подсказка отображается для строки 2, но не для строки 1. Мой вопрос таков: как добавить всплывающую подсказку в строку 1 с помощью этого метода? Мой код: 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>

Ответ 1

Я попытался сначала добавить DataColumns, а затем всплывающие подсказки. Оказывается, это должно быть в следующем порядке:

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'});

вместо

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'});

Обновлен рабочий скрипт: http://jsfiddle.net/Qquse/1207/

Ответ 2

Я работаю с несколькими графиками. После присоединения к ним отображается только последний с всплывающей подсказкой html. Все предыдущие графики отображаются с подсказкой по умолчанию, а не с HTML. Как я могу установить все подсказки для отображения с заданным значением HTML?