角度2でGoogleマップAPIを使用して現在地を取得するにはどうすればよいですか?私は自分のアプリケーションにGoogleマップを含めました。今私は私のコードを添付している現在の場所をキャプチャしたい。 。私は、ブラウザのコンソールを:(チェックしたときに「マップ」は未定義として、私はエラーを取得する私にGoogleマップを統合して現在の位置を角度2に取得しますか?
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);
}
}
}
を助けてください - 解決
編集:私は今、特定の場所を検索したい私はしましたGoogleマップのAPIドキュメントを参照しかし、私は私のコードは
その行にはどのようなエラーが表示されますか? –
ブラウザから現在の場所を取得する場合は、Googleマップを統合する必要はありません。ここには、この目的のために利用できるオープンソースのコンポーネントがあります。https://github.com/tixdo/ng2-location – Satendra
@AlexanderCiesielski私はライン上でエラーが発生しました:map:this.map。だから私はselfという名前の変数にこれを割り当てました。今は働いている。 – CruelEngine