Grafiğinizi tarayıcınızda URL veya <img> etiketi olarak belirtmeye GET isteği denir. GET isteğinde bulunmak basittir ancak GET URL'leri 2.000 karakterle sınırlıdır. Bundan daha fazla veriniz varsa ne olur?
Neyse ki Chart API, 16K uzunluğa kadar grafik istekleri için HTTP POST'u destekler. Bunun karşılığında, POST kullanmanın ek karmaşıklığı vardır.
En temel POST isteği türüne ilişkin örneği burada bulabilirsiniz: <form> öğesi kullanma:
Bu grafik aslında <iframe> içinde barındırılan bir sayfa. Form kodu:
<form action='https://chart.googleapis.com/chart' method='POST'> <input type="hidden" name="cht" value="lc" /> <input type="hidden" name="chtt" value="This is | my chart" /> <input type='hidden' name='chs' value='600x200' /> <input type="hidden" name="chxt" value="x,y" /> <input type='hidden' name='chd' value='t:40,20,50,20,100'/> <input type="submit" /> </form>
Geçerli bir POST isteğinin yanıtı, GET isteği yanıtıyla aynı olan bir PNG grafiğidir.
POST'u kullanmanın birkaç yolu vardır ve bunların tümü, sayfa kodunda veya sayfayı barındıran sunucuda ek kodlama gerektirir. POST işlevini kullanmak için genellikle her grafik için ayrı bir sayfa oluşturur ve bu sayfaları <iframe> kullanarak ya da aşağıda gösterildiği gibi bir <img> etiketi olarak ana sayfanıza eklersiniz veya bağlantılandırırsınız.
Aşağıda, POST yönteminin hem JavaScript hem de PHP ile kullanılmasına ilişkin örnekler verilmiştir.
POST İsteği için JavaScript Kullanma
JavaScript POST isteği yapmanın en kolay yolu, <input> öğelerinde grafik verileri içeren bir form barındıran bir sayfa oluşturmak ve sayfayı POST yönteminden isteği onLoad() işleyicisinde tutmaktır. Bu durumda sayfa, grafik PNG ile değiştirilir. Bu grafiği barındıran sayfa, bu sayfayı bir <iframe> kullanarak içermelidir.
Grafik sayfasının kodu aşağıda verilmiştir:
post_chart.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type='application/javascript'>
// Send the POST when the page is loaded,
// which will replace this whole page with the retrieved chart.
function loadGraph() {
var frm = document.getElementById('post_form');
if (frm) {
frm.submit();
}
}
</script>
</head>
<body onload="loadGraph()">
<form action='https://chart.googleapis.com/chart' method='POST' id='post_form'>
<input type='hidden' name='cht' value='lc'/>
<input type='hidden' name='chtt' value='This is | my chart'/>
<input type='hidden' name='chs' value='300x200'/>
<input type='hidden' name='chxt' value='x'/>
<input type='hidden' name='chd' value='t:40,20,50,20,100'/>
<input type='submit'/>
</form>
</body>
</html>
<form> öğesi kullanıyorsanız dizelerinizi URL olarak kodlamanız gerekmez (yine de grafik başlıklarında satır başı karakteri oluşturmak için | gibi özel karakterler kullanmanız gerekecektir).
Daha sonra bu grafik, ana makine sayfanızda bir <iframe> kullanılarak şu şekilde başka bir sayfaya yüklenebilir:
another_page.html
<iframe src="post_chart.html" width="300" height="200"></iframe>
POST İsteği için PHP kullanma
Sunucu tarafı dillerinin çoğu, açık POST isteklerini destekler. PHP kullanarak POST isteği göndermeyle ilgili bir örneği burada bulabilirsiniz. Bu örnekte, 150 rastgele değer içeren bir çizgi grafik oluşturan bir sayfa gösterilmektedir. Bunu kendiniz kullanmak isterseniz $chart dizisini kendi değerlerinizi içerecek şekilde özelleştirirsiniz.
chartserver-image.php
<?php
// Create some random text-encoded data for a line chart.
header('content-type: image/png');
$url = 'https://chart.googleapis.com/chart';
$chd = 't:';
for ($i = 0; $i < 150; ++$i) {
$data = rand(0, 100000);
$chd .= $data . ',';
}
$chd = substr($chd, 0, -1);
// Add data, chart type, chart size, and scale to params.
$chart = array(
'cht' => 'lc',
'chs' => '600x200',
'chds' => '0,100000',
'chd' => $chd);
// Send the request, and print out the returned bytes.
$context = stream_context_create(
array('http' => array(
'method' => 'POST',
'content' => http_build_query($chart))));
fpassthru(fopen($url, 'r', false, $context));
?>
Bu grafiği yerleştirmek JavaScript örneğinden daha kolaydır. Bunun nedeni, aşağıda gösterildiği gibi POST sayfanıza bir <img> etiketiyle yönlendirme yapmanızdır:
another_page.html
<img width='600' height='200' src='chartserver-image.php'>