Question

1 - 显示当前位置 - 已完成

2 - 显示附近的学校/银行 - 完成

以上两项是我的任务，我处理得非常好。但问题是当我搜索附近的学校或银行时，当前的位置地图标记消失了。为什么会这样？

    app.controller('main', function ($scope) {
    var map, infoWindow;

    $scope.initLocation = function () {
        // map = new google.maps.Map(document.getElementById('map'), {
        //     center: {
        //         lat: -34.397,
        //         lng: 150.644
        //     },
        //     zoom: 15
        // });

        //infoWindow = new google.maps.InfoWindow;
        debugger;
        if (navigator.geolocation) {

            navigator.geolocation.getCurrentPosition(function (position) {
                var pos = {
                    lat: position.coords.latitude,
                    lng: position.coords.longitude
                };

                $scope.position_lat = position.coords.latitude;
                $scope.position_long = position.coords.longitude;

                var uluru = { lat: $scope.position_lat, lng: $scope.position_long };
                var map = new google.maps.Map(document.getElementById('map'), {
                    zoom: 12,
                    center: uluru
                });
                var marker = new google.maps.Marker({
                    position: uluru,
                    map: map
                });


            }, function () {
                handleLocationError(true, infoWindow, map.getCenter());
            });
        } else {
            // Browser doesn 't support Geolocation
            handleLocationError(false, infoWindow, map.getCenter());
        }
    }

    function handleLocationError(browserHasGeolocation, infoWindow, pos) {
        infoWindow.setPosition(pos);
        infoWindow.setContent(browserHasGeolocation ?
            'Error: The Geolocation service failed.' :
            'Error: Your browser doesn\'t support geolocation.');
        infoWindow.open(map);
    }

    //  var map;
    // var infowindow;

    function initMap(place_name) {
        var pyrmont = { lat: $scope.position_lat, lng: $scope.position_long };

        map = new google.maps.Map(document.getElementById('map'), {
            center: pyrmont,
            zoom: 15
        });

        infowindow = new google.maps.InfoWindow();
        var service = new google.maps.places.PlacesService(map);
        service.nearbySearch({
            location: pyrmont,
            radius: 25000,
            type: [place_name]
        }, callback);
    }

    function callback(results, status) {
        console.log(results);
        if (status === google.maps.places.PlacesServiceStatus.OK) {
            for (var i = 0; i < results.length; i++) {
                createMarker(results[i]);
            }
        }
    }

    function createMarker(place) {
        var placeLoc = place.geometry.location;
        var marker = new google.maps.Marker({
            map: map,
            position: place.geometry.location
        });

        google.maps.event.addListener(marker, 'click', function () {
            infowindow.setContent(place.name);
            infowindow.open(map, this);
        });
    }

    $scope.show_places = function (place_name) {
        initMap(place_name);
    }   
});

<body ng-app="starter">

    <ion-pane>
        <ion-header-bar class="bar-stable">
            <h1 class="title">Location Finder</h1>
        </ion-header-bar>
        <ion-nav-view></ion-nav-view>

        <div class="bar bar-footer bar-assertive" ng-controller="main">
            <div class="button-bar">
                <button class="button button-positive" ng-click="show_places('bank')">Banks</button>
                <button class="button button-energized " ng-click="show_places('school')">Schools</button>
                <button class="button button-positive " ng-click="initLocation() ">Find me</button>
            </div>
        </div>
    </ion-pane>
</body>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=mykey&libraries=places "></script>

我做错了什么，最后我想计算当前位置与点击后搜索结果之间的距离。

Answer 1

标记消失，因为当show_places函数每次都创建一个新的地图时，会导致所有内容重新初始化。相反，地图应该只初始化一次，您应该根据需要使用该地图实例添加和删除标记。

Web - 当点击搜索附近的地方时，当前位置消失

1 个答案: