Google - Pie Chart API

Here's a simple demo on how to render a chart image from Google API:
https://chart.googleapis.com/chart?chs=550x100&chd=t:50,140,30&cht=p3&chl=Hello|World|For

chs = chart size in width x height
chd = chart data
cht = chart type - p, p3, v, lc, lc:nda, bvs
chl = chart label
chco = color - separated comma or bar
chtt = title
chts = color and font of title - ff00ff,15
chdl = legend - medan|jogja|malang
chma = margin - left, right,top,bottom|width,height
chf = backgrouning - bg,s,faffaa
chf = background gradient - c,lg,sudut,leftColor,0,rightColor,1

For more information, see here Google Char API

<h1>Char Generation</h1>
<img id="chart" src="https://chart.googleapis.com/chart?chs=550x100&chd=t:50,140,30&cht=p3&chl=Hello|World|Forr"/> 

<script>
function getChart(data, el){
 var width = data.size[0];
 var height = data.size[1];
 var datas = '';

 for(i=0;i<data.data.length;i++){
  datas = datas+data.data[i]+',';
 }
 datas = datas.substr(0,datas.length-1);

 var label = '';
 for(i=0;i<data.label.length;i++){
  label = label+data.label[i]+'|';
 }
 label = label.substr(0,label.length-1);

 var url = "https://chart.googleapis.com/chart?chs="+width+"x"+height+"&chd=t:"+datas+"&cht=p3&chl="+label;

 el.setAttribute('src',url);
}

// set the url settings
var data = {};
data.size = [400, 100]; // width x height
data.data = [30,40,50];
data.label = ['jogja','malang','medan'];

// calling the chart
var img = document.getElementById('chart');
getChart(data,img);

</script>

Google - Pie Chart API