You need to replace
var chart = new google.charts.ColumnChart(document.getElementById('
columnchart_material'));
with
var chart = new google.visualization.ColumnChart(document.getElementById('
columnchart_material'));
Also, with the 'corechart' charts, many options are different, and you
should *not* call google.charts.Bar.convertOptions(). Maybe it would help
to start with a full example (from the documentation page) that uses
google.visualization.ColumnChart() with percent stacking, and then swap in
your data, and add options incrementally.
On Wed, Mar 13, 2019 at 2:35 PM Heywood Buzzfuddle <[email protected]>
wrote:
> I changed like this:
> // google.charts.load('current', {'packages':['bar']});
> google.charts.load("current", {packages: ["corechart"]});
>
> I also did:
> // var chart = new
> google.charts.Bar(document.getElementById('columnchart_material'));
> var chart = new
> google.charts.ColumnChart(document.getElementById('columnchart_material'));
>
> // chart.draw(data, google.charts.Bar.convertOptions(options));
> chart.draw(data,
> google.charts.ColumnChart.convertOptions(options));
>
> No joy in any combination. I've been all over that reference.
>
> I don't have a line like this:
>
> var visualization = new google.visualization.ColumnChart(container);
>
> anywhere in my code, don't understand it (container???), and don't know
> where I need to put it. Do I need it? Where and how do i use it if i do??
>
>
> Boiled down code right now is:
>
> <script type="text/javascript">
> google.charts.load('current', {'packages':['bar']});
> // google.charts.load("current", {packages: ["corechart"]});
>
> google.charts.setOnLoadCallback(drawChart);
>
> function drawChart() {
>
> var data = google.visualization.arrayToDataTable([
> my data
> ]);
> var options = {
> isStacked: true,
> some options
> };
>
> var chart = new
> google.charts.Bar(document.getElementById('columnchart_material'));
> // no joy var chart = new
> google.charts.ColumnChart(document.getElementById('columnchart_material'));
>
> chart.draw(data, google.charts.Bar.convertOptions(options));
> // no joy chart.draw(data,
> google.charts.ColumnChart.convertOptions(options));
> };
>
> </script>
>
>
>
>
>
> On Wednesday, March 13, 2019 at 1:04:57 PM UTC-5, Daniel LaLiberte wrote:
>>
>> Yes, you need to change your google.load() call to load the 'corechart'
>> package, and then google.visualization.ColumnChart will be defined. See
>> documentation here:
>> https://developers.google.com/chart/interactive/docs/gallery/columnchart#stacked-column-charts
>>
>> On Wed, Mar 13, 2019 at 1:22 PM Heywood Buzzfuddle <[email protected]>
>> wrote:
>>
>>>
>>> If I do
>>> chart.draw(data, google.charts.BarChart.convertOptions(options));
>>> or
>>> chart.draw(data, google.charts.ColumnChart.convertOptions(options));
>>>
>>> it doesn't render.
>>>
>>> The only place i see google.visualization in my code anywhere is
>>> google.visualization.arrayToDataTable
>>>
>>> Am I supposed to somehow change this line:
>>> var chart = new
>>> google.charts.Bar(document.getElementById('columnchart_material'));
>>>
>>> Terribly confused.
>>>
>>> On Wednesday, March 13, 2019 at 11:46:40 AM UTC-5, Daniel LaLiberte
>>> wrote:
>>>>
>>>> Sorry, the 'percent' and 'relative' stacking option is not supported by
>>>> the material 'Bar' chart. If you can use the google.visualization.BarChart
>>>> or ColumnChart, it should work. You might want to use the 'theme':
>>>> 'material' option to get the material colors and fonts.
>>>>
>>>>
>>>> --
>>> 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/09362f74-b34d-42ee-9251-dd14f9557189%40googlegroups.com
>>> <https://groups.google.com/d/msgid/google-visualization-api/09362f74-b34d-42ee-9251-dd14f9557189%40googlegroups.com?utm_medium=email&utm_source=footer>
>>> .
>>> For more options, visit https://groups.google.com/d/optout.
>>>
>>
>>
>> --
>> Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2>
>> [email protected] Cambridge MA
>>
> --
> 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/af6b10cc-375b-4f83-91df-178ac7967a3f%40googlegroups.com
> <https://groups.google.com/d/msgid/google-visualization-api/af6b10cc-375b-4f83-91df-178ac7967a3f%40googlegroups.com?utm_medium=email&utm_source=footer>
> .
> For more options, visit https://groups.google.com/d/optout.
>
--
Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2>
[email protected] <[email protected]> Cambridge MA
--
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/CAOtcSJMx6W5O5FL4w%3DjeyUmAXeVr7NkobMGQgzRZq2U0wK0TsA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
