jquery - 通过ajax加载Google map 标记

Question

我想通过 ajax 使用我自己的地理定位服务加载 Google map 的标记。 ajax 功能来自 jQuery。我加载标记的代码如下:

 $(document).ready(function() {

        var myLatlng = new google.maps.LatLng(49.47143, 11.107489999999984);
        var mapOptions = {
            zoom: 8,
            center: myLatlng
        };
        var map = new google.maps.Map(document.getElementById('googlemap'), mapOptions);

        $.ajax({
            type: "GET",
            url: "{{ path('jobs_ajax_get_geolocation') }}",
            data: "addr="+encodeURI("{{ company.getAddress }}, {{ company.getZipCode }} {{ company.getCity }}"),
            success: function(data) {
                var marker = new google.maps.Marker({
                    position: new google.maps.LatLng(data.lat, data.long),
                    map: map,
                    title: 'test'
                });
            }
        });
    });

map 加载了正确的初始化位置，但没有显示标记。 url 提供了 ajax 结果({{ path('jobs_ajax_get_geolocation') }}；它是一个 symfony-route)。

我的错误在哪里？谢谢!

Answer 1

您的问题属于错误的范围。

您在函数定义中声明了 var 标记。在函数之外它不会存在。但你需要在外部作用域中使用它。

尝试在关闭之前声明它:

$(document).ready(function() {

        var myLatlng = new google.maps.LatLng(49.47143, 11.107489999999984);
        var mapOptions = {
            zoom: 8,
            center: myLatlng
        };
        var map = new google.maps.Map(document.getElementById('googlemap'), mapOptions);
        var marker;

        $.ajax({
            type: "GET",
            url: "{{ path('jobs_ajax_get_geolocation') }}",
            data: "addr="+encodeURI("{{ company.getAddress }}, {{ company.getZipCode }} {{ company.getCity }}"),
            success: function(data) {
                    marker = new google.maps.Marker({
                    position: new google.maps.LatLng(data.lat, data.long),
                    map: map,
                    title: 'test'
                });
            }
        });
    });