Как установить маркер на карте Google с выпадающим? - PullRequest
Новая
       31

Как установить маркер на карте Google с выпадающим?

0 голосов
/ 21 октября 2018

Я пытаюсь показать маркер на карте Google, но маркер не отображается.Я выбираю местоположение из раскрывающегося списка, когда маркер выбора нового местоположения не отображается.

html-код: 

<select name="city" id="city" class="form-control input-lg">
           <option value="">Select city</option>
</select>

добавление данных из json: 

  function initialize() {
            map = new google.maps.Map(document.getElementById('map-canvas'), {
                zoom: 10,
                center: {lat: 10, lng: 10}
            });
            var marker = new google.maps.Marker({
                position: map.getCenter(),
                icon: {
                    path: google.maps.SymbolPath.CIRCLE,
                    scale: 10
                },
                draggable: true,
                map: map
            });
        }

        google.maps.event.addDomListener(window, 'load', initialize);

и при раскрытииДействие js: 

 $(document).on('change', '#state', function () {
                var state_id = $(this).val();

                    load_json_data1('state', state_id);

            });    

 function load_json_data1(id, parent_id)
                {
                    var lat = "";
                    var lang = "";
                    $.getJSON('1.json', function (data) {
                        $.each(data, function (key, value) {
                            if (value.id == parent_id)
                            {
                                lat = value.lat;
                                lang = value.lang;
                            }

                        });
                        var newzoom = 1 * 18,
                                newlat = 1 * lat,
                                newlng = 1 * lang;
                        map.setZoom(newzoom);
                        map.setCenter(new google.maps.LatLng(newlat, newlng));

                    });
                }

Мой код работает до конца и долго только маркер не отображается.

1 Ответ

0 голосов
/ 21 октября 2018

  1. Объявите marker вне функции initialize.

    var marker; function initialize() { map = new google.maps.Map(document.getElementById('map-canvas'), { zoom: 10, center: {lat: 10, lng: 10} }); marker = new google.maps.Marker({ position: map.getCenter(), icon: { path: google.maps.SymbolPath.CIRCLE, scale: 10 }, draggable: true, map: map }); }

  2. Измените положение marker in load_json_data функция.

    marker.setPosition(new google.maps.LatLng(newlat, newlng));

...