Erreur : has no properties

Bonjour à toutes et à tous,

voilà, en fait j'adapte un script que j'avais créé. Tout marchait jusqu'à présent ( je tiens à le préciser ), j'ai presque pas toucher au script sinon pour le remettre en forme et enlever des choses inutiles, le voici :

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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
var map     // Variable de la carte
var tabCurs     // Contient L&L des marqueurs
 
var dist = document.getElementById( 'dist' )    // Le label contenant la distance
 
function load() {
    if( GBrowserIsCompatible() ) {
        map= false
        tabCurs= new Array()
 
        // Initialisation de la map
        map= new GMap2( document.getElementById( 'map' ) )    
 
        // Ajout de l'échelle & du zoom & du centrage
        map.addControl( new GScaleControl() )        
        map.addControl( new GLargeMapControl() )
        map.addControl( new GMapTypeControl() )
        map.addControl( new GOverviewMapControl() )
        map.setCenter( new GLatLng( 48.58333595943222, 7.745629549026489 ), 13 )
 
        // Ecouteur sur un clic
        GEvent.addListener( map, "click", MarqueurEvent )
    }
}
 
function MarqueurEvent( overlay, point ) {
    if (overlay) {    // Clic sur un curseur qui supprime le point
        // On récupère les coordonnées de ce point
        var curs = new GLatLng( overlay.getPoint().lat(), overlay.getPoint().lng() )
 
        // On met le tableau à jour
        tabCurs=copieTab( curs )
 
        // On raffraichit la map
        refresh()
    }
    else {    // On rajoute un curseur
        // On ajoute le point au tableau
        tabCurs[tabCurs.length] = new GLatLng( point.lat(), point.lng() )
 
        // On ajoute le point sur la map
        map.addOverlay( new GMarker( point ) )
    }
 
    // On créé la polyligne qu'on ajoute sur la map
    map.addOverlay( new GPolyline( tabCurs, '#00cc33', 5, 1) )
 
    // On recalcule la distance
    calcul()
}
 
function refresh() {
    // On supprime toutes les couches qu'il y a sur la Map
    map.clearOverlays()
 
    // On rajoute les marqueurs
    for(i = 0; i < tabCurs.length; i++)
        map.addOverlay( new GMarker( new GLatLng( tabCurs[i].lat() , tabCurs[i].lng() ) ) )
 
    // On rajoute la polyligne
    map.addOverlay( new GPolyline( tabCurs, '#00CC33', 5, 1 ) )
}
 
function copieTab( curs ) { // Créé un nouveau tableau en otant l'élément "curs"
    var tabTmp = new Array()
    for( i = 0, j = 0; i < tabCurs.length; i++ )
        if ( curs.toString() != tabCurs[i].toString() ) {
            tabTmp[j] = new GLatLng( tabCurs[i].lat(), tabCurs[i].lng() ) 
            j++
        }
 
    return tabTmp
}
 
function calcul() {
    var distance = 0
    if( tabCurs.length > 1 ) {
        // On calcule la distance entre chaque points pour obtenir la distance finale
        for( i = 0; i < tabCurs.length - 1; i++ ) {
            pointDepart = new GLatLng( tabCurs[i].lat(), tabCurs[i].lng() )
            pointArrivee = new GLatLng( tabCurs[i+1].lat(), tabCurs[i+1].lng() )
            distance += pointDepart.distanceFrom( pointArrivee ) / 1000
        }
    }
 
    // On tronque à 3 décimales après la virgule
    distance = distance.toFixed(3)    
 
    // On met le champ de distance à jour
    if( distance == 0 )
        dist.innerHTML = "0 mètre"
    else if( distance < 1 )
        dist.innerHTML = ( distance*1000 ).toString() + " mètres"
    else if ( distance >= 1 && distance < 2 )
        dist.innerHTML = distance.toString() + " kilomètre"
    else
        dist.innerHTML = distance.toString() + " kilomètres"
}

Et le code HTML appelant (épuré) :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/MarkUp/DTD/xhtml11.dtd">
<html>
<head>
    <title>Bienvenue sur buchsy.fr </title>
<link rel="shortcut icon" href="/favicon.ico">
<link rel="stylesheet" type="text/css" href="css/general.css" />    
<link rel="stylesheet" type="text/css" href="css/GoogleMaps.css" />
<script type="text/javascript" src="javascript/GoogleMaps.js"></script>
<script type="text/javascript" src="MaClé"></script>
</head>
<body onload="load()" onunload="GUnload()">
<div class="contenu">
<fieldset id="fd_map">
    <div id="map"></div>
</fieldset>
<p id="p_map">
    <br/>
        <label id="lbl_dist" for="dist">Distance : </label>
        <label id="dist">0 mètre</label><br/>
    <br/>
    <input id="recommence" type="button" value="Recommencer" onclick="load()"/>
</p></div>
<hr />
</body>
</html>

Ma console JavaScript crie au scandale en disant :

Citation:

dist has no properties

Et donc mon label dist ne se mets plus à jour comme auparavant, où est l'erreur?

:merci: