Hi there,
the problem I see here is in the scope of the map variable.
If you want to access it from a function outside the load function
then it has to be global.
// >>>>>>>>>>>>>>>> define map as global <<<<<<<<<<<<<<<<<<<<
var map;
function load() {
if (GBrowserIsCompatible()) {
// >>>>>>>>>>>>>>>> use the global map (notice I removed the
var) <<<<<<<<<<<<<<<<<<
map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(19.041950, 72.818420), 13);
// Change this depending on the name of your PHP file
}
}
Hope it helps,
Davide
PS The displayMarker function is misleading with all these unused
arguments.... ;-)
On Jun 27, 11:52 pm, sonali ajankar <[email protected]> wrote:
> Hi,
>
> If I write the code inside function markerDisplay in load function then runs
> but when i create separate function for that it will not run can anyone
> suggest me what is the problem.
> For my application I want to display markers by clicking on button "Search
> Locations".
>
> Following is my code:
>
> <%...@page contentType="text/html" pageEncoding="UTF-8"%>
> <!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 AJAX + mySQL/PHP Example, category package</title>
> <script
> src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAkanz56UUYV06Nl9d...";
> type="text/javascript"></script>
> <script type="text/javascript">
> //<![CDATA[
>
> var iconBlue = new GIcon();
> iconBlue.image =
> 'http://labs.google.com/ridefinder/images/mm_20_blue.png';
> iconBlue.shadow =
> 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
> iconBlue.iconSize = new GSize(12, 20);
> iconBlue.shadowSize = new GSize(22, 20);
> iconBlue.iconAnchor = new GPoint(6, 20);
> iconBlue.infoWindowAnchor = new GPoint(5, 1);
>
> var iconRed = new GIcon();
> iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png';
> iconRed.shadow =
> 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
> iconRed.iconSize = new GSize(12, 20);
> iconRed.shadowSize = new GSize(22, 20);
> iconRed.iconAnchor = new GPoint(6, 20);
> iconRed.infoWindowAnchor = new GPoint(5, 1);
>
> var customIcons = [];
> customIcons["restaurant"] = iconBlue;
> customIcons["bar"] = iconRed;
> customIcons["Tourist place"] = iconBlue;
>
> function load() {
> if (GBrowserIsCompatible()) {
> // var geocoder = new GClientGeocoder();
> var map = new GMap2(document.getElementById("map"));
> map.addControl(new GSmallMapControl());
> map.addControl(new GMapTypeControl());
> map.setCenter(new GLatLng(19.041950, 72.818420), 13);
>
> // Change this depending on the name of your PHP file
>
> }
> }
> function displayMarker(point, name, address, type, map){
> GDownloadUrl("http://localhost/phpsqlajax_genxml2.php";, function(data) {
> var xml = GXml.parse(data);
> var markers = xml.documentElement.getElementsByTagName("marker");
> for (var i = 0; i < markers.length; i++) {
> var name = markers[i].getAttribute("name");
> var address = markers[i].getAttribute("address");
> var type = markers[i].getAttribute("type");
> var point = new
> GLatLng(parseFloat(markers[i].getAttribute("lat")),
>
> parseFloat(markers[i].getAttribute("lng")));
> var marker = createMarker(point, name, address, type);
> GEvent.addListener(marker, 'click', function() {
> marker.openInfoWindowHtml(html);
> });
> // return marker;
> map.addOverlay(marker);
> }
> });
> }
>
>
>
> <%-- function searchLocations() {
> var address = document.getElementById('addressInput').value;
> geocoder.getLatLng(address, function(latlng) {
> if (!latlng) {
> alert(address + ' not found');
> } else {
> searchLocationsNear(latlng);
> }
> });
> }
>
>
> function createMarker(point, name, address, type) {
> var marker = new GMarker(point, customIcons[type]);
> var html = "<b>" + name + "</b> <br/>" + address;
> GEvent.addListener(marker, 'click', function() {
> marker.openInfoWindowHtml(html);
> });
> return marker;
> }
>
>
> //]]>
> </script>
> </head>
>
> <body onload="load()" onunload="GUnload()">
> <br>
> <input type="button" onclick="displayMarker(point, name, address, type,
> map)" value="Search Locations"/>
> <div style="width:600px; font-family:Arial, sans-serif; font-size:11px;
> border:1px solid black">
> <table>
> <tbody>
> <tr>
> <td width="200" valign="top">
> <div id="sidebar" style="overflow: auto; height: 400px;
> font-size: 11px; color: #000"></div>
> </td>
> <td> <div id="map" style="width: 400px; height: 400px"></div> </td>>
> </tr>
> </tbody>
> </table>
> </div><br>
> If user Enters in a new region press region changed button:
> <input type="button" value="Region Change" />
> </body>
> </html>
>
> I referred following tutorial for displaying Google maps.
>
> http://http://code.google.com/apis/maps/articles/phpsqlajax.html
>
> Thanks in advance. Please help.
>
> -Sonali Ajankar
--
You received this message because you are subscribed to the Google Groups
"Google Maps API" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-maps-api?hl=en.
