Cartographie dynamique en lien avec base de données
Bonjour à tous,
J'ai trouvé un code sur internet pour créer une carte en relation avec une base de données.
Mais j'aimerais savoir si c'est possible d'ajouter une fonction qui affiche de la couleur sur le departement quand la souris passe dessus? (onmouseover)
Si quelqu'un pouvait m'aider, merci.
Code:
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
| <center>
<!--Cartographie dynamique utilisation de la classe maphilight de jquery-->
<!-- il est nécessaire d'avoir jquery pour pouvoir colorier les images maps automatiquement (vous devez changer les liens qui pointes sur ces fichiers donnés dans le package-->
<script type="text/javascript" src="jquery-1.2.3.pack.js"></script>
<!-- Plugin de coloration des balises map-->
<script type="text/javascript" src="jquery.metadata.min.js"></script>
<script type="text/javascript" src="jquery.maphilight.js"></script>
<script>
$(function() {
$('.map2').maphilight({fade:true});
});
</script>
<?php
$requete2 = 'SELECT * FROM dep';
$rslt_map = mysql_query($requete2);
?>
<img id="image" src="carte.png" border="0" alt="Cartographie" title="Cartographie" class="map2" usemap="#france" width="515" height="715" />
<map name="france">
<?php
//tant qu'il y a des départements à créer...je récupère la géométrie le numero de département et son nom
while( $tab = mysql_fetch_array($rslt_map ))
{
$nom_dep = $tab['de_titre'];
$num_dep = $tab['de_num'];
$num_info = $tab['de_info'];
$num_url = $tab['de_url'];
$chaine_geometrie = $tab['de_geom'];
$site_relais = $tab['deptmp_site'];
?>
<!--Puis on créer la balise map avec des infos sur l'infobulle et un lien hypertexte dynamique (propre à mon site)
ces balises map seront colorer en rouge dans mon cas grace au plugin maphilight de jquery-->
<!--On peut imaginer que les liens hypertextes soient rattachés à votre base de données dans un champ "url"-->
<br>
<area shape="poly" alt="<?php echo 'Liste '. $nom_dep.' ('. $num_dep.')' ; ?>" title="<?php echo $nom_dep.' ( '.$num_dep.' )';?>" id="france" class="{fill:true,fill:'000000',fillColor:'C03000',strokecolor:'C03000',fillOpacity:0.1,alwaysOn:true}" coords=" <?php echo $chaine_geometrie;?>" href="<?php echo $num_url; ?>" />
<table>
<tr>
<td>Site relais:</td>
<td><?php echo $site_relais;?></td>
</tr>
</table>
<?php
}
echo '</map>'; ?> |
Cartographie dynamique en lien avec une base de données
En cherchant, j'ai trouvé un code plus adapté à ce que je veux faire et qui marche.
Il y a juste un bug au niveau des couleurs des départements....lorsque je passe la souris sur un département, c'est un autre département qui devient en couleur.
Je n'ai qu'un seul departement qui fonctionne bien....
Code:
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
| </table>
<script type="text/javascript">
function swapPic(zone,nr){
var pic=document.getElementById('hovered')
pic.src='area/'+nr+'.png'
zone.onmouseout=function(){pic.src='area/0.png'}
}
</script>
<link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="txt.css"/>
<style type="text/css">
img {border:0;}
</style>
</head>
<center>
<body>
<div id="pic" style="height: 715; width: 515; background-position: center; background-image: url('area/carte.png'); background-repeat: no-repeat">
<img id="hovered" src="area/0.png" usemap="#Map" width="515" height="715" />
<map name="Map">
<?php
$requete2 = 'SELECT * FROM deptMP';
$rslt_map = mysql_query($requete2);
while( $tab = mysql_fetch_array($rslt_map ))
{
$nom_dep = $tab['deptmp_titre'];
$num_dep = $tab['de_num'];
$num_info = $tab['de_info'];
$num_url = $tab['de_url'];
$chaine_geometrie = $tab['de_geom'];
$site_relais = $tab['de_site'];
$id = $tab['de_id'];
?>
<area href="<?php echo $num_url; ?>" title="<?php echo $nom_dep.' ( '.$num_dep.' ) ' .$id.' '.$site_relais;?>" onmouseover="swapPic(this,<?php echo $id;?>)" shape="polygon" coords="<?php echo $chaine_geometrie;?>">
<?php
}
echo '</map>'; ?>
</map> |
Cartographie dynamique en lien avec base de données
Bonjour, tout d'abord merci pour la réponse et il n'y aura que quelques départements (environ 5 Départements).
Et j'ai entendu parler d'openlayers et python, c'est difficile à mettre en place?
