集成Google Maps以获取角度2中的当前位置?

残酷的引擎

如何在Angle 2中使用Google Maps API获取当前位置?我已经在应用程序中包含了Google地图。现在,我想捕获当前位置,并附加了我的代码。请帮我

import { Component,OnInit,ElementRef,ViewChild} from '@angular/core';

// import {searchComponent} from './getLocation.Component';
declare var google: any;

@Component({
    selector: 'map',
    moduleId:module.id,
    templateUrl:'geoCodeMap.component.html',
})

export class mapComponent{
    searchBox:any;
    map:any;
    marker:any;
    accuracy:any;
    @ViewChild('mapDiv') mapDiv:ElementRef;
    options={
       center:{
                lat : 17.555,
                lng : 78.555
            },
    zoom:15,
    mapTypeControl:false,
    MapTypeId: google.maps.MapTypeId.TERRAIN,

    };


    ngAfterViewInit(){
        this.map=new google.maps.Map(this.mapDiv.nativeElement,this.options); 
        this.getLocation();
        this.onSearchResultSelect();
    }      
    getLocation() 
    {
        if (navigator.geolocation) {
            var self = this;
            navigator.geolocation.getCurrentPosition(function(response){
                self.showPosition(response, self);
            }, function() {
            alert("Unable to get GPS Location");
            }, {
            enableHighAccuracy : true
            });
        }
        else {
        alert("Geolocation is not supported by this browser.");
        }
    }



    showPosition(position:any, self:any) {
        var icon = {
        url: "images/home.png",
        scaledSize: new google.maps.Size(30, 30), // scaled size
        origin: new google.maps.Point(0,0), // origin
        anchor: new google.maps.Point(0, 0)
    };
    var myLatLng = new google.maps.LatLng(position.coords.latitude,
            position.coords.longitude);
    self.marker = new google.maps.Marker({
        position : myLatLng,
        map:self.map,
        icon:icon,
        draggable : true,
        title : 'Mark Home'
    });

    self.map.panTo(myLatLng);
    self.accuracy = position.coords.accuracy;

    google.maps.event.addListener(self.map, 'dragstart', function() {
    });  
    google.maps.event.addListener(self.map, 'dragend', function() {
    });


    google.maps.event.addListener(self.map, 'center_changed', function() {
    });



    }

 onSearchResultSelect() {
             var self=this;
         var searchMarker:any;
    var input = document.getElementById('pac-input');
    this.searchBox = new google.maps.places.SearchBox(input);
    var button = document.getElementById('button');
    button.onclick = function() {
    input.value='';
    input.focus();
        var places = this.searchBox.getPlaces();

        if (places.length == 0) {
            return;
        }
        if (searchMarker != null) {
            searchMarker.setMap(null);
        }

        var empGeocode = self.map.getCenter().lat() + "," + self.map.getCenter().lng();
        var place = places[0];

        self.map.setCenter(place.geometry.location);
        //container.html(html);
     }
    }

}

当我检查浏览器的控制台时,出现“ map”未定义的错误:(-已解决。

编辑:我现在要搜索特定的位置。我已经提到了Google Maps API文档。但是我没有结果。任何想法我的代码必须更改吗?

阿米特

考虑使用google.maps.places搜索。

在此处查看更多信息:https : //developers.google.com/maps/documentation/javascript/places

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Google Maps iOS SDK,获取用户的当前位置

如何不断从Google Maps Android中的当前位置检测附近的标记位置?

Flutter iOS - 在加载 Google Maps 小部件之前无法获取 initialCameraPosition 的当前位置

Ionic 3 Google Maps集成

集成Google Maps搜索表单

将我的当前位置发送到Google Maps中

我想每30秒触发一次Google Maps API中的当前位置

GOOGLE MAPS V2-获取当前用户位置

在google_maps_flutter中获取相机当前位置的问题

如何在react-google-maps中获取地图的当前缩放[getZoom()]?

在vue.js中集成Google Maps

无法在IBM Worklight上集成Google Maps

将Google Maps MarkerClusterer与infowindow集成

Google Maps API 集成调用需要许可

Android中的Google Pay API集成

SwiftUI中的Google AdMob标语事件集成

我的当前位置显示了另一个位置,Google Maps-Xcode

Android Studio集成了Google Maps API v2

Google Maps集成中的“未定义rd”错误

如何将Google Maps集成到Android App中

将arcGIS地图集成到Google Maps中

如何在 Google Maps iOS SDK 中获取当前相机位置的标记数据?

Google Directions API:将当前步骤JSON对象获取到Android上的当前位置

如何在Ionic 2应用程序中自动更新Google地图上的当前位置

无法在Google Maps iOS SDK上获取当前位置(GPS)

角度Google Maps获取地图边界内的所有位置

将Google Maps VueJS组件(vue2-google-maps)集成到Laravel刀片视图中

使用当前活动进行Google云端硬盘集成

google 註冊的 aws-amplify 角度集成問題