ColumnChartのGoogleの可視化列の色の変化

Question

私はGoogleの可視化 ColumnChartのAPI のチャートは何とか、単一の列は、異なる色で目立つようにするので、同様ます：

の

私はあなたがImageChartでそれを行うことができます知っているので、私は（それが何のイベントを発生しないし、何のx / yのラベルを持っていない）ことを必要としません。

私は何とかJavaScriptで結果を横断し、それが本当にSVGで描画されている場合、CSSスタイルを変更することはできますか？

Answer 1

まあ、私はグラフのために私のiframeに取得することができたのjQueryを使って。それはきれいではありませんが、それは動作します。また、試作品を使用してより短いです。

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

属性上記のコードでは[「5」]四角形オブジェクトの属性を「埋める」を意味する。

Answer 2

（非常によく動作します）

本当に安いハックは以下の通りです：

オプションで、あなたのチャートのため、ん：isStacked（真）;

あなたのオフ色のバー、そして唯一のオフ色のバーではゼロだ1以外ではどこでもゼロだ1：

これで二つの別々の系列のデータを渡します。 「スタック」のバーは、あなたのスクリーンショットに投稿されたあなただけの効果が得られます。

Answer 3

あなたは（それはそれのルックスによって、インラインSVGの断片を生成しています）ことを確認したい場合は、結果をトラバースちょうどあなたのお気に入りのWebデバッグツール（オペラトンボ、放火犯やWebKitのウェブインスペクタ）を開き、それはどのように見えるかを確認することができます。

私はそれだけで1つのバーが別の色を持たせるためにAPIを使用する方が簡単かもしれません推測しているが、あなたはツリーを走査し、うまく動作するはずです、それにはいくつかのスタイルを割り当てる場合。あなたは、標準の DOMコアを使用することができますツリーを横断するための方法は、単に、例えばfirstChild, nextSibling, parentNodeます。

HTMLで好き