2015-09-01 108 views
1

你好我困住了一個問題。我正嘗試在Java腳本的幫助下獲取Google地圖中的當前位置。這是一個編程課程,我不允許硬編碼或所謂的靜態它必須適用於每個位置。這裏是我的代碼:Google Maps API JavaScript當前位置

var index = 0; 

var yCoords = "dummy"; 

var contentstring = []; 
var regionlocation = []; 
var markers = []; 
var iterator = 0; 
var areaiterator = 0; 
var map; 
var infowindow = []; 
geocoder = new google.maps.Geocoder(); 

$(document).ready(function() { 
    setTimeout(function() { initialize(); }, 400); 
}); 

function initialize() { 
    infowindow = []; 
    markers = []; 
    GetValues(); 
    iterator = 0; 
    areaiterator = 0; 
    region = new google.maps.LatLng(regionlocation[areaiterator].split(',')[0], regionlocation[areaiterator].split(',')[1]); 
    map = new google.maps.Map(document.getElementById("Map"), { 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: region, 
    }); 
    drop(); 
} 

function GetValues() { 

    //Get the Latitude and Longitude of a Point site : http://itouchmap.com/latlong.html 
    contentstring[index] = "BTH Karlshamn<br><a target='_blank' href='http://edu.bth.se/utbildning/utb_program.asp?PtKod=MEGWU15h'>Webbutveckling</a><br><a href='http://www.bth.se/dite'>DITE</a>"; 
    regionlocation[index] = '56.164226, 14.866160'; 

    index++; 

    contentstring[index] = "Campus Gräsvik<br><a href='http://www.bth.se'>BTH</a>"; 
    regionlocation[index] = '56.182034, 15.591874'; 

    index++; 

    contentstring[index] = "Mattias Schertell<br><img src='https://pbs.twimg.com/profile_images/1896369837/redDSC_8716.jpg' width='20px' heught='25px'>"; 
    regionlocation[index] = "56.258169, 15.630122"; 

    index++; 
    contentstring[index] = "edLaika's Palace<br><img src='https://scontent-ams3-1.xx.fbcdn.net/hphotos-xtf1/v/t1.0-9/11831661_10206060455982308_3558780248897683245_n.jpg?oh=4c0d53eaee2f1f2430625279e5d38fa7&oe=56363AD0' width='20px' heught='25px'>"; 
    regionlocation[index] = "56.261976, 14.764781"; 

    index++; 


} 


function drop() { 
    for (var i = 0; i < contentstring.length; i++) { 
     setTimeout(function() { 
      addMarker(); 
     }, 800); 
    } 
} 

function addMarker() { 
    var address = contentstring[areaiterator]; 
    var icons = 'http://maps.google.com/mapfiles/ms/icons/red-dot.png'; 
    var templat = regionlocation[areaiterator].split(',')[0]; 
    var templong = regionlocation[areaiterator].split(',')[1]; 
    var temp_latLng = new google.maps.LatLng(templat, templong); 
    markers.push(new google.maps.Marker(
    { 
     position: temp_latLng, 
     map: map, 
     icon: icons, 
     draggable: false 
    })); 
    iterator++; 
    info(iterator); 
    areaiterator++; 
} 

function info(i) { 
    infowindow[i] = new google.maps.InfoWindow({ 
     content: contentstring[i - 1] 
    }); 
    infowindow[i].content = contentstring[i - 1]; 
    google.maps.event.addListener(markers[i - 1], 'click', function() { 
     for (var j = 1; j < contentstring.length + 1; j++) { 
      infowindow[j].close(); 
     } 
     infowindow[i].open(map, markers[i - 1]); 
    }); 
} 

任何建議,我是新來的JS。謝謝 它應該得到並顯示地圖上的當前位置。我在Stack Overflow中嘗試過一些例子,他們不工作。

回答

2

您可以使用HTML5地理定位對象,例如。

HTML

<div id="Map" style="width:600px;height:400px"></div> 

<button onclick="addMyPosition()">Add my position</button> 

JS

function addMyPosition(){ 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(showPosition, showError); 
    } else { 
     alert("Browser doesn't support Geolocation"); 
    } 
} 
function showPosition(position) { 
    contentstring.push("Your current position"); 
    regionlocation.push(position.coords.latitude + ", " + position.coords.longitude); 
    addMarker(); 
    drop(); 
} 
function showError(error) { 
    var Error = ""; 
    switch(error.code) { 
     case error.PERMISSION_DENIED: 
      Error = "User denied the request for Geolocation." 
      break; 
     case error.POSITION_UNAVAILABLE: 
      Error = "Location information is unavailable." 
      break; 
     case error.TIMEOUT: 
      Error = "The request to get user location timed out." 
      break; 
     case error.UNKNOWN_ERROR: 
      Error = "An unknown error occurred." 
      break; 
    } 
    alert(Error); 
} 

JSFiddle demo

相關問題