ASPcenter.net

24 febbraio 2010

Un grafico a barre con ASP e CSS

Archiviato in: Grafica e Immagini — Tag:, , — lukeonweb @ 23:32

In molte applicazioni che forniscono statistiche sulla scorta di una serie di dati, come un sondaggio, è opportuno fornire un grafico che mostri, in maniera immediatamente comprensibile, l’andamento della statistica.

Il codice che segue implementa 5 variabili (che in questo caso sono costanti) nelle quali vanno specificati i valori numerici che verranno utilizzati come valori percentuali: questi dati in realtà saranno il risultato di una somma, il return di un capo sul database, saranno gli item di un array, il contenuto di un file di testo o di un XML… non importa.


Al fine di rendere il grafico, il ragionamento, con la scorta di qualche codice CSS, è il seguente:

<%@LANGUAGE = VBScript%>
<%
    Dim a, b, c, d, e
    a = 10
    b = 20
    c = 45
    d = 15
    e = 10
%>
<html>
<body>

<div style="background: #FF0000; width: <%=a%>%;"> </div>
<div style="background: #0000FF; width: <%=b%>%;"> </div>
<div style="background: #000000; width: <%=c%>%;"> </div>
<div style="background: #00FF00; width: <%=d%>%;"> </div>
<div style="background: #FFFF00; width: <%=e%>%;"> </div>

</body>
</html>

Utilizzo le variabili nel width dello stile del layer specificando che si tratta di una percentuale (%) e uso un colore di sfondi differente per ogni layer. Lascio a voi il compito di stilizzare alla meglio il grafico.

Nessun commento »

Non c'è ancora nessun commento.

RSS feed dei commenti a questo articolo. TrackBack URL

Lascia un commento

ASPcenter.net è il blog italiano su ASP, ASP.Net, VB.Net, C# e Visual Studio - Funziona con WordPress