Tag Archives: API

jQuery (ve diğerlerini) Google üzerinde barındırmak için 3 neden

Posted on by
4

Genelde jQuery (ve diğerleri de) framework’ünü kullanmak için aşağıdakine benzer bir kod bulunur.

<script type="text/javascript" src="/js/jQuery.min.js"></script>

Eğer yerel bir sunucuda çalışıyorsanız her şey iyi ve güzel. Ama bunun yanında halka açık bir web sunucusunda Google’ın ajax api’sini kullanmanın bazı avantajları var.

Düşük Gecikme (Latency) Süresi
Javascript Framework’ünüzü Google üzerinden kullanmanın en büyük avantajlarından biri Google’ın yüksek hızlı CDN’i sayesinde scriptlere global ve hızlı ulaşım. Bu durumda kullanıcılar dosyaları Google üzerinden sizin sunucunuzdan indirebileceklerinden daha hızlı indirebilirler.

Paralellik
Bazı Internet tarayıcıları sunucuları gereksiz yere meşgul etmemek için bir sunucya yapılan paralel istekleri sınırlarlar. Dolayısı ile framework’ü başka bir yerde barındırmak sunucunuz açıından en azından bir eksik istek demektir.

Daha iyi önbellek
Herhalde Ajax dosyları için Google’ın içerik teslim servisini kullanmanın en büyük avantajından biri de belki kullanıcının dosyaları indirmesine gerek kalmaması.
Bir ziyaretçi sizin sitenize ait olan jQuery dosyasını en azından bir kere (sunucu caching ayarlarına göre belki de daha fazla) yüklemek zorunda. Kullanıcının diskinde birbirinin aynısı bir çok jQuery kaynak dosyası olabilir. Buna rağmen her yeni site için bunları tekrar indirmek zorunda.

Öte yandan Google üzerinde barındırılan dosyalar için kaç site olursa olsun bunu sadece bir kere indirmiş olacak.
Bunun iki yolu var. Birisi Google Api’si kullanarak…

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">// <![CDATA[
// bu arada 1.3 yazarsanız, 1.3'ün en son sürümünü
// yüklemiş olursunuz
google.load("jquery", "1.3.2");
google.setOnLoadCallback(function() {
//kod...
});
// ]]--> </script>

Diğer yöntem ise doğrudan dosyanın URL sini girerek.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
</script><!--[CDATA[
$(document).ready(function() {
// kod...
});
// ]]>

Bu yazı anında Google aşağıdaki Javascript kütüphanelerini destekliyor…

  • jQuery
  • jQuery UI
  • Prototype
  • script_aculo_us
  • MooTools
  • Dojo
  • SWFObject
  • Yahoo! User Interface Library (YUI)
  • Ext Core

Daha detaylı bilgiye http://code.google.com/apis/ajaxlibs adresinden ulaşabilirsiniz.

Google Charts ile anında dinamik grafikler oluşturun

Posted on by
3

Google verdiği hizmetlere bir yenisini daha ekledi. Bilindiği üzere web sitelerine grafikler koymak zaman zaman problem olabiliyor. Google’un buna bir çözümü var: Google Charts.

Google ilk olarak kendi içinde kullandığı bu API‘yi herkese açmaya karar vermiş. Üstelik API gibi terimler aklınızı karıştırmasın. Kullanımı oldukça basit bir şekilde grafikler yaratmanız mümkün.

Sistem kısaca şöyle çalışıyor. Siz bir URL giriyorsunuz. Bu URL’ye eklenen parametreler de grafiğin detaylarını içeriyor. Google da bu URL isteğine cevap olarak size bir .PNG dosyayı döndürüyor. İsterseniz bu resmi kaydedebilir, isterseniz dinamik olarak HTML kodunuzun içine ekleyebilirsiniz.

Bir sürü şekilde de grafiğinizi çıkartıyor. Buradaki örnekte sadece basit çizgi grafik olmasına rağmen Google Charts, pasta grafikten Venn diagramına kadar başka seçenekler de sunuyor.
Kısa bir örnek:

SuAygırı.com’un üç günlük ziyaretçi verileri:

Bu grafiği aşağıdaki HTML isteği ile elde ediyoruz.

http://chart.apis.google.com/chart?

chs=200×125 – Grafik boyutu (Piksel)
&chd=s:9a1 – Veriler (basit veri girişinde 9: 61′e küçük a harfi ise 26′ya denk geliyor.)
&cht=lc – (Grafik tipi lc=Line Chart)
&chxt=x,y (hem x hem de y başlıkları gözüksün demek)
&chxl=0:|5-12|6-12|7-12|1:||60+ (x vey başlıkları)

Bu kadar basit. Eğer bunu sayfanıza direkt olarak koymak isterseniz. Bu satırı <img src=”grafik_kodu” /> etiketinin içine ekleyebilirsiniz.

Daha ayrıntılı bilgi için Google Charts sayfasına bakabilirsiniz.