2017-09-12 1 views
0

저는 lng와 lat를 추가하는 형식의 구성 요소를 가지고 있습니다. 내 기본 구성 요소는 OnInit에서지도를 초기화하는 데 사용합니다. 지도에 새로운 마커를 동적으로 추가하려면 어떻게해야합니까? 지도Google지도 angular2에 마커를 추가하는 방법은 무엇입니까?

내 구성 요소 :

import { Component, OnInit, Input } from '@angular/core'; 
import { PartyService } from './services/party.service'; 
import { Party } from './classes/party'; 
declare let google: any; 
declare let map: any; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent implements OnInit { 
    parties: Party[] = []; 
    party_location: Location[] = []; 

    constructor(private partyService: PartyService) { } 

    ngOnInit() { 
    map = new google.maps.Map(document.getElementById('map'), { 
     center: { lat: -25.363, lng: 131.044 }, 
     scrollwheel: true, 
     zoom: 16 
    }); 



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

    infoWindow.setPosition(pos); 
    infoWindow.setContent('This is you.'); 
    infoWindow.open(map); 
    map.setCenter(pos); 
    }); 
} 

let infoWindow = new google.maps.InfoWindow; 

} 
} 

답변

0

의이 새로운 coordinates했습니다 가정 해 봅시다, 다음은 기존의 코드에서지도에

 let marker = new google.maps.Marker({ 
     position: {lat:<yourLatitude>,lng:<yourLong>} 
     map: map 

     }); 

새로운 마커를 추가 할 것입니다, 당신은 수정할 수 있습니다 :

if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(function(position) { 
    let pos = { 
     lat: position.coords.latitude, 
     lng: position.coords.longitude 
    }; 
    let marker = new google.maps.Marker({ 
     position: {lat:<yourLatitude>,lng:<yourLong>} 
     map: map 

     }); 
    infoWindow.setPosition(pos); 
    infoWindow.setContent('This is you.'); 
    infoWindow.open(map); 
    map.setCenter(pos); 
    }); 
}