3

我有一个关于谷歌图表（柱形图）的具体问题。
“如何使“日期”可点击，以便可以打开带有外部页面的模式对话框（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);

任何帮助将不胜感激。- 罗伯特。

4

1 回答 1

13

如果您使用'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);
于 2013-09-03T18:55:32.507 回答