Hvordan graf med jQuery
Du kan bruke en av flere jQuery plug-ins for å raskt generere diagrammer og grafer ved hjelp av Javascript og jQuery. Vurdere de ulike bibliotekene og velge den beste match for dine behov. Skriv HTML "<head>" tag å inkludere bibliotekene, og "<body>" tag å inkludere data og kode for å generere graf. Test HTML program for å kontrollere at den fungerer riktig.
Bruksanvisning
1 Last ned plug-in fra sin vert området. Dekomprimere plug-in i en katalog som kan nås av Javascript-program som skal bruke den.
2 Opprett en ny HTML 5-fil ved hjelp av en HTML-editor eller Notisblokk. Legg til "<head>" tag, angi en vindustittel ved hjelp av "<title>" tag og legge til jQuery og kartlegging plug-in bibliotekene ved hjelp av "<script>" tag:
<Html>
<Head>
<Title> jQuery Grafer </ title>
<Script src = "& lt; / script" rel = "nofollow"> https://ajax.googleapis.com/ajax/l;ibs/jquery/1.6.4/jquery.min.js"> & lt; / script>
<Script src = "lib / flot / jquery.flot.min.js"> </ script>
</ Head>
3 Legg en "<body>" tag og en tom "<div>" tag med en "id" der du vil at grafen skal vise. Velg "<div>" tag bruke jQuery med "$ ( '# id')." Sett Javascript-kode for å vise et diagram eller en graf:
<Body>
<Div id = "mychart" style = "width: 600px; height: 300px"> </ div>
<Script>
$ (Document) .ready (function () {
Var datapunkter = [[1,27964], [2,33435], [3,43165], [4,50359], [5,54861], [6,82197], [7,99516], [8,166065 ], [9,129773]];
$ .plot ($ ( "# Mychart»), [{data: datapunkter, barer: {show: true}}])});
</ Script>
</ Body>
</ Html>
4 Lagre HTML-fil. Åpne den i en nettleser for å kontrollere at grafen viser riktig.