Dégradé linéaire en asp

eclisse · 06/03/2011, 11h37

Bonjour,
J'ai besoin de créer un dégradé linéaire en fonction d'une couleur passé en paramètre, et tout ça en asp. J'ai bien trouvé des bouts de code en javascript masi rien au niveau asp.
Je détaille :
Je passe une couleur en paramètre dans une page enfant et le système me propose un choix de 20 couleurs dans un dégradé correspondant à ma couleur qui va de 000000 à FFFFFF, la couleur passée en paramètre se trouvant bien sur au milieu de mon dégradé.
Si quelqu'un a un bout de code en suggestion, c'est avec plaisir.
Merci

eclisse · 09/03/2011, 13h15

Bon, ben je vois que ça n'attire pas grand monde...

Comme ça ne m'empêche pas à continuer de bosser dessus, je vous colle le bout de code sur lequel j'ai travaillé.
L'algo me permet de créer un dégradé du noir vers la couleur passée en paramètre mais pas au dela.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<% colorHex=request("colorHex")
 
Red = Cint("&H"& mid(colorHex,1,2))
Green = Cint("&H"& mid(colorHex,3,2))
Blue = Cint("&H"& mid(colorHex,5,2))
ColorHexR = Red
ColorHexG = Green
ColorHexB = Blue
colorHex = Red &"|"& Green &"|"& Blue
 
color_end=split(colorHex,"|")
color_beg = Array (0,0,0)
color_end = Array (255,255,255)
valu = Array ("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f")
 
function genRanges()
	color_end=split(colorHex,"|")
	qty = 25
	beg_col_1 = color_beg(0)
	beg_col_2 = color_beg(1)
	beg_col_3 = color_beg(2)
 
	step1 = Cint((beg_col_1 - color_end(0)) / ((qty/2)-1))
	step2 = Cint((beg_col_2 - color_end(1)) / ((qty/2)-1))
	step3 = Cint((beg_col_3 - color_end(2)) / ((qty/2)-1))
 
 
	for i = 1 to (qty/2)
		bg_col = RGBtoColor(beg_col_1, beg_col_2, beg_col_3)
		fg_col = RGBtoColor((beg_col_1 OR 255), (beg_col_2 OR 255), (beg_col_3 OR 255))
 
		beg_col_1=beg_col_1-step1
		beg_col_2=beg_col_2-step2
		beg_col_3=beg_col_3-step3
 
		response.write "<tr><td style='width:10px;'>"&i&"</td>"
		response.write "<td onmouseout='mouseOutMap()' onclick='clickColor("""&bg_col&""",-1,-1)' onmouseover='mouseOverColor("""&bg_col&""")' style='width:200px;height:20px;color:#FFFFFF;background:"&bg_col&"'>&nbsp;</td>"
		response.write "<td style='width:10px;'></td><td style='font-family:courier new;font-size:110%;'>"&bg_col&"</td></tr>"
 
	next
 
	color_beg = Array (beg_col_1-step1,beg_col_2-step2,beg_col_3-step3)
	color_end = Array (255,255,255)
	beg_col_1 = color_beg(0)
	beg_col_2 = color_beg(1)
	beg_col_3 = color_beg(2)
 
	step1 = Cint((beg_col_1 - color_end(0)) / ((qty/2)-2))
	step2 = Cint((beg_col_2 - color_end(1)) / ((qty/2)-2))
	step3 = Cint((beg_col_3 - color_end(2)) / ((qty/2)-2))
 
 
	for i = i to (qty-2)
		bg_col = RGBtoColor(beg_col_1, beg_col_2, beg_col_3)
		fg_col = RGBtoColor((beg_col_1 OR 255), (beg_col_2 OR 255), (beg_col_3 OR 255))
 
		beg_col_1=beg_col_1-step1
		beg_col_2=beg_col_2-step2
		beg_col_3=beg_col_3-step3
 
		response.write "<tr><td style='width:10px;'>"&i&"</td>"
		response.write "<td onmouseout='mouseOutMap()' onclick='clickColor("""&bg_col&""",-1,-1)' onmouseover='mouseOverColor("""&bg_col&""")' style='width:200px;height:20px;color:#FFFFFF;background:"&bg_col&"'>&nbsp;</td>"
		response.write "<td style='width:10px;'></td><td style='font-family:courier new;font-size:110%;'>"&bg_col&"</td></tr>"
	next
 
End function
 
function Hex16(num)
	if num > 15 then num = 15
	if num < 0 then num = 0
	Hex16 = (valu(num))
end function
 
function Hex16ToInt(digit)
	Hex16ToInt=""
	for i = 0 to ubound(valu)
	      if digit=valu(i) then Hex16ToInt=i
	next
end function
 
function Hex255(num)
	if num > 255 then num = 255
	if num < 0 then num = 0
	Hex255 = Hex16(Cint(num / 16)) & Hex16(Cint(num mod 16))
end function
 
function Hex255ToInt(digit)
	if len(digit)=1 then
		Hex255ToInt=Hex16ToInt(digit)
	elseif len(digit)>1 then
		Hex255ToInt = Cint(Hex16ToInt(mid(digit,1,1)))*16 & Hex16ToInt(mid(digit,2,1))
	else 
		Hex255ToInt=NULL
	end if
end function
 
function ColorToRGB(color)
	rgb = Array (NULL, NULL, NULL)
	if len(color)=7 then
		rgb(0) = Hex255ToInt(mid(color,1,1)&mid(color,2,1))
		rgb(1) = Hex255ToInt(mid(color,3,1)&mid(color,4,1))
		rgb(2) = Hex255ToInt(mid(color,5,1)&mid(color,6,1))
	end if
	ColorToRGB=rgb
end function
 
function RGBtoColor(red, green, blue)
	if red > 255 then red = 255
	if green > 255 then green = 255
	if blue > 255 then blue = 255
	if red < 0 then red = 0
	if green < 0 then green = 0
	if blue < 0 then blue = 0
	RGBtoColor="#" & Hex255(red) & Hex255(green) & Hex255(blue)
end function%>
 
<table cellpadding='0' cellspacing='0' border='0' style='margin-right:5px;'>
<tr style='height:30px;'>
	<td></td>
	<td valign='top' align='left'>Darker/lighter shades:</td>
	<td colspan='2' valign='top' align='left'>Hex values:</td>
</tr>
<% genRanges %>
</table>

Ce code est issu d'un javascript retranscrit en asp. C'est pas complètement satisfaisant mais c'est toujours un départ.

Merci à ceux qui veulent bien y participer.

tayoze · 18/03/2011, 15h37

Replace ton code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
for i = i to (qty-2)
		bg_col = RGBtoColor(beg_col_1, beg_col_2, beg_col_3)
		fg_col = RGBtoColor((beg_col_1 OR 255), (beg_col_2 OR 255), (beg_col_3 OR 255))
 
		beg_col_1=beg_col_1-step1
		beg_col_2=beg_col_2-step2
		beg_col_3=beg_col_3-step3
 
		response.write "<tr><td style='width:10px;'>"&i&"</td>"
		response.write "<td onmouseout='mouseOutMap()' onclick='clickColor("""&bg_col&""",-1,-1)' onmouseover='mouseOverColor("""&bg_col&""")' style='width:200px;height:20px;color:#FFFFFF;background:"&bg_col&"'>&nbsp;</td>"
		response.write "<td style='width:10px;'></td><td style='font-family:courier new;font-size:110%;'>"&bg_col&"</td></tr>"
	next

Par

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
for i = i to (qty-2)
 
		if cdbl(replace(bg_col, "#", "&H")) < cdbl("&H"&request("colorHex")) then 
			response.Write(bg_col)
 
			bg_col = RGBtoColor(beg_col_1, beg_col_2, beg_col_3)
			fg_col = RGBtoColor((beg_col_1 OR 255), (beg_col_2 OR 255), (beg_col_3 OR 255))
 
			beg_col_1=beg_col_1-step1
			beg_col_2=beg_col_2-step2
			beg_col_3=beg_col_3-step3
 
			response.write "<tr><td style='width:10px;'>"&i&"</td>"
			response.write "<td onmouseout='mouseOutMap()' onclick='clickColor("""&bg_col&""",-1,-1)' onmouseover='mouseOverColor("""&bg_col&""")' style='width:200px;height:20px;color:#FFFFFF;background:"&bg_col&"'>&nbsp;</td>"
			response.write "<td style='width:10px;'></td><td style='font-family:courier new;font-size:110%;'>"&bg_col&"</td></tr>"
		end if
	next

eclisse · 21/03/2011, 16h08

Déjà merci d'avoir répondu.
Mais ne semble pas marcher, à prioiri à un soucis avec la comparaison en cdbl

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Type mismatch: 'cdbl'

Plus précisemment, c'est le

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

cdbl(replace(bg_col, "#", "&H"))

qui ne lui plait pas

tayoze · 22/03/2011, 15h10

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
response.Write cdbl("&Hffffff")

Resultat : 16777215

Bizard surtout que j'ai fais le test complet sur une mon server

index.asp?colorHex=4881be

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<% colorHex=request("colorHex")
 
Red = cdbl("&H"& mid(colorHex,1,2))
Green = cdbl("&H"& mid(colorHex,3,2))
Blue = cdbl("&H"& mid(colorHex,5,2))
ColorHexR = Red
ColorHexG = Green
ColorHexB = Blue
colorHex = Red &"|"& Green &"|"& Blue
 
color_end=split(colorHex,"|")
color_beg = Array (0,0,0)
color_end = Array (255,255,255)
valu = Array ("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f")
 
function genRanges()
	color_end=split(colorHex,"|")
	qty = 25
	beg_col_1 = color_beg(0)
	beg_col_2 = color_beg(1)
	beg_col_3 = color_beg(2)
 
	step1 = Cint((beg_col_1 - color_end(0)) / ((qty/2)-1))
	step2 = Cint((beg_col_2 - color_end(1)) / ((qty/2)-1))
	step3 = Cint((beg_col_3 - color_end(2)) / ((qty/2)-1))
 
 
	for i = 1 to (qty/2)
		bg_col = RGBtoColor(beg_col_1, beg_col_2, beg_col_3)
		fg_col = RGBtoColor((beg_col_1 OR 255), (beg_col_2 OR 255), (beg_col_3 OR 255))
 
		beg_col_1=beg_col_1-step1
		beg_col_2=beg_col_2-step2
		beg_col_3=beg_col_3-step3
 
		response.write "<tr><td style='width:10px;'>"&i&"</td>"
		response.write "<td onmouseout='mouseOutMap()' onclick='clickColor("""&bg_col&""",-1,-1)' onmouseover='mouseOverColor("""&bg_col&""")' style='width:200px;height:20px;color:#FFFFFF;background:"&bg_col&"'>&nbsp;</td>"
		response.write "<td style='width:10px;'></td><td style='font-family:courier new;font-size:110%;'>"&bg_col&"</td></tr>"
 
	next
 
	color_beg = Array (beg_col_1-step1,beg_col_2-step2,beg_col_3-step3)
	color_end = Array (255,255,255)
	beg_col_1 = color_beg(0)
	beg_col_2 = color_beg(1)
	beg_col_3 = color_beg(2)
 
	step1 = Cint((beg_col_1 - color_end(0)) / ((qty/2)-2))
	step2 = Cint((beg_col_2 - color_end(1)) / ((qty/2)-2))
	step3 = Cint((beg_col_3 - color_end(2)) / ((qty/2)-2))
 
 
	for i = i to (qty-2)
 
		if cdbl(replace(bg_col, "#", "&H")) < cdbl("&H"&request("colorHex")) then 
			response.Write(bg_col)
 
			bg_col = RGBtoColor(beg_col_1, beg_col_2, beg_col_3)
			fg_col = RGBtoColor((beg_col_1 OR 255), (beg_col_2 OR 255), (beg_col_3 OR 255))
 
			beg_col_1=beg_col_1-step1
			beg_col_2=beg_col_2-step2
			beg_col_3=beg_col_3-step3
 
			response.write "<tr><td style='width:10px;'>"&i&"</td>"
			response.write "<td onmouseout='mouseOutMap()' onclick='clickColor("""&bg_col&""",-1,-1)' onmouseover='mouseOverColor("""&bg_col&""")' style='width:200px;height:20px;color:#FFFFFF;background:"&bg_col&"'>&nbsp;</td>"
			response.write "<td style='width:10px;'></td><td style='font-family:courier new;font-size:110%;'>"&bg_col&"</td></tr>"
		end if
	next
 
 
End function
 
function Hex16(num)
	if num > 15 then num = 15
	if num < 0 then num = 0
	Hex16 = (valu(num))
end function
 
function Hex16ToInt(digit)
	Hex16ToInt=""
	for i = 0 to ubound(valu)
	      if digit=valu(i) then Hex16ToInt=i
	next
end function
 
function Hex255(num)
	if num > 255 then num = 255
	if num < 0 then num = 0
	Hex255 = Hex16(Cint(num / 16)) & Hex16(Cint(num mod 16))
end function
 
function Hex255ToInt(digit)
	if len(digit)=1 then
		Hex255ToInt=Hex16ToInt(digit)
	elseif len(digit)>1 then
		Hex255ToInt = Cint(Hex16ToInt(mid(digit,1,1)))*16 & Hex16ToInt(mid(digit,2,1))
	else 
		Hex255ToInt=NULL
	end if
end function
 
function ColorToRGB(color)
	rgb = Array (NULL, NULL, NULL)
	if len(color)=7 then
		rgb(0) = Hex255ToInt(mid(color,1,1)&mid(color,2,1))
		rgb(1) = Hex255ToInt(mid(color,3,1)&mid(color,4,1))
		rgb(2) = Hex255ToInt(mid(color,5,1)&mid(color,6,1))
	end if
	ColorToRGB=rgb
end function
 
function RGBtoColor(red, green, blue)
	if red > 255 then red = 255
	if green > 255 then green = 255
	if blue > 255 then blue = 255
	if red < 0 then red = 0
	if green < 0 then green = 0
	if blue < 0 then blue = 0
	RGBtoColor="#" & Hex255(red) & Hex255(green) & Hex255(blue)
end function%>
 
<table cellpadding='0' cellspacing='0' border='0' style='margin-right:5px;'>
<tr style='height:30px;'>
	<td></td>
	<td valign='top' align='left'>Darker/lighter shades:</td>
	<td colspan='2' valign='top' align='left'>Hex values:</td>
</tr>
<% genRanges %>
</table>

eclisse · 23/03/2011, 02h10

Alors oui, effectivement ton code marche... je n'ai pas encore compris pourquoi je n'ai pas réussi à le faire marcher la première fois, il va falloir que je l'analyse pour trouver ma faille...
Ceci étant, ta modification ne répond pas complètement à ma question. Il faudrait que le dégradé aille du noir au blanc en 21 étapes, 10 avant, 10 après, la couleur sélectionnée en position 11.
Ton code, comme le mien précédemment, part bien du noir mais ne va pas jusqu'au blanc.
Une idée ?

eclisse · 30/05/2011, 14h40

Je fais remonter le sujet parce que
- 1 : il n'est pas clos
- 2 : je me suis aperçu d'une erreur dans ce que je voulais faire

J'ai confondu dégradé de couleur et dégradé de lumière.
Si grossièrement, j'ai bien réussi avec mon code et les modifs fournies par tayoze à gaire fonctionner le dégradé, je n'ai pas réussi à obtenir ce que je voulais. Et pour cause donc, puisque ce que je cherche à obtenir n'est pas un dégradé de couleur (qui va du noir au blanc suivant une couleur choisie) mais bien un dégradé de lumière !!
Du coup, j'ai fouillé un peu pour corriger tout ça et découvrir les 2 univers RGB et HSL. mais pas de code en asp ou vb. du coup je suis un peu coincé.
Si quelqu'un a une idée ? Merci

06/03/2011, 11h37	#1
eclisse Membre confirmé Olivier Webmaster Pays Basque Inscription : avril 2004 Messages : 151 Détails du profil Informations personnelles : Nom : Olivier Âge : 40 Localisation : France Informations professionnelles : Activité : Webmaster Pays Basque Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : avril 2004 Messages : 151 Points : 200 Points : 200	Dégradé linéaire en asp Bonjour, J'ai besoin de créer un dégradé linéaire en fonction d'une couleur passé en paramètre, et tout ça en asp. J'ai bien trouvé des bouts de code en javascript masi rien au niveau asp. Je détaille : Je passe une couleur en paramètre dans une page enfant et le système me propose un choix de 20 couleurs dans un dégradé correspondant à ma couleur qui va de 000000 à FFFFFF, la couleur passée en paramètre se trouvant bien sur au milieu de mon dégradé. Si quelqu'un a un bout de code en suggestion, c'est avec plaisir. Merci
	00

21/03/2011, 16h08	#4
eclisse Membre confirmé Olivier Webmaster Pays Basque Inscription : avril 2004 Messages : 151 Détails du profil Informations personnelles : Nom : Olivier Âge : 40 Localisation : France Informations professionnelles : Activité : Webmaster Pays Basque Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : avril 2004 Messages : 151 Points : 200 Points : 200	Déjà merci d'avoir répondu. Mais ne semble pas marcher, à prioiri à un soucis avec la comparaison en cdbl Code : Sélectionner tout - Visualiser dans une fenêtre à part Type mismatch: 'cdbl' Plus précisemment, c'est le Code : Sélectionner tout - Visualiser dans une fenêtre à part cdbl(replace(bg_col, "#", "&H")) qui ne lui plait pas
	00

23/03/2011, 02h10	#6
eclisse Membre confirmé Olivier Webmaster Pays Basque Inscription : avril 2004 Messages : 151 Détails du profil Informations personnelles : Nom : Olivier Âge : 40 Localisation : France Informations professionnelles : Activité : Webmaster Pays Basque Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : avril 2004 Messages : 151 Points : 200 Points : 200	Alors oui, effectivement ton code marche... je n'ai pas encore compris pourquoi je n'ai pas réussi à le faire marcher la première fois, il va falloir que je l'analyse pour trouver ma faille... Ceci étant, ta modification ne répond pas complètement à ma question. Il faudrait que le dégradé aille du noir au blanc en 21 étapes, 10 avant, 10 après, la couleur sélectionnée en position 11. Ton code, comme le mien précédemment, part bien du noir mais ne va pas jusqu'au blanc. Une idée ?
	00

30/05/2011, 14h40	#7
eclisse Membre confirmé Olivier Webmaster Pays Basque Inscription : avril 2004 Messages : 151 Détails du profil Informations personnelles : Nom : Olivier Âge : 40 Localisation : France Informations professionnelles : Activité : Webmaster Pays Basque Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : avril 2004 Messages : 151 Points : 200 Points : 200	Je fais remonter le sujet parce que - 1 : il n'est pas clos - 2 : je me suis aperçu d'une erreur dans ce que je voulais faire J'ai confondu dégradé de couleur et dégradé de lumière. Si grossièrement, j'ai bien réussi avec mon code et les modifs fournies par tayoze à gaire fonctionner le dégradé, je n'ai pas réussi à obtenir ce que je voulais. Et pour cause donc, puisque ce que je cherche à obtenir n'est pas un dégradé de couleur (qui va du noir au blanc suivant une couleur choisie) mais bien un dégradé de lumière !! Du coup, j'ai fouillé un peu pour corriger tout ça et découvrir les 2 univers RGB et HSL. mais pas de code en asp ou vb. du coup je suis un peu coincé. Si quelqu'un a une idée ? Merci
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email