Hey
Change the code like this.
<html>
<body>
<div id="table_div"></div>
<div id="chart_div"></div>
<script type="text/javascript" src="
https://www.gstatic.com/charts/loader.js";></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['table']});
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawTable);
google.charts.setOnLoadCallback(drawVisualization);
function drawTable() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Name');
data.addColumn('number', 'Salary');
data.addColumn('boolean', 'Full Time Employee');
data.addRows([
['Mike', {v: 10000, f: '$10,000'}, true],
['Jim', {v:8000, f: '$8,000'}, false],
['Alice', {v: 12500, f: '$12,500'}, true],
['Bob', {v: 7000, f: '$7,000'}, true]
]);
var table = new
google.visualization.Table(document.getElementById('table_div'));
table.draw(data, {showRowNumber: true, width: '50%', height:
'50%'});
}
function drawVisualization() {
// Some raw data (not necessarily accurate)
var data = google.visualization.arrayToDataTable([
['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea',
'Rwanda', 'Average'],
['2004/05', 165, 938, 522, 998,
450, 614.6],
['2005/06', 135, 1120, 599, 1268,
288, 682],
['2008/09', 136, 691, 629, 1026,
366, 569.6]
]);
var options = {
title : 'Monthly Coffee Production by Country',
vAxis: {title: 'Cups'},
hAxis: {title: 'Month'},
seriesType: 'bars',
series: {5: {type: 'line'}}
};
var chart = new
google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</body>
</html>
Hope this helps.
2019年5月27日(月) 15:49 Bluedevelop1 <[email protected]>:
> Hello,
>
> I am having a certain type of issue where It doesn't allow me to post up
> multiple charts on the same html page.
>
> I got one to display ok, but when I enter the secondary one, it doesn't
> show.
>
> Might there be anything that I need to look out for in order to display
> both of these below, for example:
>
> <html>
>
> </head>
> <body>
> <div id="table_div"></div>
> <head>
> <script type="text/javascript" src="
> https://www.gstatic.com/charts/loader.js";></script>
> <script type="text/javascript">
> google.charts.load('current', {'packages':['table']});
> google.charts.setOnLoadCallback(drawTable);
>
> function drawTable() {
> var data = new google.visualization.DataTable();
> data.addColumn('string', 'Name');
> data.addColumn('number', 'Salary');
> data.addColumn('boolean', 'Full Time Employee');
> data.addRows([
> ['Mike', {v: 10000, f: '$10,000'}, true],
> ['Jim', {v:8000, f: '$8,000'}, false],
> ['Alice', {v: 12500, f: '$12,500'}, true],
> ['Bob', {v: 7000, f: '$7,000'}, true]
> ]);
>
> var table = new
> google.visualization.Table(document.getElementById('table_div'));
>
> table.draw(data, {showRowNumber: true, width: '50%', height:
> '50%'});
> }
> </script>
>
>
> <script type="text/javascript" src="
> https://www.gstatic.com/charts/loader.js";></script>
> <script type="text/javascript">
> google.charts.load('current', {'packages':['corechart']});
> google.charts.setOnLoadCallback(drawVisualization);
>
> function drawVisualization() {
> // Some raw data (not necessarily accurate)
> var data = google.visualization.arrayToDataTable([
> ['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New
> Guinea', 'Rwanda', 'Average'],
> ['2004/05', 165, 938, 522,
> 998, 450, 614.6],
> ['2005/06', 135, 1120, 599,
> 1268, 288, 682],
> ['2008/09', 136, 691, 629,
> 1026, 366, 569.6]
> ]);
>
> var options = {
> title : 'Monthly Coffee Production by Country',
> vAxis: {title: 'Cups'},
> hAxis: {title: 'Month'},
> seriesType: 'bars',
> series: {5: {type: 'line'}}
> };
>
> var chart = new
> google.visualization.ComboChart(document.getElementById('chart_div'));
> chart.draw(data, options);
> }
> </script>
> </body>
> </html>
>
> --
> 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/76af9a7b-2150-42eb-96b7-4cfc0d4cb595%40googlegroups.com
> <https://groups.google.com/d/msgid/google-visualization-api/76af9a7b-2150-42eb-96b7-4cfc0d4cb595%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 [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/CAFv2HC9PsoDiG6AvM0ROotypzhZvo%3DutsyneNsdU8D%3DuF6OCoQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
