Il codice che segue implementa 5 variabili (in questo caso sono costanti) nelle quali vanno specificati i valori numerici che verranno utilizzati come 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; ai fini di rendere il grafico il ragionamento, con la scorta di qualche codice Css è il seguente:
<%@LANGUAGE = JScript%>
<%
var a = 10;
var b = 20;
var c = 45;
var d = 15;
var e = 10;
%>
<html>
<head>
<title>Grafico a barre con Asp e Css</title>
</head>
<body>
<div style="background-color: #FF0000; width: <%=a%>%;"> </div>
<div style="background-color: #0000FF; width: <%=b%>%;"> </div>
<div style="background-color: #000000; width: <%=c%>%;"> </div>
<div style="background-color: #00FF00; width: <%=d%>%;"> </div>
<div style="background-color: #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.