Google지도 자바 스크립트를 사용하여 Geolocation 및 마커 결합

Question

현재 위치를 표시하고 도시에 마커를 표시하는지도를 만들려고합니다. 그러면 근처에 표식이 있는지 확인할 수 있습니다.

현재 코드를 작성해야하며이를 결합해야합니다. 하지만 그렇게하면 코드가 더 이상 작동하지 않습니다. 누군가 그 두 JS를 결합하는 법을 알고 있습니까? 그렇지 않은 경우이 작업을 수행 할 다른 방법이 있습니까?

이

은 위치 정보에 대한 JS입니다 :

function initMap() 
var map = new google.maps.Map(document.getElementById('map'), { 
center: {lat: -34.397, lng: 150.644}, 
zoom: 14, 
}); 
var infoWindow = new google.maps.InfoWindow({map: map}); 
if (navigator.geolocation) { 
navigator.geolocation.getCurrentPosition(function(position) { 
    var pos = { 
    lat: position.coords.latitude, 
    lng: position.coords.longitude 
    }; 

    infoWindow.setPosition(pos); 
    infoWindow.setContent('Location found.'); 
    map.setCenter(pos); 
}, 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.'); 
} 

그리고 이것은 내가 마커을 위해 만든 한 JS 코드 :

google.maps.event.addDomListener(window, 'load', initialize); 
var map; 
var currentPage = 'mapA'; 
var markers = [ 
['Thuis',52.2203713,6.90032999999994], 
['Bommelstein',52.22254299999999,6.911623800000029], 
['Saxion', 52.21976009999999,6.889364500000056], 
['Kroeg', 52.2206085,6.896547300000066], 
['t Gat', 52.2211657,6.895848999999998], 
['studieruimte de Bul', 52.22101940903001,6.8924690438436755] 
]; 
function initialize() { 
var mapOptions = { 
    zoom: 14, 
    disableDoubleClickZoom: true, 
    draggable: true, 
    panControl: false, 
    scrollwheel: true, 
    zoomControl: true, 
    streetViewControl: false, 
    overviewMapControl: false, 
    mapTypeControl: false, 
    center: new google.maps.LatLng(51.489031, 7.039671) 
}; 
map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions); 

setMarkers();}function setMarkers(){ 
for (i = 0; i < markers.length; i++) { 
    var post = new google.maps.LatLng(markers[i][1], markers[i][2]); 
    var marker = new google.maps.Marker({ 
     position: post, 
     map: map 
    }); 

    var infowindow = new google.maps.InfoWindow({ 
     content: markers[i][0] 
    }); 

    infowindow.open(map,marker); 
} 
} 

Answer 1

내가 실제로 samething 일하고 있었다 몇 분 전까지 같은 문제. 나는 지리적 위치 조건을 시작하여지도의 대상을 선언하기 전에 그 위치를 찾았고 그것은 나를 위해 일했습니다. 여기에 당신과 비슷한 내 간단한 코드는 다음과 같습니다

행운의

function initMap() { 
    // Try HTML5 geolocation. 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(function(position) { 
      var currentpos = { 
       lat: position.coords.latitude, 
       lng: position.coords.longitude 
      }; 
      var map = new google.maps.Map(document.getElementById('map'), { 
       center: currentpos, 
       zoom: 14, 
      }); 

      var contentString = 'I found you'; 
      var infowindow = new google.maps.InfoWindow({ 
       content: contentString 
      }); 

      var marker = new google.maps.Marker({ 
       position: pos, 
       map: map, 
       title: 'marker with infoWindow' 
      }); 
      marker.addListener('click', function() { 
       infowindow.open(map, marker); 
      }); 
     }, 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.'); 
} 

최저

의