ColumnChart колонка визуализации Google Изменение цвета

Question

Кто-нибудь знает, если я могу взломать визуализации ColumnChart api диаграмму Google каким-то образом, чтобы сделать один столбец выделяются другим цветом, например, так:

alt text http://i46.tinypic.com/106gb39.png

Я знаю, что вы можете сделайте это с помощью ImageChart, поэтому мне это не нужно (он не запускает никаких событий и не имеет ярлыков x/y).

Могу ли я каким-то образом изменить результат с помощью javascript и изменить стиль CSS, если он действительно отображается в SVG?

Answer 1

Ну, используя jQuery, я смог добраться до своего iframe для графика. Это некрасиво, но это работает. Это также меньше, чем при использовании прототипа:

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

В коде выше атрибуты [ «5»] относится к «заполнить» атрибут объекта Rect.

Answer 2

Вы можете просмотреть результат, если хотите (он генерирует встроенные svg-фрагменты по внешнему виду), просто откройте свой веб-инструмент отладки (opera dragonfly, firebug или webkit web inspector), чтобы посмотреть, как он выглядит.

Я предполагаю, что проще было бы просто использовать API, чтобы сделать один бар другого цвета, но если вы хотите пересечь дерево и присвоить ему какой-то стиль, который должен работать нормально. Вы можете использовать стандартные методы DOM core для перемещения по дереву, как в HTML, например firstChild, nextSibling, parentNode.

Answer 3

действительно дешевый хак (который работает довольно хорошо) заключается в следующем:

В Options для диаграммы, делать: isStacked (истинное);

Теперь передайте данные в двух отдельных сериях: один, который равен нулю везде, кроме вашего несимметричного полотна, и тот, который равен нулю только на неровной полосе. «Сложенные» бары дают только эффект, который вы опубликовали на скриншоте.