モーダルのGoogleマップは中央に配置されていません

Question

私はモーダルでGoogleマップを使用しています。しかし、それは私が望むものではありません。結果は私が欲しいものではありません

<script> 
     function initMap() { 

     var lattp = <?php echo json_encode($lattp);?>; 
     var lngtp = <?php echo json_encode($lngtp);?>; 
     var zoomtp = <?php echo json_encode($zoomtp);?>; 
     var tp = {lat: JSON.parse(lattp), lng: JSON.parse(lngtp)}; 

     var latrest = <?php echo json_encode($latrest);?>; 
     var lngrest = <?php echo json_encode($lngrest);?>; 
     var rest = {lat: JSON.parse(latrest), lng: JSON.parse(lngrest)}; 

     var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: JSON.parse(zoomtp), 
      center: tp 
     }); 

     var marker = new google.maps.Marker({ 
      position: rest, 
      map: map 
     });} 
    $('#myModal').on('shown.bs.modal', function() { 
     google.maps.event.trigger(map, "resize"); 
     map.setCenter(tp); 
    }); 

    </script> 

：

私は次のスクリプトを使用します。あなたはそれをチェックすることができます。https://www.checkjevoeding.be/uitstap/tp_rest_dishes.php?id=9

ちょうどそれが法外にアクセスできないようあなたがinitMap()方法のうち、mapとtpを移動しなければならない「Aanduidingのparkplan」

Answer 1

をクリックしてください。

<script> 
    var map, tp; 
    function initMap() { 
    var lattp = <?php echo json_encode($lattp);?>; 
    var lngtp = <?php echo json_encode($lngtp);?>; 
    var zoomtp = <?php echo json_encode($zoomtp);?>; 
    tp = {lat: JSON.parse(lattp), lng: JSON.parse(lngtp)}; 

    var latrest = <?php echo json_encode($latrest);?>; 
    var lngrest = <?php echo json_encode($lngrest);?>; 
    var rest = {lat: JSON.parse(latrest), lng: JSON.parse(lngrest)}; 

    map = new google.maps.Map(document.getElementById('map'), { 
     zoom: JSON.parse(zoomtp), 
     center: tp 
    }); 

    var marker = new google.maps.Marker({ 
     position: rest, 
     map: map 
    }); 
    } 
    $('#myModal').on('shown.bs.modal', function() { 
    google.maps.event.trigger(map, "resize"); 
    map.setCenter(tp); 
    }); 

</script>