Javascript Don'；t使用Gmaps.js显示谷歌地图

我想在我的we页面中使用谷歌地图。我用过它。我的代码如下：

  <div class="row col-md-10 col-md-offset-1">
    <br>
    <br>
    <br>
    <label for="address">{{$MapLabel}}</label>

    <div class="span11">
        <div id="map"></div>
    </div>
    <br>
    <br>
    <div class="row">
        <div class="col-md-4">
            <button id="button_Google_Serach" type="button" class="btn btn-info" >جستجو</button>
        </div>
        <div class="col-md-8">
            <input  type="text" id="address_with_google" name="address_with_google" placeholder="{{$SearchLabel}}" class="form-control" />
        </div>
    </div>
    <input type="text" hidden id="latGoogleMap">
    <input type="text" hidden id="lngGoogleMap">
    <br>
</div>

但当我删除该代码时，我看到：

---

我必须怎么做？

使用谷歌地图的高度和宽度：

 map = new GMaps({
        el: '#map',
        lat: -12.043333,
        lng: -77.028333,
        width: '95%',
        height: '350px',
        zoom: 16,
        click: function(e){

          map.removeMarkers();

          map.addMarker({
            lat: e.latLng.lat(),
            lng: e.latLng.lng(),
            draggable: true
          });

          //Set google lat in hidden input
          $('#latGoogleMap').val( e.latLng.lat());
          //Set google lng in hidden input
          $('#lngGoogleMap').val(e.latLng.lng());

        }

      });

---

查看您的控制台日志并发布您的错误，我还认为您必须立即从google获得api代码才能使用java脚本？@vico，控制台中没有任何错误。为什么不试试实际的google地图脚本呢？可能可以在网上找到大量的例子，而不是这个脚本。。如何指定“map”div的大小？

 map = new GMaps({
        el: '#map',
        lat: -12.043333,
        lng: -77.028333,
        width: '95%',
        height: '350px',
        zoom: 16,
        click: function(e){

          map.removeMarkers();

          map.addMarker({
            lat: e.latLng.lat(),
            lng: e.latLng.lng(),
            draggable: true
          });

          //Set google lat in hidden input
          $('#latGoogleMap').val( e.latLng.lat());
          //Set google lng in hidden input
          $('#lngGoogleMap').val(e.latLng.lng());

        }

      });