Carli – ilraC

jQuery google charts 0.1a

Obstaja kar nekaj jquery vtičnikov za generiranje grafov, ker pa google ponuja kar konkreten api za generiranje grafov, kar preko get protokola, sem sestavil en jquery plugin za izris, pa naj bo to prva izdaja 0.1 alfa, ker api omogoča veliko več kot je sedaj dodelano v pluginu.

Primer grafa je viden tukaj. Kaj omogoča? Prikaz grafov – črta, stolpci – poševno in pokončno, torta in 3d torta.

Kako do izpisa?

Na spletni strani dodate div, span ali kak drug element, mu pripišete id ali class in v spletno stran vključite, jquery knjižnico, dodate jquery.googleCharts.js plugin in kličete izpis.

Klic izpisa za graf, ki se prikaže v div elementu z id=”graf”, zgleda nekako tako:

$('#graf').gchart({'chart':'pie3d', 'values':'25,50,75,100', "size": "500x200", "labels":"25|50|75|100", "axis":"y", "axisval":"0,0,100,10", "space":"a"});

Vrednosti:

chart : vrsta grafa -> barv (stolpci vertikalni), barh (stolpci horizontalni), line (črta), pie (torta), pie3d (torta 3d)
values : vrednosti -> v primeru testa 25, 50, 75, 100
size :  velikost grafa -> velikost grafa je omejena z uporabo APIja in ne sme presegati 3000px, površine grafa. Paziti je potrebno na razmerje širine in višine pri tortah (pie – ne prevajam pita, ampak po MS cake  chartu :D), kjer je potreben nekoliko širši prikaz zaradi label.
labels : Labele oz. oznake, ločujemo s pokončno črto (ALT GR+W)
axisval : vrednosti na eni od os -> kombinacija z axis: x,y,t. Potrebno nekaj dodelave:  0, 0, 120, 10 prikazuje start vrednosti od nič do 120 s koraki po 10.
space : prostor med stolpci, a je avto.

Povezava do plugina: jquery.googleCharts0.1a.js

Tagi: charts, Google, jQuery, js, plugin

Še ni komentarjev.

Komentiraj ...