Googleマップはクリック時にデフォルトと別の場所を読み込みます

Question

ページ上にデフォルトの場所を読み込み、ユーザーがそのリンクをクリックすると変更しようとしています。私はウェブ上で見つけたスクリプトを探してみましたが、修正できませんでした。 私はそれを得るために非常に近いだと確信しているが、私は一週間=のためにしようとしている（ 誰かが私を助けていただけますか？=）

html 
<div class="container-fluid" style="padding: 0;"> 
    <div class="col-lg-12"> 
    <div class="col-lg-3 sidebarMap"> 
     <h3>Casa Central SFV</h3> 
     <p class="formInfo" style="border-bottom:0px;">Dirección: 
     <a class="openmap" role="button" data-id="Casa Central">Ver en mapa</a> 
     </p> 
     <h3>Oficinas Belén</h3> 
     <p class="formInfo" style="border-bottom:0px;">Dirección: 
     <a class="openmap" role="button" data-id="Oficina Belen">Ver en mapa</a> 
     </p> 
    </div> 

    <div class="col-lg-9" id="contactMap"> 
    </div> 
    </div> 

</div> 

JS

var map; 
var marker; 
var uluru; 

function initMap(longs, latts, markerTitle) { 
    uluru = new google.maps.LatLng(longs, latts); 
    // var uluru = {lat: -28.458342, lng: -65.770767}; 
    var map = new google.maps.Map(document.getElementById('contactMap'), { 
    zoom: 17, 
    center: uluru 
    }); 
    var image = 'img/contacto/icon-map.png'; 
    var marker = new google.maps.Marker({ 
    position: uluru, 
    map: map, 
    icon: image, 
    title: markerTitle, 
    animation: google.maps.Animation.DROP, 
    maxWidth: 200, 
    maxHeight: 200 
    }); 

    $('#mapModal').on('shown.bs.tab', function() { 
    google.maps.event.trigger(map, "resize"); 
    map.setCenter(uluru); 
    }); 
} 


// Start Map Modals 
$(document).ready(function() { 
    var myMapId = $(this).data('id'); 
    myMapId == "Casa Central"; 
    initMap(-28.458342, -65.770767, "Casa Central"); 
}); 

$(document).on("click", ".openmap", function() { 
    var myMapId = $(this).data('id'); 
    if (myMapId == "Casa Central") { 
    initMap(-28.458342, -65.770767, "Casa Central"); 
    } else if (myMapId == "Oficina Belen") { 
    initMap(-27.652671, -67.028263, "Oficina Belén"); 
    } 

}); 

CSS https://jsfiddle.net/Karsp/9z6dpk7j/

：私も私のバイオリンを行うことはできません

#contactMap { 
    height: 400px; 
    width: 75%; 
    float: right; 
    z-index: 10; 
} 

.sidebarMap { 
    position: absolute; 
    top: 0px; 
    left: 0; 
    z-index: 1000; 
    padding: 5px 15px 5px 25px; 
    overflow-x: hidden; 
    overflow-y: auto; 
    background-color: #FFF; 
} 

はD作品

ファイル内のすべてが正常に動作し、デフォルトでは最初の場所が読み込まれません。あなたのサイトで

Answer 1

私はinitMap()関数が2回呼び出されていることに気づいた。二回目は、https://maps.googleapis.com/maps/api/js?key=xyz&callback=initMapで述べcallbackから呼び出され

、$(document).ready()から

• 初めてが、ここでは、Googleのオブジェクトはまだ初期化されていません。 2番目のケースではGoogleが初期化されます。

GoogleマップAPIリファレンスをこのように変更してください：

https://maps.googleapis.com/maps/api/js?key=xyz&callback=initialize 

とコードから：

$(document).ready(function() { 
    var myMapId = $(this).data('id'); 
    myMapId == "Casa Central"; 
    initMap(-28.458342,-65.770767,"Casa Central"); 
}); 

へ：

function initialize() { 
    var myMapId = $(this).data('id'); 
    myMapId == "Casa Central"; 
    initMap(-28.458342,-65.770767,"Casa Central"); 
}; 

PS：初期化（）関数グローバルにアクセスできる必要があります