ライブWebサイトにアクセスして、問題がどのように発生したかを確認できます。
エラーを確認する手順は次のとおりです
- ライブWebサイトにアクセスします。
- ブラウザの位置追跡を有効にします。
- 地名の1つをクリックすると、新しいタブが開きます。Googleマップが表示され、URLパラメータに基づいてクリックした場所に地図が中央に配置されます。
問題は、ランダムに機能しない場合があり、地図を表示する代わりに無地の灰色の背景を表示していることです。更新しようとした場合、または地名をもう一度クリックした場合。マップが機能している可能性があります。ただし、突然ズームアウトすると、クラッシュします。マーカーをクリックするか、地図をドラッグする必要があります。そうすれば、問題なくズームアウトできます。
ブラウザの位置追跡をオフにしても、これらの問題はすべて発生しません。
それを試してみてください。
PS。パラメータの最後の2桁または3桁について心配する必要はありません。それはこの問題とは何の関係もありません、私はそれを数回テストしました)。コンソールログもエラーをスローしません。
これは、ブラウザの位置追跡が有効になっているときに関係する私のコードです。私の完全なコードはJSFiddleにあります。
function initialize() {
var myOptions = { zoom: 12, mapTypeId: google.maps.MapTypeId.ROADMAP };
map = new google.maps.Map(document.getElementById("map"), myOptions);
var infoWindow2 = new google.maps.InfoWindow({ content: '<div style="overflow:hidden;" id="currentInfoWindow"><p>You are here !!!</p></div>' });
// Try W3C Geolocation (Preferred)
if(navigator.geolocation) { // BEGIN IF USER ENABLE
browserSupportFlag = true;
navigator.geolocation.getCurrentPosition(function(position) { //getCurrentPosition
querystring = window.location.search.substr(1);
console.log(querystring);
element = querystring.split(",");
if (querystring) {
clickedLocation = new google.maps.LatLng(element[0],element[1]);
map.setCenter(clickedLocation);
map.setZoom(18);
} else {
initialLocation = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
}
//Set map center to be the user's location
map.setCenter(initialLocation);
//Place the marker of current position
var markerCurrent = new google.maps.Marker({
position: initialLocation,
map: map,
title:"You are here !!!",
icon : 'assets/frontend/images/yourmarker.png'
});
// Attaching a click event to the current marker
google.maps.event.addListener(markerCurrent, "click", function(e) {
infoWindow.close();
this.getMap().setCenter(this.getPosition());
map.setZoom(12);
infoWindow2.open(map, markerCurrent);
});
// IF NOT SUPPORT OR ENABLE >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
} // End getCurrentPosition
, function() { handleNoGeolocation(browserSupportFlag); });
} // END IF Browser doesn't support Geolocation
else {
//Other code here.
}