javascript - 从 navigator.geolocation.getCurrentPosition 内部调用此函数

标签 javascript jquery google-maps google-maps-api-3

向您展示我正在尝试对工作版本执行的操作的最简单方法:http://jsfiddle.net/t8Brm/11/需要支持 GEO 位置的现代浏览器。

在 JS 代码中,我已经注释掉了导致问题的代码,以便您可以首先看到它的工作情况。

问题是: 如何取消注释下面使用地理位置添加标记并将 map 居中的代码,而不会出现错误:position.coords未定义

$(this).trigger("gMap.addMarker", {
     latitude: latitude,
     longitude: longitude,
     content: "You Are Here"
});
$(this).trigger("gMap.centerAt", {
     latitude: latitude,
     longitude: longitude
});

这是原始插件:http://github.com/marioestrada/jQuery-gMap我为 GEO Location 添加了额外的功能。如下图所示:

function generateDirections(from, to, directionHtml){
            var directionsDisplay;
            var directionsService = new google.maps.DirectionsService();

            $('#'+directionHtml).html('');

            var request = {
                origin: from,
                destination: to,
                travelMode: google.maps.DirectionsTravelMode.DRIVING
            };

            directionsDisplay = new google.maps.DirectionsRenderer();
            directionsDisplay.setMap($gmap);
            directionsDisplay.setPanel(document.getElementById(directionHtml));
            directionsService.route(request, function(response, status){
                if(status == google.maps.DirectionsStatus.OK){
                    directionsDisplay.setDirections(response);
                    if($("#gmaps_from").val().length === 0)
                        $("#gmaps_from").val(response.routes[0].legs[0].start_address);
                }
            });

            setTimeout(function(){
                $("#"+directionHtml).slideDown("slow");
            },1000);
        }

        //make this available to the click element
        $.data($('#gmaps_getdirections')[0], 'inst', this);

        $('#gmaps_getdirections').click(function(e) {
            e.preventDefault();

            var from = $('#gmaps_from').val();
            if(opts.address){
                var to = opts.address;
            } else {
                var to = parseFloat(opts.latitude) + ", " + parseFloat(opts.longitude);
            }

            generateDirections(from, to, "gmaps_directions");

            //open the google window
            //window.open("http://maps.google.com/maps?saddr=" + from + "&daddr=" + to, "GoogleWin", "menubar=1,resizable=1,scrollbars=1,width=750,height=500,left=10,top=10");
        });

        if(opts.geolocation && navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function(position){
                var latitude = position.coords.latitude;
                var longitude = position.coords.longitude;

                var from = parseFloat(latitude) + ", " + parseFloat(longitude);

                if(opts.address){
                    var to = opts.address;
                } else {
                    var to = parseFloat(opts.latitude) + ", " + parseFloat(opts.longitude);
                }

                /*$(this).trigger("gMap.addMarker", {
                    latitude: latitude,
                    longitude: longitude,
                    content: "You Are Here"
                });
                $(this).trigger("gMap.centerAt", {
                    latitude: latitude,
                    longitude: longitude
                });*/

                generateDirections(from, to, "gmaps_directions");                    
            });
        }

最佳答案

您可以执行等效的 JavaScript API v3 代码,如下所示:

new google.maps.Marker({position:new google.maps.LatLng(latitude,longitude),
    map:$gmap,
    title:"You Are Here"});
$gmap.setCenter(new google.maps.LatLng(latitude,longitude));

在 jsFiddle 中用此替换注释掉的代码会将标记放置在 map 上,并立即将 map 置于您所在位置的中心。

似乎在那之后的某个时刻触发了另一个位置的居中。 (我认为你可以把它关掉,但如果没有,只需在评论中这么说,我或其他人无疑会多看一些。)

关于javascript - 从 navigator.geolocation.getCurrentPosition 内部调用此函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7245949/

相关文章:

javascript - 如何通过在 javascript 中单击按钮来更改 css 类?

jquery - 检测div碰撞?

javascript - 不是 googlemaps api javascript 中的函数错误

javascript - 生成具有特定模式的 "serial"代码

javascript - Angular js - 切换 Controller (站点页面)时停止 Controller 的事件(http请求)

jquery mobile - 滑动停止功能

c# - jQuery中onclick方法中调用服务器端方法

android - 如何在 MapView 上创建动态编号的 Pin 指针?

google-maps - 无法从 Google Place Details API 获取营业时间

javascript - 如何制作这个可调整大小的 div,从边缘调整大小?