2014-11-28 2 views
0

모든 것이 작동하지만 마지막 버튼 (GPS)을 사용하고 싶습니다. (미안하지만 이미지를 게시 할 수 없습니다.) 내가 현재 설정 한 것처럼지도.버튼으로 내 위치에 Google지도 API 센터

이 방법의 예는 사용자가 웹 페이지를 열어서지도 주위를 스크롤하여 가능하면 위성보기로 변경 한 다음 위의 버튼 (또는 해당 버튼을 클릭)을 클릭하고 지도가 다시 그들의 위치로 이동합니다. 이것이 가능한지 확실하지 않지만, 스스로 알아낼 수는 없습니다. 어떤 도움이라도 대단히 감사합니다. 다음은 내 프랑켄슈타인지도에 대한 링크입니다. http://deepfrogphoto.com/Brett-Pelletier-Photography/Links/maps/wasatch-ski-map-mobile.htm

var map, GeoMarker;  

    function toggleLayer(this_layer){ 
    if(this_layer.getMap()) { 
    this_layer.setMap(null) 
    } else { 
    this_layer.setMap(map);}} 

     function initialize() { 
    var mapOptions = { 
     zoom: 20, 
     center: new google.maps.LatLng(40.563855, -111.675426), 
     mapTypeId: google.maps.MapTypeId.TERRAIN 
    }; 

    map = new google.maps.Map(document.getElementById('map_canvas'), 
     mapOptions); 

    GeoMarker = new GeolocationMarker(); 
    GeoMarker.setCircleOptions({fillColor: '#808080'}); 

    google.maps.event.addListenerOnce(GeoMarker, 'position_changed', function() { 
     map.setCenter(this.getPosition()); 
     map.fitBounds(this.getBounds()); 
    }); 

    google.maps.event.addListener(GeoMarker, 'geolocation_error', function(e) { 
     alert('There was an error obtaining your position. Message: ' + e.message); 
    }); 

    GeoMarker.setMap(map); 

    trafficLayer = new google.maps.TrafficLayer(); 
     trafficLayer.setMap(map); 

    layer1 = new google.maps.FusionTablesLayer({ 
    map: map, 
    heatmap: { enabled: false }, 
    query: { 
    select: "skilines", 
    from: "1R5pCEyNN74N8Dt9MkfNXA6A9D1HbQESzOR1fYFa7", 
    where: "" 
    }, 
    options: { 
    styleId: 2, 
    templateId: 2 
    } 
}); 

layer2 = new google.maps.FusionTablesLayer({ 
    map: map, 
    heatmap: { enabled: false }, 
    query: { 
    select: "resorts", 
    from: "19iu58FDFcBIZZ-wU1iZcf89AI5ABDJ7YTv355su5", 
    where: "" 
    }, 
    options: { 
    styleId: 2, 
    templateId: 2 
    } 
});  

layer3 = new google.maps.FusionTablesLayer({ 
    map: map, 
    heatmap: { enabled: false }, 
    query: { 
    select: "summerhiking", 
    from: "1t1XNnG7J7Zu1p5mIUpm6qIGVYwzhkCgPy_je0IKr", 
    where: "" 
    }, 
    options: { 
    styleId: 2, 
    templateId: 2 
    } 
});  

layer4 = new google.maps.KmlLayer('URL-to-KML.kml', 
       { 
        suppressInfoWindows: false, 
        map: map, 
        preserveViewport: true 
       });   
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 

    if(!navigator.geolocation) { 
    alert('Your browser does not support geolocation');} 

//]]> 
</script> 

<title>Wasatch Map by deepfrogphoto</title> 
</head> 

<body> 
<b>Wasatch Map by deepfrogphoto -</b> 

<form> 

<button onclick="myFunction()">Center Map on My Location</button> 

</form> 

<div id="map_canvas"></div> 
</body> 
+0

질문에 (관련) 코드를 게시하십시오. 페이지가 "고정"되면 질문에 더 이상 컨텍스트가 없습니다. – geocodezip

+0

좌표를 알고 계시거나 사용자 위치를 자동으로 감지하고 싶으십니까? – Pixelomo

+0

미안하지만, 나는 신인이라면 아주 많이 말했다. 나는 관련 코드가 무엇인지 잘 모르겠다. 그것은 약간의 잘못된 점이 모두 그것을 망쳐 놓기 때문에 내 마음 속에서 모두 관련이있다. 나는 사람들이 내 페이지 링크를보고, 코드를 잡고, 내가 게시 한 방식대로 내 질문에 도움을 줄 수 있다고 생각했다. – Brett

답변

2

온 클릭 이벤트 리스너 버튼을 추가

<button onclick="myFunction()">Center</button> 

는 사용자 위치

function myFunction(){ 
     Map.panTo(UserCords);//UserCords = user current latitude, longitude. I suppose you have them!!! 
} 

EDIT

function myFunction(){ 
    if (navigator.geolocation){ 
     navigator.geolocation.getCurrentPosition(getPosition,showError); 
    } 
    else{ 
      alert("Geolocation is not supported by this browser."); 
    } 
} 

function getPosition(position) 
    { 
     UserLatitude = position.coords.latitude; 
     UserLongitude = position.coords.longitude; 
     showPosition(UserLatitude, UserLongitude); 
    } 

function showPosition(userLatitude, userLongitude){ 
     lat= userLatitude; 
     lon= userLongitude; 
     latlon=new google.maps.LatLng(lat, lon); 
     YourMap.panTo(latlon); 
} 

function showError(error) 
    { 
    switch(error.code) 
    { 
    case error.PERMISSION_DENIED: 
     alert("User denied the request for Geolocation."); 
     break; 
    case error.POSITION_UNAVAILABLE: 
     alert("Location information is unavailable.") 
     break; 
    case error.TIMEOUT: 
     alert("The request to get user location timed out.") 
     break; 
    case error.UNKNOWN_ERROR: 
     alert("An unknown error occurred.") 
     break; 
    } 
    } 
0지도 중앙하도록하여 myFunction 만들
+0

덕분에 이것이 내가 필요로하는 것 같다. 그러나 나는 당신이 무엇을 의미하는지 모른다. 당신은 그들을 가지고 있다고 가정합니다. ... 내 페이지가로드 될 때, 나는 지오 로케이션 (파란 점)이 작동하지만,이 UserCord에 대해서는 확신하지 못합니다. '나는 가지고 있습니다'라고 가정합니다. 그렇지 않으면 작동하지 않을 것입니다. 이것의 무엇이든지 ... – Brett

+0

그것은 당신을 위해 작동합니까? 나는 그 전의 UserCords = 새로운 google.maps.LatLng (40.563855, -111.675426) – gerti

+0

을 아직 의미하지 않았다. 나는 버튼 코드를 추가했다. .. 그리고 그것을 볼 수있다 .. 그리고 함수 코드를 추가했지만 나에게 효과가 없다. .... 내가 그것을 어디에 놓을 지, 아니면 UserCords라는 단어가 될 수있다. 어쩌면 내가 가지고 있지 않을 수도있다. 아니면 다른 이름으로 불려지 는가? – Brett

관련 문제