ColumnChart谷歌可視化列顏色更改

Question

有沒有人知道我是否可以以某種方式破解谷歌的可視化ColumnChart api圖表，使單個列以不同的顏色脫穎而出，如下所示：

我知道你可以用ImageChart來做，所以我不需要它（它不會觸發任何事件，也沒有x / y標簽）。

我可以用某種方式遍歷javascript結果並更改CSS樣式，如果它真的在SVG中呈現？

Answer 1

一個非常便宜的黑客（效果很好）如下：

在圖表的選項中，執行：isStacked（true）;

現在將數據傳遞到兩個單獨的系列中：除了在你的異色條上，一個零到處都是零，一個只在異色條上為零。 “堆疊”欄會產生您在屏幕截圖中發布的效果。

Answer 2

好吧，使用jQuery我能夠得到我的iframe的圖表。 它不漂亮，但它的工作原理。 它也比使用原型短：

$('#google-chart iframe').contents().find("#chartArea g>g>rect")[2].attributes['5'].value = "#eea746";                                         

在上面的代碼中，屬性['5']指的是rect對象的“fill”屬性。

Answer 3

如果你想確定它可以遍歷結果（它通過它的外觀生成內聯svg片段），只需打開你最喜歡的web調試工具（opera dragonfly，firebug或webkit web inspector）來查看它的樣子。

我猜測只使用API​​使一個條形圖有不同的顏色可能更簡單，但如果你想遍歷樹並為它指定一些應該可以正常工作的樣式。 您可以使用標准DOM核心方法遍歷樹，就像在HTML中一樣，例如firstChild, nextSibling, parentNode 。