Google マップの使用中に特有の問題が発生しています。DB に保存されているお店のリスト (緯度と経度を含む) を使用して、「最寄りの場所を検索」機能を設定しました。ユーザーが住所を投稿すると、それをジオコーディングし、マップ上で緑色のアイコンとしてマークします。Haversine 式を使用して、入力された緯度と経度に基づいて最も近い 10 の場所を取得します。
次に、すべての場所を html テーブルに表示し、適切な情報ウィンドウを使用して、Google マップに相対マーカーを配置します。
すべてがローカルで正常に動作しますが、実稼働サーバーにアップロードするとすべてが機能しますが、マップは機能します: テーブルにデータが入力され、距離が正しく計算され、ソース コード (以下を参照) はすべての変数が正しく解釈されたことを示しますが、マップは完全にズームされ始めます太平洋のどこか(イタリアを含む)の中心にあるので、ズームインしているので、何かを見る前にマウスホイールをたくさん回す必要があります.
マーカーは、存在しない緑色のものを除いて、ほぼ正しい位置に表示されます。さらに、マーカーをクリックすると、ローカルで発生するようにマーカーの真上ではなく、マーカーの左から 30 ピクセルまたは 40 ピクセルの位置から情報ウィンドウが開始されます。
コンソールにエラーは表示されず、生成されたソース コードはローカル バージョンと製品バージョンでまったく同じですが、この奇妙な動作が発生します。
何が起こっているのかわかりません。グーグルで検索してみましたが、似たようなものが見つかりません。それが価値がある場合、本番サーバーは Linux マシン、php 5.3.2 であり、Linux マシンを示す「第 3 レベル」にあります。つまり、URL はhttp://lnx.mydomain.com/のようになります。
誰が何が起こっているのか知っていますか?
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=[myapikey]&sensor=false&language=it"></script>
<script>
var locations = [
['location1', 45.4592775, 9.1599699, ' PIAZZA VESUVIO 14, 20144'],
['location2', 45.4534901, 9.170425, ' P.LE STAZIONE PORTA GENOVA 5 / 3,']
];
var infowindow = new google.maps.InfoWindow();
var map;
function initialize() {
var mapOptions = {
zoom: 10,
center: new google.maps.LatLng(45,4510239, 9,1606903),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('mappa'),mapOptions);
var startMarker = new google.maps.Marker({
position: new google.maps.LatLng(45,4510239, 9,1606903),
map: map,
title: 'user inserted address here'
});
google.maps.event.addListener(startMarker, 'click', (function(startMarker){
return function(){
infowindow.setContent('user inserted address here');
infowindow.open(map, startMarker);
}
})(startMarker));
startMarker.setIcon('http://maps.google.com/mapfiles/ms/icons/green-dot.png');
var marker;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map,
title: locations[i][0],
animation: google.maps.Animation.DROP,
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent('<div class="default-text">'+locations[i][0]+'<br /><br />'+locations[i][3]+'</div>');
infowindow.open(map, marker);
}
})(marker, i));
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>