Ah, I figured that you wouldn't want to hardcode the position and size of the gradient, but I suppose that if you don't care about that, then this is a valid workaround.
On Fri Feb 20 2015 at 2:42:52 PM Laura Johnson <[email protected]> wrote: > Sergey, > > I developed a workaround. I created a gradient background on the <div> and > set the size and position and no repeat. I've tested it in IE and Firefox > with no issues. > > Here's the CSS for the gradient background: > > #series_chart_div > { > background: #ff120a; /* Old browsers */ > background: -moz-linear-gradient(31deg, #ff120a 0%, #f8fc02 47%, #4bd31d > 100%); /* FF3.6+ */ > background: -webkit-gradient(linear, left bottom, right top, > color-stop(0%,#ff120a), color-stop(47%,#f8fc02), color-stop(100%,#4bd31d)); > /* Chrome,Safari4+ */ > background: -webkit-linear-gradient(31deg, #ff120a 0%,#f8fc02 47%,#4bd31d > 100%); /* Chrome10+,Safari5.1+ */ > background: -o-linear-gradient(31deg, #ff120a 0%,#f8fc02 47%,#4bd31d > 100%); /* Opera 11.10+ */ > background: -ms-linear-gradient(31deg, #ff120a 0%,#f8fc02 47%,#4bd31d > 100%); /* IE10+ */ > background: linear-gradient(31deg, #ff120a 0%,#f8fc02 47%,#4bd31d 100%); > /* W3C */ > filter: progid:DXImageTransform.Microsoft.gradient( > startColorstr='#ff120a', endColorstr='#4bd31d',GradientType=1 ); /* IE6-9 > fallback on horizontal gradient */ > background-size: 493px 310px; > background-repeat: no-repeat; > background-position: 154px 96px; > min-height: 500px; > width: 800px; > } > > I have attached a screengrab of the chart itself. > > > > Laura > > On Friday, February 20, 2015 at 11:15:13 AM UTC-5, Laura Johnson wrote: > >> Hi all, >> >> I was wondering if it were possible to add a CSS3 gradient to the >> backgroundColor property for a bubble chart. >> >> I know I can add a hex color....but was hoping to incorporate a gradient >> instead. >> >> Thanks for reading. >> >> Laura >> > -- > You received this message because you are subscribed to the Google Groups > "Google Visualization API" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to > [email protected]. > Visit this group at > http://groups.google.com/group/google-visualization-api. > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
