面对角2谷歌地图的困难

时间:2017-01-13 05:37:36

标签: angular

我使用Sebastian示例创建了Google地图。我可以加载地图。但我的要求是搜索我在搜索框中键入的地方,然后将标记放在地图中。我也可以搜索这个地方,但无法在地图中找到它。如果我滚动地图标记将自动出现。以下是我的代码。如果您知道其他任何方式或任何其他示例,请建议我。

            <div class="fieldMap">
                    <sebm-google-map 
                    [latitude]="lat"
                    [longitude]="lng"
                    [zoom]="zoom"
                    [disableDefaultUI]="true"
                    [zoomControl]="true"
                    [disableDefaultUI]="false"
                    (mapClick)="mapClicked($event)">

                    <sebm-google-map-marker 
                    *ngFor="let m of markers; let i = index"
                    [latitude]="m.lat"
                    [longitude]="m.lng"
                    [label]="m.label">
                    </sebm-google-map-marker>                   
            </sebm-google-map> 

脚本部分是

  getAddress(place:Object) { 
    this.markers = [];
    var address = this.step1Data.map_address;
    if (!address) return false;
    var geocoder = new google.maps.Geocoder();
    var that = this;

    geocoder.geocode({ 'address': address }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var location = results[0].geometry.location;
            that.lat =  location.lat();
            that.lng = location.lng();
            that.markers.push({
                lat: that.lat,
                lng: that.lng,
                label: 'A',
                draggable: false
            })
        } 
    });
}

1 个答案:

答案 0 :(得分:0)

问题是超时。如果我稍后使用setTimeout推送coords,它将正常工作。

geocoder.geocode({ 'address': address }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var location = results[0].geometry.location;
            that.lat = location.lat();
            that.lng = location.lng();
        } else {
            that.step1["gmapError"] = "Geocode was not successful for     the following reason: " + status;
        }
    });

    setTimeout(() => {
            this.markers.push({
                lat: that.lat,
                lng: that.lng,
                label: 'A',
                draggable: false
            });
    }, 100);