简体   繁体   English

Google Maps API v3出现问题-Javascript

[英]Trouble with Google Maps API v3 - Javascript

I've forgotten everything I learned in Javascript, so I started a project to remember some things. 我已经忘记了在Java语言中学到的一切,因此我开始了一个项目来记住一些事情。 But I had a problem: 但是我有一个问题:

This is my code in Javascript: 这是我的Java代码:

    var peru = new google.maps.LatLng(-9, -75);
    var browserSupportFlag =  new Boolean();
    function initialize() {
        var ubicacion;  
        var mapOptions = {

            zoom: 6,
            mapTypeId: google.maps.MapTypeId.ROADMAP,

            mapTypeControl: true,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
                position: google.maps.ControlPosition.BOTTOM_LEFT
            },
            zoomControl: true,
            zoomControlOptions: {
                style: google.maps.ZoomControlStyle.LARGE,
                position: google.maps.ControlPosition.LEFT_CENTER
            },

            panControl: false,
            scaleControl: false,
            streetViewControl: false,

        };

        var map = new google.maps.Map(document.getElementById("map_canvas"),
                mapOptions);

        if (navigator.geolocation) {
            browserSupportFlag = true;
            navigator.geolocation.getCurrentPosition(function(position) {
                ubicacion = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
                map.setCenter(ubicacion);
                }, function() {
                    handleNoGeolocation(browserSupportFlag);
                }
            );

        } else {
            browserSupportFlag = false;
            handleNoGeolocation(browserSupportFlag);
        }

        function handleNoGeolocation(errorFlag) {
            if (errorFlag == true) {
                alert("No se han otorgado permisos de Geolocalización, o el servicio falló. Utilice Google Chrome para mayor compatibilidad.");
                ubicacion = peru;
                } else {
                    alert("Su navegador no soporta Geolocalización. Puede continuar de igual forma, pero le sugerimos utilizar el navegador Google Chrome.");
                    ubicacion = peru;
                }

            map.setCenter(ubicacion);
        }

        function downloadUrl(url,callback) {
            var request = window.ActiveXObject ?
            new ActiveXObject('Microsoft.XMLHTTP') :
            new XMLHttpRequest;

            request.onreadystatechange = function() {
                if (request.readyState == 4) {
                    request.onreadystatechange = doNothing;
                    callback(request, request.status);
                }
            };

            request.open('GET', url, true);
            request.send(null);
        }

        function doNothing() {}

        downloadUrl("phpsqlsearch_genxml.php?lat="+ubicacion.lat()+"&lng="+ubicacion.lng()+"&r=250", function(data) {
            var xml = data.responseXML;
            var markers = xml.documentElement.getElementsByTagName("marker");

            var infoWindow = new google.maps.InfoWindow;

            function bindInfoWindow(marker, map, infoWindow, html) {
                google.maps.event.addListener(marker, 'click', function() {
                infoWindow.setContent(html);
                infoWindow.open(map, marker);
                });
            }

            for (var i = 0; i < markers.length; i++) {
                var name = markers[i].getAttribute("nombre");
                var address = markers[i].getAttribute("direccion");

                var point = new google.maps.LatLng(
                    parseFloat(markers[i].getAttribute("lat")),
                    parseFloat(markers[i].getAttribute("lng")));
                var html = "<b>" + name + "</b> <br/>" + address;

                var marker = new google.maps.Marker({
                  map: map,
                  position: point,

                });

                bindInfoWindow(marker, map, infoWindow, html);
            }
        });
    }

And my trouble is in this part: 我的麻烦在于这部分:

            downloadUrl("phpsqlsearch_genxml.php?lat="+ubicacion.lat()+"&lng="+ubicacion.lng()+"&r=250", function(data) {...}

I want to get the latitude and logitude variables and put them into the "url" on "download Url(url,...". 我想获取纬度和经度变量,并将其放入“下载Url(url,...)”上的“ url”中。

Example, if my location is -9.123792,-78.517313 y want to catch this url for it: phpsqlsearch_genxml.php?lat=-9.123792&lng=-78.517313&r=250 例如,如果我的位置是-9.123792,-78.517313,则想为其捕获以下URL:phpsqlsearch_genxml.php?lat = -9.123792&lng = -78.517313&r = 250

Also I want the radio of search be selectable... by input number or something like that. 我也希望搜索的收音机可以选择...通过输入数字或类似的东西。

I really don't know how I did all this, and how i'll do all I want :S 我真的不知道我是怎么做到的,我将如何做我想做的:S

PS.: Sorry for my English. PS .:对不起,我的英语。

I assume you are trying to modify Google's Store locator . 我认为您正在尝试修改Google的商店定位器 It has all the functionality you require. 它具有您所需的所有功能。

Where your problem arises is you are not passing coordinates to downloadUrl() 出现问题的地方是您没有将坐标传递给downloadUrl()

In the demo the function searchLocationsNear(center) sends the coordinates(center) to be joined to the url before downloadUrl() is called. 在演示功能searchLocationsNear(center)发送坐标(中心)到前被接合到URL downloadUrl()被调用。

I would advise you to follow the demo and ensures you understand it before modifying. 我建议您遵循该演示,并确保在修改之前了解它。

It is also advisable to use PDO in phpsqlsearch_genxml.php as mysql functions are deprecated 还建议在phpsqlsearch_genxml.php使用PDO,因为不建议使用mysql函数

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM