AI-generated Key Takeaways
-
The Image Charts portion of Google Chart Tools has been officially deprecated as of April 20, 2012, but will continue to work as per their deprecation policy.
-
This page provides documentation for creating a pie chart rendered as an image using the Google Charts API.
-
Key sections covered include an overview, examples, loading instructions, data format requirements, configuration options, available methods, and information on events and data policy.
Important: The Image Charts portion of Google Chart Tools has been officially deprecated as of April 20, 2012. It will continue to work as per our deprecation policy .
Overview
A pie chart that is rendered as an image using the Google Charts API .
Example
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load("current", {packages:["imagepiechart"]});
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 chart = new google.visualization.ImagePieChart(document.getElementById('chart_div'));
chart.draw(data, {width: 430, height: 240, title: 'My Daily Activities'});
}
</script>
</head>
<body>
<div id="chart_div" style="width: 400px; height: 240px;"></div>
</body>
</html>
Loading
The google.charts.load
package name is "imagepiechart"
:
google . charts . load ( 'current' , { packages : [ 'imagepiechart' ]});
The visualization's class name is google.visualization.ImagePieChart
var visualization = new google . visualization . ImagePieChart ( container );
Data Format
Two columns. The first column should be a string, and contain the slice label. The second column should be a number, and contain the slice value.
Configuration Options
You can specify the following options as part of the options
object passed into
the visualization's draw()
method.
colors
is specified.color
option
instead.What label, if any, to show for each slice. Choose from the following values:
- 'none' - No labels.
- 'value' - Use the slice value as a label.
- 'name' - Use the slice name (the column name).
Methods
| Method | Return Type | Description |
|---|---|---|
draw(data, options)
|
none | Draws the chart. |
Events
You can register to hear the events described on the Generic Image Chart page.
Data Policy
Please refer to the Chart API logging policy .
