Inserting an image into a chart background

2,816 views
Skip to first unread message

Toxy

unread,
Jan 28, 2011, 10:20:11 AM1/28/11
to Google Chart API
I'm trying to create a bar chart with an image, such as a logo,
displayed underneath it. The API doesn't seem to support background
image functionality and this forum's users have reported bugs when
chart transparency is turned on. I've even considered a carefully
photoshopped .png overlay of the logo, but would lose mouseover
functionality.

Has anyone had a similar problem and found a decent work around?

David Nicol

unread,
Jan 28, 2011, 11:48:39 AM1/28/11
to google-c...@googlegroups.com
Here's an idea:

http://stackoverflow.com/questions/403478/css-how-to-overlay-images
suggests using http://www.w3schools.com/css/css_image_transparency.asp
opacity to make an upper image transparent. Have you tried turning
down the opacity on a fully opaque chart instead of using the
transparent colors?

Jesse Smith

unread,
Jan 31, 2011, 4:21:55 PM1/31/11
to google-c...@googlegroups.com
Thanks for your input, David. We have in fact considered doing a
transparant overlay, but if we go that route we will lose the js
mouseover effects, unfortunately. Your other idea, turning down the
opacity of the whole chart, definitely could work- I'll have to see
how the chart looks with grays and lighter shades of color as opposed
to blacks and bold colors.

> --
> You received this message because you are subscribed to the Google Groups "Google Chart API" group.
> To post to this group, send email to google-c...@googlegroups.com.
> To unsubscribe from this group, send email to google-chart-a...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/google-chart-api?hl=en.
>
>

David Nicol

unread,
Jan 31, 2011, 6:35:09 PM1/31/11
to google-c...@googlegroups.com
Over the weekend I found myself having pizza with a pretty good CSS
hacker, who informed me that the DIV tag can take a background
attribute. So putting a chart, with lowered opacity, in a DIV with a
background image, sounds like something to experiment with. Here it
is, enjoy

http://davidnicol.com/Chartoverlay.html

Reply all
Reply to author
Forward
0 new messages