On Tuesday, September 3, 2013 5:22:18 AM UTC-4, Shaun O'Connor wrote:

> I have been using google charts to display information on a 42" TV, 
> However I want to resize some of the graphs to display on 100% of the 
> screen instread of using px. THis will allow the Charts to be view on 
> smaller screens. I was wondering in I put this in the JS or in the CSS.
>
Thanks shaun
>


Here are two examples of charts that will fill the containing div...

   - Responsive Google Pie Chart <http://jsfiddle.net/toddlevy/c59HH/>
   - Responsive Google Bar Chart <http://jsfiddle.net/toddlevy/3Jxpn/>

What you'll need to do to make it work for you...

1) Change the width of the body tag CSS to 100%

2) Change the margin of the body  tag CSS to 0 auto

3) Change the bottom padding of visualization_wrap to match the aspect 
ratio of your display 

Calculate as Height / Width x 100, so for a 16x9 display it would be 9/16 = 
0.5625 x 100 = 56.25%


4) As needed, fiddle with the "chartArea" options to ensure that your 
labels don't get cut off

NOTE: These work with 
jquery.throttledresize.js<https://github.com/louisremi/jquery-smartresize>to 
support responsive design, which it seems 
*you don't need* (though others may appreciate).

Hope that helps,
Todd Levy <http://www.toddlevy.com>



-- 
You received this message because you are subscribed to the Google Groups 
"Google Chart 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-chart-api.
For more options, visit https://groups.google.com/groups/opt_out.

Reply via email to