Your strategy of media queries certainly is a good idea and gives you
greater control over exactly how the the chart looks at any particular
screen size.

The example I sent works at various screen sizes because the chart size is
not set.

FYI--One thing that helped me a lot with an area chart that I created
recently was "chartArea".  I don't know if you are having problems with the
labels for the horizontal and/or vertical axis getting truncated, but I
was.  You set it in the options section of the chart. For example:

chartArea:{bottom:"80", top:"10", left:"65", right:"85"}

On Wed, Apr 11, 2018 at 4:01 PM, Al Lemieux <[email protected]> wrote:

> This is cool! So, it looks like there's nothing defining the size of the
> chart. Is that what makes it responsive? Are the charts then inherently
> responsive?
>
> I ended up setting the size in a style sheet and then changing the size in
> a media query.
>
> Al Lemieux
> Senior Production Designer
> Nielsen
>
> c: 781 879-7527
>
>
>
> On Wed, Apr 11, 2018 at 1:43 PM, Cheryl Evans <[email protected]>
> wrote:
>
>> Here's a responsive bar chart as an example.
>>
>> Need the meta tag for it to be responsive
>> <meta name="viewport" content="width=device-width, initial-scale=1">
>>
>> Also need
>> window.addEventListener("resize", drawBarChart, false)
>>
>> Google Charts doesn't center the title or have subtitles, so I created my
>> own.
>>
>>
>> Thanks for letting me know the font suggestion didn't work.
>>
>> On Tue, Apr 10, 2018 at 6:36 AM, Al Lemieux <[email protected]>
>> wrote:
>>
>>> Is it possible to define the chart width as a percentage? For a
>>> responsive design? In the chart options, I've defined the chart width and
>>> height, but is there a way to make this flexible?
>>>
>>>
>>> --
>>> 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 google-visualization-api@googl
>>> egroups.com.
>>> Visit this group at https://groups.google.com/grou
>>> p/google-visualization-api.
>>> To view this discussion on the web visit https://groups.google.com/d/ms
>>> gid/google-visualization-api/6687a3f0-ccc8-4ef1-83e4-f994779
>>> 54d30%40googlegroups.com
>>> <https://groups.google.com/d/msgid/google-visualization-api/6687a3f0-ccc8-4ef1-83e4-f99477954d30%40googlegroups.com?utm_medium=email&utm_source=footer>
>>> .
>>> 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 google-visualization-api@googl
>> egroups.com.
>> Visit this group at https://groups.google.com/grou
>> p/google-visualization-api.
>> To view this discussion on the web visit https://groups.google.com/d/ms
>> gid/google-visualization-api/CAFyZTc_WMByJhCmVVwFw3oxUiOTBm
>> vubX507%2B7xHwbzwLXzgZw%40mail.gmail.com
>> <https://groups.google.com/d/msgid/google-visualization-api/CAFyZTc_WMByJhCmVVwFw3oxUiOTBmvubX507%2B7xHwbzwLXzgZw%40mail.gmail.com?utm_medium=email&utm_source=footer>
>> .
>> 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 google-visualization-api@
> googlegroups.com.
> Visit this group at https://groups.google.com/
> group/google-visualization-api.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/google-visualization-api/CAL4SAKTj7Win2h0W5bDLqbYJttRxv
> Wqd7Q0x4Sw8gqaksBUehA%40mail.gmail.com
> <https://groups.google.com/d/msgid/google-visualization-api/CAL4SAKTj7Win2h0W5bDLqbYJttRxvWqd7Q0x4Sw8gqaksBUehA%40mail.gmail.com?utm_medium=email&utm_source=footer>
> .
> 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 https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/CAFyZTc--%2BZo4xubyXDK8UZSyAwPBxvtCDwt3UKkJTRC%3DdqvzGA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to