7

私は2つのデータ系列を持つGoogle折れ線グラフRow Aを持っています -そしてRow B:

ここに画像の説明を入力

これは非常に単純なテスト コードです。ブラウザで開くだけで動作します。

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['corechart']}]}"></script>
<script type="text/javascript">

        var data = {"rows":[
        {"c":[{"v":"C"},{"v":-43},{"v":-42}]},
        {"c":[{"v":"D"},{"v":-49},{"v":-39}]},
        {"c":[{"v":"E"},{"v":-49},{"v":-48}]},
        {"c":[{"v":"F"},{"v":-50},{"v":-49}]},
        {"c":[{"v":"G"},{"v":-57},{"v":-56}]}],

        "cols":[
        {"p":{"role":"domain"},"label":"MEASUREMENT","type":"string"},
        {"p":{"role":"data"},"label":"Row A","type":"number"},
        {"p":{"role":"data"},"label":"Row B","type":"number"}]};

        function drawCharts() {
            var x = new google.visualization.DataTable(data);

            var options = {
                title: 'How to add tooltips?',
                width: 800,
                height: 600
            };

            var chart = new google.visualization.LineChart(document.getElementById('test'));
            chart.draw(x, options);
        }

        $(function() {
            google.setOnLoadCallback(drawCharts);
        });

</script>
</head>
<body>
<div id="test"></div>
</body>
</html>

各データポイントにツールチップを追加したいと思います。たとえば、次のように表示されます。

行 A: x=D y=-49

マウスホバー時。dataTable.addColumn私のチャートはperlスクリプトによって一度に生成され、上記のようにとでdataオブジェクトを使用するだけなので、は使用できません。colsrows

ここでそれを行う方法を知っている人はいますか？

4

1 に答える 1