Initialize Issue on modal

[deshario]

I tried to render view in bootstrap modal ..... And when I modal open first time ... there is some issue with maps initialization ... Maps can't load properly but after first time everythings seems to be fine. It only happens at first time when open modal. How can i load maps into modal properly at first time ?

First Time

Second Time

** INDEX **
return Html::a("<span class='fa fa-search-plus'></span>", ['view', 'id' => $model->branch_id, 'rending' => 'ajax'], ['class' => 'btn btn-xs btn-primary view_branch', ]);

$this->registerJs("

$(function(){
    $('.view_branch').click(function (event){
        $.get($(this).attr('href'), function(data){
            $('#branch_modal').modal('show').find('#modalContent').html(data) 
            $('#branch_modal').modal('show').find('#modal_title').html('55')
       });
       return false;
    }); 
});

");

** CONTROLLER **

public function actionView($id,$rending = null){
if($rending === "ajax"){
return $this->renderAjax('view', [
'model' => $this->findModel($id),
]);
}else{
return $this->render('view', [
'model' => $this->findModel($id),
]);
}
}

** VIEW **

<?php
list($latitude, $longitude) = explode(',', '18.802904228311647,100.81436937585454');
$coord = new LatLng(['lat' => $latitude, 'lng' => $longitude]);
$map = new Map([
    'center' => $coord,
    'zoom' => 16,
    'width' => '100%',
    'height' => '200',
    //'mapTypeId' => \dosamigos\google\maps\MapTypeId::SATELLITE,
]);
$marker = new Marker([
    'position' => $coord,
    'title' => 'BRANCH',
]);
// Provide a shared InfoWindow to the marker
$marker->attachInfoWindow(
    new InfoWindow([
        'content' => 'MAP'
    ])
);
// Add marker to the map
$map->addOverlay($marker);
echo $map->display();
?>

<?= DetailView::widget([
    'model' => $model,
    'attributes' => [
        'id',
        'name',
        'place_type',
        'status',
    ],
]) ?>