| Home  | Casa  | Hardware  | Networking  | Programmazione  | Software  | Domanda  | Sistemi  |   
Programmazione  
  • C /C + + Programming

  • Computer Programming Languages

  • Delphi Programming

  • Java Programming

  • Programmazione Javascript

  • PHP /MySQL Programmazione

  • Perl Programming

  • Python Programming

  • rubino Programmazione

  • Nozioni di base di Visual Programming
  •  
    Conoscenza Informatica >> Programmazione >> Programmazione Javascript >> Content
    Come grafico con jQuery
    È possibile utilizzare uno dei numerosi jQuery plug-in per generare velocemente diagrammi e grafici con JavaScript e jQuery . Valutare le diverse librerie e scegliere la migliore corrispondenza per le vostre esigenze . Scrivi il tag HTML " " per includere le librerie , e la variabile " " per includere i dati e il codice per generare il grafico . Testare il programma HTML per assicurarsi che funzioni correttamente . Istruzioni
    1

    Scaricare il plug-in dal sito host. Decomprimere il plug-in in una directory che può essere letta dal programma JavaScript che lo userà.
    2

    Creare un nuovo 5 file HTML utilizzando un editor HTML o Notepad . Aggiungere il tag " " , specificare un titolo della finestra usando il tag " " e aggiungere il jQuery e creazione di grafici librerie plug-in utilizzando il tag " <script> " : <br> <p> <html> <head> <title> Grafici jQuery < /title> < script di src = " lib /Flot /jquery.flot.min.js " > < /script> < /head> <br> 3 <p> Aggiungi un " <body> " , tag e un tag vuoto " <div> " con un "id" in cui si desidera il grafico da visualizzare. Selezionare il tag " <div> " utilizzando jQuery con "$ ( ' # id') . " Inserire il codice JavaScript per visualizzare un grafico o un grafico : <br> <p> <body> <div id = stile " mychart " = " width: 600px ; height: 300px " . > < /div > <script> $ (document) ready ( function () { var datapoints = [ [ 1,27964 ] , [ 2,33435 ] , [ 3,43165 ] , [ 4,50359 ] , [ 5,54861 ​​] , [ 6,82197 ] , [ 7,99516 ] , [ 8,166065 ] , [ 9,129773 ] ] ; $ . plot ( $ ( " # mychart " ) , [ { dati : datapoints , barre : { mostrare : true} } ] ) } ) ; < /script> < /body> < /html > <br> <br> 4 <p> Salvare il file HTML . Aprire in un browser Web per verificare che il grafico visualizza correttamente . <br> <br> <div class=ad2><script language='javascript' src='/ad/201310/4.js'></script></div> </div> </td> </tr> </table> <table width="95%" height="1" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#DEE7EE"> <tr> <td></td> </tr> </table> <table width="100%" height="7" border="0" cellpadding="0" cellspacing="0"> <tr> <td></td> </tr> </table> <table width="91%" height="52" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="51%"><p>Previous : <a class='LinkPrevArticle' href='/Programmazione/javascript-programming/90795.html' >Funzioni JavaScript per accettare parametri denominati </a></li></p></td> </tr> <tr> <td width="49%"> next : <a class='LinkNextArticle' href='/Programmazione/javascript-programming/90797.html' >Come navigare da jQuery finestra modale a un'altra pagina </a></li></td> </tr> </table></td> </tr> </table> <table width="100%" height="7" border="0" cellpadding="0" cellspacing="0"> <tr> <td></td> </tr> </table> <table width="770" height="246" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="375" height="246" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian"> <tr> <td height="244" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="img_dm/danmai_r4_c04 -.jpg" bgcolor="#DBE3EE"> <tr> <td width="4%" height="29"> </td> <td width="96%" class="lan_lm"> Articoli Correlati </td> </tr> </table> <table width="95%" height="209" border="0" align="center" cellpadding="0" cellspacing="4"> <tr> <td height="201"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91186.html" title="Come attivare la Enter Tutorial chiave in JavaScript " target="_self">Come attivare la Enter Tutorial chiave in JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90956.html" title="Come riportare le funzioni di addizione per più numeri in JavaScript " target="_self">Come riportare le funzioni di addizione per più numeri…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90852.html" title="Come Fade Out Quando Rilasciare una pagina in JQuery " target="_self">Come Fade Out Quando Rilasciare una pagina in JQuery </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91106.html" title="API per lo sviluppo di Google Maps " target="_self">API per lo sviluppo di Google Maps </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90898.html" title="Come utilizzare JavaScript Developer " target="_self">Come utilizzare JavaScript Developer </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90827.html" title="Come tracciare lentamente in Javascript " target="_self">Come tracciare lentamente in Javascript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91034.html" title="Come fare un file JS " target="_self">Come fare un file JS </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91213.html" title="Come controllare per vuoto VAR in Javascript " target="_self">Come controllare per vuoto VAR in Javascript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91022.html" title="Come confrontare Data Objects in JavaScript " target="_self">Come confrontare Data Objects in JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91150.html" title="Come implementare un distruttore di base in Javascript " target="_self">Come implementare un distruttore di base in Javascript </a></td></tr><tr></tr></table></td> </tr> </table></td> </tr> </table></td> <td width="20" valign="top"></td> <td width="375" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian"> <tr> <td height="244" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="img_dm/danmai_r4_c04 -.jpg" bgcolor="#DBE3EE"> <tr> <td width="4%" height="29"> </td> <td width="96%" class="lan_lm">Articoli in evidenza </td> </tr> </table> <table width="95%" height="207" border="0" align="center" cellpadding="0" cellspacing="4"> <tr> <td height="199"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/python-programming/93537.html" title="Come estrarre le parole da una stringa in Python " target="_self">Come estrarre le parole da una stringa in Python </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/computer-programming-languages/87024.html" title="Che cosa è una applicazione GUI " target="_self">Che cosa è una applicazione GUI </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/php-mysql-programming/91938.html" title="Come rimuovere una variabile su un PHP su invio " target="_self">Come rimuovere una variabile su un PHP su invio </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/visual-basics-programming/95449.html" title="Come scrivere un programma in Visual Basic che verrà Voci di uscita " target="_self">Come scrivere un programma in Visual Basic che verrà V…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/java-programming/90280.html" title="HashMap : Come rimuovere la causa di una perdita di memoria " target="_self">HashMap : Come rimuovere la causa di una perdita di mem…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/java-programming/89788.html" title="I modi di nominare il bundle di risorse in Java " target="_self">I modi di nominare il bundle di risorse in Java </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/visual-basics-programming/96523.html" title="Come scrivere virgolette su file in VB Script " target="_self">Come scrivere virgolette su file in VB Script </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/cc-programming/85213.html" title="Qual è la differenza tra un controllo di input analogico e un ingresso digitale di controllo XNA " target="_self">Qual è la differenza tra un controllo di input analogi…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/cc-programming/85782.html" title="Come fare un pulsante invisibile in Visual C " target="_self">Come fare un pulsante invisibile in Visual C </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/computer-programming-languages/87071.html" title="Come impostare la larghezza di una colonna GridView " target="_self">Come impostare la larghezza di una colonna GridView </a></td></tr><tr></tr></table></td> </tr> </table></td> </tr> </table></td> </tr> </table></td> </tr> </table> <table width="980" height="8" border="0" cellpadding="0" cellspacing="0"> <tr> <td></td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=980 bgColor=#36506e height=90> <tr> <td class=bs height=90 align=middle>Copyright © Conoscenza Informatica http://it.wingwit.com <script language='javascript' src='/ad/201310/1.js'></script></td> </tr> </table> </div> </body> </html>