Protovis | |
---|---|
Tyyppi | JavaScript - kirjasto |
Kehittäjä | Mike Bostock, Jeff Heer |
Sisään kirjoitettu | JavaScript |
Käyttöjärjestelmä | Monialustainen ohjelmisto |
uusin versio | 3.2 (28. toukokuuta 2010) |
Lisenssi | BSD |
Verkkosivusto | protovis.org |
Protovis on JavaScript -kirjasto digitaalisen tiedon visualisointiin kaavioiden ja kaavioiden muodossa. Kaavion ulkoasu on käsikirjoitettu syntaksilla, joka muistuttaa prototyyppiä ja jQueryä . Projektin kirjoittajat Mike Bostock ja Jeff Heer ovat Stanfordin visualisointiryhmän jäseniä. Protovis käyttää ytimessä Canvas-elementtiä hahmontamiseen, jolloin voit upottaa läpinäkyvästi verkkosivun visuaaliset elementit.
Protovis on yksi JavaScript-tiedosto, joka sisältää kaikki sen ilmoitukset ja toiminnot. Se voidaan sisällyttää verkkosivulle seuraavalla koodilla:
< script type = "text/javascript" src = "protovis-r3.1.js" ></ script >Jos haluat näyttää kaavion sivun rungossa, sinun on lisättävä koodi seuraavasti
< script type = "text/javascript+protovis" > // Protovis-koodi menee tänne... </ script >Tässä on esimerkki koodista, jota tarvitaan yksinkertaisen pylväskaavion piirtämiseen:
// Luo juuripaneeli ja aseta visualisoinnin kooksi 150x150 var vis = new pv . paneeli () . leveys ( 150 ) . korkeus ( 150 ); // Lisää vaakasuuntaiset säännöt (ruudukkoviivat), lisäämme ne ensin, jotta ne menevät taakse. vis . lisätä ( pv . sääntö ) . data ( pv . range ( 0 , 2 , .5 )) . alaosa ( funktio ( d ) d * 80 + 1 ) . lisää ( pv . Label ); // Lisää palkit, joiden korkeus vastaa data-ominaisuuden arvoja vis . lisää ( pv . Bar ) . data ([ 1 , 1.2 , 1.7 , 1.5 , .7 ]) . leveys ( 20 ) . korkeus ( funktio ( d ) 80 * d ) . pohja ( 0 ) . vasen ( funktio () this . index * 25 + 25 ) // tämä.indeksi on peruspisteen sijainti taulukossa . ankkuri ( "pohja" ). lisää ( pv . Label ); // Lisää tarra jokaisen palkin alaosaan // Renderöi kaikki. vis . tehdä ();Protovis käyttää laajasti menetelmäketjutusta, jonka avulla voit kirjoittaa esimerkin vain 4 lauseessa.