Regel uit database in infowindow laden
Ik het het google map script gebruikt wat NewBie vorig jaar heeft gepost.
Dit script werkt echt geweldig.
Echter krijg je bij elk zoekresultaat netjes een infowindow of ballon met daarin je zoekopdracht.
Echter wil ik graag extra informatie plaatsen in deze ballon.
Deze info staat bij mij in een database, echter kom ik er niet achter hoe ik dat in de ballon kan krijgen.
Kan iemand mij hier de helpende hand bieden?
In ieder geval alvast bedankt voor de moeite voor het lezen van deze topic.
Hieronder het script :
Code (php)
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
138
139
140
141
142
143
144
145
146
147
148
149
150
151
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
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<?php
//Dit is de code die je van google hebt gekregen (als je die nog niet hebt, kun je hem hier: http://www.google.com/apis/maps/signup.html aanvragen)
$code = '';
//Dit is het adres waarmee de pagina wordt geopend, en dit adres wordt ook getoond als er een onbekend adres ingegeven wordt
$eigenadres = 'malders Den Dungen';
/*
Hieronder kun je aangeven in welke mode de kaart moet staan.
Als je alleen de kaarten wilt zien, gebruik dan 'G_NORMAL_MAP'
Als je alleen de satelietbeelden wilt zien, gebruik dan 'G_SATELLITE_MAP'
Als je zowel de kaarten als de satelietbeelden wilt zien, gebruik dan 'G_HYBRID_MAP'
*/
$soort = 'G_HYBRID_MAP';
//Hoever wil je inzoomen? 1 is Mondiaal niveau, 100 is verst ingezoomd. (google standaard waarde: 15)
$zoom = 18;
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps check adres</title>
<style type="text/css">
body {
margin: 0;
padding: 0;
overflow: hidden;
}
label {
padding-left: 10px;
}
</style>
<script src="http://maps.google.com/maps?file=api&v=2&key=<?=$code ?>" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var _myWidth;
var _myHeight;
var map = null;
var geocoder = null;
var mgr = null;
function load(adres) //de hoofdfunctie
{
if (GBrowserIsCompatible())
{
map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
mwh();
geocoder = new GClientGeocoder();
showAddress(adres + " NL");
}
}
function showAddress(address)
{
if (geocoder)
{
geocoder.getLatLng(address,
function(point)
{
if (!point) //als het adres niet gevonden is
{
alert(address + " Niet gevonden"); //geef een alert
load('<?=$eigenadres ?>'); //en doe het standaard adres
}
else
{
map.setCenter(point, <?=$zoom; ?>, <?=$soort;?>);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
}
);
}
}
// belangrijke hulpfunctie
function ge(idname)
{
var element = document.getElementById(idname);
return element;
}
// ----- mousewheel
function zoom(oEvent, s)
{
if(s == -120)
{
map.zoomOut();
}
if(s == 120)
{
map.zoomIn();
}
}
function mwh()
{
var d = ge('map');
if (d)
{
try
{
if (document.body.addEventListener)
{
d.addEventListener('DOMMouseScroll', function(oEvent) {zoom(oEvent, oEvent.detail * -40); }, false);
}
else
{
d.onmousewheel = function() { zoom(event, event.wheelDelta); return false; }
}
}
catch (ex) {}
}
}
//]]>
</script>
</head>
<body onload="load('<?=!empty($_GET['adres']) ? htmlentities($_GET['adres']) : $eigenadres; ?>')" onunload="GUnload()" topmargin="0" leftmargin="0">
<div id="map" style="width: 100%; height: 400px">
</div>
<br />
<form action="?" method="get">
<label>Je adres (binnen nederland): </label>
<input name="adres" type="text" value="<?php echo isset($_GET['adres']) ? htmlentities($_GET['adres']) : $eigenadres; ?>" />
<input type="submit" value="Go!" />
</form>
</body>
</html>
//Dit is de code die je van google hebt gekregen (als je die nog niet hebt, kun je hem hier: http://www.google.com/apis/maps/signup.html aanvragen)
$code = '';
//Dit is het adres waarmee de pagina wordt geopend, en dit adres wordt ook getoond als er een onbekend adres ingegeven wordt
$eigenadres = 'malders Den Dungen';
/*
Hieronder kun je aangeven in welke mode de kaart moet staan.
Als je alleen de kaarten wilt zien, gebruik dan 'G_NORMAL_MAP'
Als je alleen de satelietbeelden wilt zien, gebruik dan 'G_SATELLITE_MAP'
Als je zowel de kaarten als de satelietbeelden wilt zien, gebruik dan 'G_HYBRID_MAP'
*/
$soort = 'G_HYBRID_MAP';
//Hoever wil je inzoomen? 1 is Mondiaal niveau, 100 is verst ingezoomd. (google standaard waarde: 15)
$zoom = 18;
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps check adres</title>
<style type="text/css">
body {
margin: 0;
padding: 0;
overflow: hidden;
}
label {
padding-left: 10px;
}
</style>
<script src="http://maps.google.com/maps?file=api&v=2&key=<?=$code ?>" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var _myWidth;
var _myHeight;
var map = null;
var geocoder = null;
var mgr = null;
function load(adres) //de hoofdfunctie
{
if (GBrowserIsCompatible())
{
map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
mwh();
geocoder = new GClientGeocoder();
showAddress(adres + " NL");
}
}
function showAddress(address)
{
if (geocoder)
{
geocoder.getLatLng(address,
function(point)
{
if (!point) //als het adres niet gevonden is
{
alert(address + " Niet gevonden"); //geef een alert
load('<?=$eigenadres ?>'); //en doe het standaard adres
}
else
{
map.setCenter(point, <?=$zoom; ?>, <?=$soort;?>);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
}
);
}
}
// belangrijke hulpfunctie
function ge(idname)
{
var element = document.getElementById(idname);
return element;
}
// ----- mousewheel
function zoom(oEvent, s)
{
if(s == -120)
{
map.zoomOut();
}
if(s == 120)
{
map.zoomIn();
}
}
function mwh()
{
var d = ge('map');
if (d)
{
try
{
if (document.body.addEventListener)
{
d.addEventListener('DOMMouseScroll', function(oEvent) {zoom(oEvent, oEvent.detail * -40); }, false);
}
else
{
d.onmousewheel = function() { zoom(event, event.wheelDelta); return false; }
}
}
catch (ex) {}
}
}
//]]>
</script>
</head>
<body onload="load('<?=!empty($_GET['adres']) ? htmlentities($_GET['adres']) : $eigenadres; ?>')" onunload="GUnload()" topmargin="0" leftmargin="0">
<div id="map" style="width: 100%; height: 400px">
</div>
<br />
<form action="?" method="get">
<label>Je adres (binnen nederland): </label>
<input name="adres" type="text" value="<?php echo isset($_GET['adres']) ? htmlentities($_GET['adres']) : $eigenadres; ?>" />
<input type="submit" value="Go!" />
</form>
</body>
</html>
Gewijzigd op 01/01/1970 01:00:00 door Marco
Code (php)
1
<?php en ?>
knop om dit te doen.SanThe.
Jammer...
Je hebt nog geen opdracht gegeven aan de database om een SELECT te doen...
Je fetch nergens iets...
Je weet waar je de tekst neer moet zetten (in het JS-gedeelte)...
Werk deze stappen even af en probeer zelf eens wat.