Vml/asp : génération d'une courbe de droites

Commenter

Contenu du snippet

En VML le système trigo fonctionne avec un axe des Y à l'envers, le 0,0 est en haut à gauche. Aussi voici un petit code que j'utilise pour exprimer une progession de Chiffre d'Affaires en inversant l'axe Y.

Source / Exemple : 


<%@ Language=VBScript %>
<%
option explicit	

dim gris_fonce:	gris_fonce="#cccccc"
dim col:		col=50					' largeur d'une colonne
dim ratio:		ratio=100				' ration de division pour l'affichage
dim largeur:	largeur=650				' largeur tab

dim solde_rapproche:	solde_rapproche=0		' affectation d'une valeur de base au démarrage (CA rapporté par exemple)
dim ca_max:				ca_max=solde_rapproche
dim ca:					ca=ca_max				' CA
dim i_max:				i_max=ca_max

dim points,points_solde,i

dim tab_compta:	redim tab_compta(12)
for i=1 to 12	' remplissage de la table en Euros
	RANDOMIZE
	tab_compta(i)=Int((4999 * Rnd) + 1)
next

' définition des mois
dim tab_mois:	redim tab_mois(12)
tab_mois(1)	= "Janv."
tab_mois(2)	= "Fév."
tab_mois(3)	= "Mars"
tab_mois(4)	= "Avr."
tab_mois(5)	= "Mai"
tab_mois(6)	= "Juin"
tab_mois(7)	= "Juil."
tab_mois(8)	= "Août"
tab_mois(9)	= "Sept."
tab_mois(10)= "Oct."
tab_mois(11)= "Nov."
tab_mois(12)= "Déc."
%>

<HTML xmlns:v="urn:schemas-microsoft-com:vml">
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<META NAME="Author"			Content="RD medias">
<style>
  v\:* {behavior:url(#default#VML);}
  TD { font-family: Verdana; font-size: 10px; }
</style>
</HEAD>
<BODY>

<%
' detection solde max
for i=1 to 12
	ca = ca + tab_compta(i)
	if Cdbl(ca) > Cdbl(i_max) then	i_max = ca
next
'i_max	= FormatNumber(i_max,0)
ca		= ca_max

points	= col/2 &","& FormatNumber((i_max-solde_rapproche)/ratio,0)
for i=1 to 12
	ca = ca + tab_compta(i)
	points = points &","& (col*i)+col/2 &","& FormatNumber((i_max-ca)/ratio,0)
next
%>
<br>

<table border=0 align=center cellpadding=0 cellspacing=0>
<tr align=center>
	<td width=50><%=FormatNumber(solde_rapproche/1000,0)%> K€</td>
<%	ca = ca_max
	for i=1 to 12
		if tab_compta(i)>0 then 
			ca = ca + tab_compta(i)	%>
			<td width=50><%=FormatNumber(ca/1000,0)%> K€</td>	
	<%	else	%>
			<td width=50>&nbsp;</td>
	<%	end if
	next				%>
</tr>
<tr>
	<td colspan=13>
	<!-- axes -->
	<div id=global name=global style="position:relative; visibility:show; left:0px; top:0px; z-index:0; height:<%=FormatNumber((i_max+solde_rapproche)/ratio,0)%>px;">
		<div id=y name=y style="position:absolute; visibility:show; left:0px; top:0px; z-index:6; width:<%=largeur%>; height:<%=FormatNumber((i_max+solde_rapproche)/ratio,0)%>px;">
	<%	for i=0 to formatNumber(i_max,0) step ratio*10%>	
		<v:line
		from="0,<%=i/ratio%>" to="<%=largeur%>,<%=i/ratio%>"
		strokecolor="<%=gris_fonce%>" style="position:absolute;">
		</v:line>
	<%	next 			%>
		</div>		
		<div id=x name=x style="position:absolute; visibility:show; left:0px; top:0px; z-index:5; height:<%=FormatNumber((i_max+solde_rapproche)/ratio,0)%>px;">
	<%	for i=0 to 12	%>	
		<v:line
		from="<%=(col*i)+col/2%>,0" to="<%=col*i+col/2%>,<%=FormatNumber(i_max/ratio,0)%>"
		strokecolor="<%=gris_fonce%>" style="position:absolute;">
		</v:line>
	<%	next			%>
		</div>
		<div id=courbes name=courbes style="position:absolute; visibility:show; left:0px; top:0px; z-index:1; height:<%=FormatNumber((i_max+solde_rapproche)/ratio,0)%>px;">
		<v:polyline
		points="<%=points%>"
		strokecolor="red" style="position:absolute;">
		</v:polyline>
		</div>		
	</div>
	</td>
</tr>
<tr>
	<td width=50 align=center>n0</td>
<% for i=1 to 12	%>
	<td width=50 align=center><%=tab_mois(i)%></td>
<% next				%>
</tr>
</table>

</BODY>
</HTML>

Conclusion :


> Ce code est prévu pour des valeurs POSITIVES, à vous de corriger pour exploiter des valeurs négatives.
> Ne pas oublier la déclaration du VML dans la balise HTML et STYLE !

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (cs_zeb13)