Bonjour à tous,
Je me permet de solliciter votre aide car j'essaie de faire une page web
un peu comme flightradar24.
Donc je pioche mes donnés dans 2 table différente d'une base de donnée et les affiche. Jusque là ok.
Chaque ligne de ma BD correspond à un avion, et ces lignes sont mise à jours toutes les minutes ( en gros ).
Et je souhaiterai que la carte se mettent à jour, mais sans que ce soit toute la page qui se recharge.
J'ai essayé de m'inspirer de ce sujet de discussion, mais je n'ai pas réussi.
Le prb ce que je n'ai un connaissance en java quasinul.
J'ai cru comprendre qu'il fallait charger les infos à un moment précis, mais quand??
Pour l'instant j'en suis là
et voici le le code modifié d’après la discussion, mais qui ne fonctionne pas, en plus y a une erreur dessus qui fait que celà ne s'affiche plus
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 <?php define('PROTECTIONINCLUDE', TRUE); include './config/bdall.php'; ?> <!DOCTYPE html> <html> <head> <title>Carte de tous les avions en enregistrements</title> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8"> <style> html, body, #map-canvas { margin: 0; padding: 0; height: 100%; } </style> <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> <script> var map; function initialize() { var mapOptions = { autozoom: true, disableDefaultUI: true, zoom: 5, center: new google.maps.LatLng(46.2293411, 6.106630699999982), mapTypeId: google.maps.MapTypeId.TERRAIN, refreshTime: 10000 <?php $DBPDO = new PDO($dbdns1,$dbuser1 , $dbpass1, array( PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8")); $DBPDO-> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING); $sql = "SELECT * FROM tracker_mil_acarsdata"; $req = $DBPDO ->query($sql); $sql2 = "SELECT * FROM tracker_cil_acarsdata"; $req2 = $DBPDO ->query($sql2); ?> }; map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); <?php while($d=$req->fetch(PDO::FETCH_OBJ)) { ?> var position = new google.maps.LatLng(<?php echo $d->lat;?>, <?php echo $d->lng;?>); var marker = new google.maps.Marker({position: position,map: map,icon: "http://airindiavirtual.com//lib/images/inair/<?php echo $d->heading;?>.png"}); var infowindow = new google.maps.InfoWindow({content: 'lat: <?php echo $d->lat;?> lng:<?php echo $d->lng;?>'}); google.maps.event.addListener(marker, 'click', function() {infowindow.open(marker.get('map'), marker); }); <?php } ?> <?php while($e=$req2->fetch(PDO::FETCH_OBJ)) { ?> var position = new google.maps.LatLng(<?php echo $e->lat;?>, <?php echo $e->lng;?>); var marker = new google.maps.Marker({position: position,map: map,icon: "http://grafikart2.fsfrancesimulateur2.fr/include/membre/map/inair/<?php echo $e->heading;?>.png"}); var infowindow = new google.maps.InfoWindow({content: 'lat: <?php echo $e->lat;?> lng:<?php echo $e->lng;?>'}); google.maps.event.addListener(marker, 'click', function() {infowindow.open(marker.get('map'), marker); }); <?php } ?> } google.maps.event.addDomListener(window, 'load', initialize); </script> </head> <body> <div id="map-canvas"></div> </body> </html>
pourriez vous me guider s'il vous plait.
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
131
132
133
134
135
136
137 <?php define('PROTECTIONINCLUDE', TRUE); include './config/bdall.php'; $DBPDO = new PDO($dbdns1,$dbuser1 , $dbpass1, array( PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8")); $DBPDO-> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING); ?> <!DOCTYPE html> <html lang="fr"> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>[Google Maps API V3] Déplacement d'un Marker</title> <meta name="Author" content="NoSmoking"> <style type="text/css"> html, body { height : 100%; margin : 0; padding : 0; font-family : Verdana, Arial; font-size : 1em; } h1 { color : #4488bb; font-size : 1.3em; margin : 0; padding : 0.5em; border : 1px solid #4488bb; } #page { padding : 0.5em; } #div_main { margin : auto; width : 800px; } #div_carte{ margin : auto; margin-top : 1.0em; width : 600px; height: 600px; border : 1px solid #c0c0c0; } </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var tPosition = [ { 'lat' :45.767299, 'lon' : 4.834329}, { 'lat' :48.856667, 'lon' : 2.350987}, { 'lat' :44.837368, 'lon' :-0.576144}, { 'lat' :43.297612, 'lon' : 5.381042} ]; var nbPoint = tPosition.length; var iPos = 0; function movePositionMarker( marker){ iPos++; // incrémentation; iPos %= nbPoint; // pas de débordement // déplace le marker marker.setPosition( <?php $sql = "SELECT * FROM tracker_mil_acarsdata"; $req = $DBPDO ->query($sql); ?> <?php while($d=$req->fetch(PDO::FETCH_OBJ)) { ?> new google.maps.LatLng( <?php echo $d->lat;?>, <?php echo $d->lng;?>), <?php } ?> )}; //var position = new google.maps.LatLng(<?php echo $d->lat;?>, <?php echo $d->lng;?>); //var marker = new google.maps.Marker({position: position,map: map,icon: "http://grafikart2.fsfrancesimulateur2.fr/tools/.bouton.png"}); // déplace le marker //marker.setPosition( new google.maps.LatLng( tPosition[iPos].lat, tPosition[iPos].lon)); // rappel de la fonction setTimeout( function(){ movePositionMarker( marker); }, 1000); } function initCarte(){ // init var oMap, oMarker; var mapOptions = { backgroundColor : '#fff', mapTypeControl : false, streetViewControl : false, zoomControlOptions: { style: google.maps.ZoomControlStyle.SMALL }, zoom : 6, center : new google.maps.LatLng( 46.80, 1.75), mapTypeId: google.maps.MapTypeId.ROADMAP }; // creation de la carte oMap = new google.maps.Map(document.getElementById("div_carte"), mapOptions); // creation du marqueur oMarker = new google.maps.Marker({ position : new google.maps.LatLng( tPosition[0].lat, tPosition[0].lon), map : oMap, icon: "http://grafikart2.fsfrancesimulateur2.fr/tools/.bouton.png" }); movePositionMarker( oMarker); } // init lorsque la page est chargee google.maps.event.addDomListener(window, 'load', initCarte); </script> </head> <body> <div id="page"> <div id="div_main"> <h1>[Google Maps API V3] Déplacement d'un Marker</h1> <div id="div_carte"></div> </div> </div> </body> </html>
Merci d'avance Flo
Partager