Bonjour à tous,

J'ai réalisé actuellement une carte dynamique sur un site internet avec choix de 4 cases à cocher.
Par exemple la premiere case à cocher c'est la couche departements, la seconde la couche communes et les deux dernieres des dispositifs.
Jusque la tout va bien quand on clique sur une case à cocher cela fait apparaître la couche demandé.
Mon probleme est que j'aimerais rentre la carte cliquable, par exemple on clique sur la case departement donc la carte affiche les départements et ensuite on clique sur un département, et là on obtiendrait l'ouverture d'un pdf.
J'aimerais savoir si quelqu'un pouvait m'aider, merci?

Code html : 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
<!DOCTYPE html> <!--norme--> 
 
<html>
<head>
 
	<link rel="stylesheet" type="text/css" href="test.css">
 
	<META charset="utf-8"> <!--impose au navigateur l'encodage du tf8-->
    <title>Midi Pyrenees</title>
</head>
 
 
<SCRIPT>
	function cocher(num,nom_calque)
		{
			if(document.form_carte.elements[num].checked)
				{
					document.getElementById(nom_calque).style.visibility='visible';
				}
				else
				{
					document.getElementById(nom_calque).style.visibility='hidden';
				}
 
		}
 
</SCRIPT>
<SCRIPT>
 
 
function mapOnClick(str)
{
 
	document.getElementById('fenetre_alert').style.visibility='visible';
	document.getElementById('fenetre_alert').innerHTML=str;
 
}
 
</SCRIPT>
 
<STYLE>
 
 
</STYLE>
 
 
<body>
 
<div id="fenetre_alert"></div>
		<!--Commentaire-->
 
		<DIV id=bandeau>
			<h1></h1>
		</DIV>
 
		<DIV id=menu>
			<FORM name=form_carte>
 
					<input type=checkbox name=case_dept onclick="cocher(0,'Coms');"> Couche Communes<br>
 
					<input type=checkbox name=case_dept onclick="cocher(1,'depts');"> Couche Departements<br>
 
					<input type=checkbox name=case_offi onclick="cocher(2,'Of');"> Couche Dispositif OF<br>
 
					<input type=checkbox name=case_cc onclick="cocher(3,'Comp_c);"> Couche Dispositif Competences<br>
 
 
			</FORM>
		</DIV>
 
<div id=contenu>
 
 
	<DIV id=depts USEMAP="#mapdepts">
		<IMG src="Depts1.png">
	</DIV>
 
	<DIV id=Comp_cle>
			<IMG src="Competence_cle1.png" >
	</DIV>
 
	<DIV id=Ofii>
			<IMG src="Ofii1.png" >
	</DIV>
 
	<DIV id=Coms>
			<IMG src="Coms1.png" >
	</DIV>
 
 
</div>
<map name="mapdepts">
 
				<area shape="polygon" onClick="mapOnClick('ARIEGE')" onMouseOver="mapOnMouseOver('ARIEGE')"  coords="773,600,771,600,769,600,766,598,762,600,756,599,754,600,752,600,751,601,747,602,746,602,743,600,741,604,741,605,738,609,738,610,738,611,734,611,732,613,731,746,581,747,581,749,580,750,579,751,579,754,577,758,578,759,578,759,581,761,583,762,583,763,584,764,585,769,589,769,590,770,591,773,591,775,595,773,599,773,600">
				<area shape="polygon" onClick="mapOnClick('AVEYRON')" onMouseOver="mapOnMouseOver('AVEYRON')"  coords="991,290,990,290,988,292,988,295,984,295,980,295,978,295,976,294,974,296,973,299,126,770,125,771,124,773,126,775,126,776,126,779,121,782,121,783,122,784,120,784,1007,263,1006,268,1002,270,1000,275,999,276,994,277,994,279,991,281,990,283,990,284,990,285,991,290">
				<area shape="polygon" onClick="mapOnClick('HAUTE-GARONNE')" onMouseOver="mapOnMouseOver('HAUTE-GARONNE')"  coords="126,495,126,493,122,488,124,488,124,484,124,481,123,479,125,476,125,473,123,471,124,468,125,465,125,463,126,462,126,459,128,459,129,459,131,461,139,462,141,461,268,387,266,182,457,181,460,185,468,182,468,177,465,173,466,162,460,160,462,157,462,156,464,153,466,154,473,151,479,151,483,151,486,153,487,155,491,155,496,146,496,143,493,142,496,139,495,133,494,130,496">
				<area shape="polygon" onClick="mapOnClick('GERS')" onMouseOver="mapOnMouseOver('GERS')"  coords="492,433,491,433,490,432,487,431,486,431,485,431,481,428,481,429,480,429,479,429,479,536,410,535,410,532,408,531,409,529,412,528,412,522,408,519,408,520,410,520,411,519,412,517,416,517,417,515,419,512,417,510,420,509,421,509,422,508,423,507,424,505,428,504,429,502,431,501,432,499,433,494,432,493,432,493,433,492,433">
				<area shape="polygon" onClick="mapOnClick('LOT')" onMouseOver="mapOnMouseOver('LOT')"  coords="727,183,723,184,721,184,721,183,720,183,719,184,717,187,715,185,714,184,714,183,713,183,711,184,711,185,710,185,710,187,709,188,708,189,705,186,702,186,700,188,696,189,695,188,694,189,690,192,689,192,689,194,688,194,687,196,686,193,685,193,683,193,686,196,684,198,683,199,679,197,680,192,679,193,677,193,676,191,674,191,674,192,672,191,671,192,672,195,670,197,672,199,673,202,674,204,673,205,673,206,672,208,667,209,666,209,664,208,663,207,662,203,663,201,661,199,660,198,659,198,657,198,655,196,654,195,652,199,651,200,650,202,646,205,645,206,645,205,644,206,640,209,639,209,635,211,633,215,630,209,626,208,623,208,620,207,,593,112,594,111,598,108,598,107,599,107,598,102,598,99,598,98,600,97,602,9,650,15,653,12,655,14,658,12,658,11,659,11,663,8,666,7,667,7,669,6,670,10,67111,675,8,681,9,681,11,682,10,,780,110,785,114,786,115,786,117,784,119,784,120,783,122,782,121,779,121,776,126,775,126,773,126,720,149,721,150,721,151,722,152,722,156,722,158,726,162,725,163,726,166,725,168,726,170,729,173,730,175,732,177,732,178,731,180,729,180,728,182,727,183">
				<area shape="polygon" onClick="mapOnClick('HAUTES-PYRENEES')" onMouseOver="mapOnMouseOver('HAUTES-PYRENEES')"  coords="464,584,463,584,461,586,454,586,449,584,448,581,447,581,445,580,442,578,442,579,439,581,436,582,435,587,430,590,425,585,425,582,424,579,417,578,415,576,414,576,409,574,405,577,401,577,401,578,397,580,396,579,392,578,391,578,389,581,386,582,385,583,381,581,379,581,378,583,376,585,374,585,373,585,365,583,518,495,519,496,520,496,523,495,523,493,525,491,526,490,527,489,527,489,528,488,528,487,530,487,531,487,533,486,533,485,536,485,537,484,539,484,540,483,540,483,541,483,543,481,544,480,545,479,545,478,544,475,545,474,544,474,543,471,543,470,543,469,541,466,540,465,540,464,542,464,544,464,545,463,545,462,547,462,548,463,548,462,550,461,553,461,554,461,558,462,559,462,562,461,562,460,564,460,567,461,569,462,570,461,572,461,573,461,575,459,576,465,582,464,584">
				<area shape="polygon" onClick="mapOnClick('TARN')" onMouseOver="mapOnMouseOver('TARN')"  coords="848,412,847,412,845,411,839,412,835,409,835,408,832,408,831,408,830,409,827,409,823,409,819,411,819,412,819,413,818,413,813,412,812,411,811,411,808,409,802,407,800,405,800,406,797,406,796,407,794,405,793,404,793,403,792,402,792,241,811,242,812,243,816,245,817,245,819,247,821,251,821,254,829,255,83,858,376,857,376,864,386,866,387,868,389,867,389,865,389,865,392,864,394,865,397,866,400,866,402,862,401,862,402,862,403,862,404,857,408,856,407,855,408,855,410,854,410,854,409,850,412,848,412">
				<area shape="polygon" onClick="mapOnClick('TARN-ET-GARONNE')" onMouseOver="mapOnMouseOver('TARN-ET-GARONNE')"  coords="667,286,666,287,663,286,663,288,661,290,660,290,660,289,660,290,656,294,655,294,655,290,653,289,652,289,651,291,651,292,648,298,647,297,644,298,642,298,692,252,694,256,692,261,688,262,688,264,687,264,686,263,685,264,686,267,685,268,684,268,682,268,680,271,679,273,679,275,679,276,678,277,673,276,669,275,667,275,666,276,665,277,664,276,664,278,664,279,669,280,670,281,671,281,670,282,670,283,670,286,670,287,669,287,667,286">
 
</map>
</body>
</html>