使水平轴标签可点击

Question

我有一个关于Google Charts(柱形图)的具体问题.
"如何使"日期"可点击,以便我可以打开一个带有外部页面的模态对话框(jQuery)？"

我添加了一个例子来说明我的意思,这显然是在Photoshop中完成的.
当我点击任何一个栏时,我能够调出警告对话框,但这不是我想要的.

我试图搜索它,但无法找到任何东西.
附件是我用来使酒吧可点击的代码,也许有人知道如何修改它而无需谷歌.

var handler = function(e) {
    var sel = chart.getSelection();
    sel = sel[0];
    if (sel && sel['row'] && sel['column']) {
      var message = "Hi..";
      alert(message);
    }
}
google.visualization.events.addListener(chart, 'select', handler);

非常感谢任何帮助. - 罗伯特

Answer 1

如果使用'click'处理程序而不是'select'处理程序,则可以更轻松地与图表的其他部分进行交互.

这是一个例子:http://jsfiddle.net/6LJhv/6/

您的事件对象e将具有targetID属性.

这targetID没有详细记录,但如果您运行调试器,您可以了解ID的外观.

在各种轴线图(线,列等)上targetID,轴标签看起来像这样:hAxis#0#label#1.要将其分解,这意味着您单击了第一个水平轴的第二个标签(基于0的索引).

鉴于此,targetID如果它是离散的,我们可以剖析出你从数据中点击的标签.

(如果您的数据是连续的,则与标签和数据行之间不一定存在1:1的关系)

var handler = function(e) {
    var parts = e.targetID.split('#');
    if (parts.indexOf('label') >= 0) {
        var idx = parts[parts.indexOf('label') + 1];
        alert(data.getValue(0, parseInt(idx)));
    }
};
google.visualization.events.addListener(chart, 'click', handler);