Re: [visualization-api] My Chart doesn't chart appear while combining both bar and pie chart

15 views

Skip to first unread message

Sergey Grabkovsky

unread,

Feb 29, 2016, 10:05:33 AM2/29/16

to Google Visualization API

Hi Tom,

You have a few problems with your code:

Specifying the values '1', '1.1', and '1.0' is no longer valid for the new loader. The new equivalent value for 1.0 is 'current', the equivalent value for 1.1 is 'upcoming', and there is currently no equivalent value for '1'.
While this doesn't break anything, you no longer have to specify 'visualization' when calling .load. This is because this new loader is used exclusively for charts, and you don't need to clarify.
This is really the biggest problem. You have two drawChart functions in your code. There is no way that any browser will be able to disambiguate between them. You need to give each function and variable a unique identifier if you intend to refer to it. One simple fix would be to just rename your functions to drawChart1 and drawChart2. But the better fix would be to just render both charts in one function, like I did in this jsfiddle: http://jsfiddle.net/1kkjr428/

On Fri, Feb 26, 2016 at 8:04 AM tom jose <1316...@gmail.com> wrote:

My Chart doesn't chart appear while combining both bar and pie chart .Here is the code:

<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script>
google.charts.load('visualization',1, {'packages':['bar','corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses', 'Profit'],
['2014', 1000, 400, 200],
['2015', 1170, 460, 250],
['2016', 660, 1120, 300],
['2017', 1030, 540, 350]
]);

var options = {
chart: {
title: 'Company Performance',
subtitle: 'Sales, Expenses, and Profit: 2014-2017',
}
};

var chart = new google.charts.Bar(document.getElementById('columnchart_material'));

chart.draw(data, options);

}

google.charts.setOnLoadCallback(drawChart);
function drawChart() {

var data = google.visualization.arrayToDataTable([
['Task', 'Hours per Day'],
['Work', 11],
['Eat', 2],
['Commute', 2],
['Watch TV', 2],
['Sleep', 7]
]);

var options = {
title: 'My Daily Activities'
};

var chart = new google.visualization.PieChart(document.getElementById('piechart'));

chart.draw(data, options);
}
</script>
</head>
<body>
<div id="columnchart_material" style="width: 900px; height: 500px;"></div>
<div id="piechart" style="width: 900px; height: 500px;"></div>
</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 google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@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/ac04c986-7023-41c0-aafd-ed731fd6a16c%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

•
Sergey Grabkovsky
•
Software Engineer
•
Google, Inc
•
gra...@google.com

Reply all

Reply to author

Forward

0 new messages

	•	Sergey Grabkovsky
	•	Software Engineer
	•	Google, Inc
	•	gra...@google.com