Javascript Ajax谷歌地图Gmap未加载Json Web服务

我试图通过JSON使用Gmaps和jQueryAjax加载地图，但我无法让地图显示在我的页面上，我知道我得到了正确的坐标，因为我在控制台中进行了测试

我不知道为什么没有出现

这是我的密码

$.ajax({
    url: 'http://api.geonames.org/earthquakesJSON?formatted=true&north=44.1&south=-9.9&east=-22.4&west=55.2&username=warriorshadow&style=full',
    username: "jrodrguez",
    password: "7kZ7MHZ2vj",
    dataType: 'JSON',
    success: function (data) {

        var map = new GMaps({
            el: '#map_canvas',
            lat: 0,
            lng: 0,
        });

        $.each(data.earthquakes, function (key, val) {
            var lat = val.lat; 
            var long = val.lng;
            map.addMarker({
                lat: lat,
                lng: long,

                infoWindow: {
                    content: '<p>La magnitud fue '+val.magnitude+'</p>'}
            });
        });
    }
});

$.ajax({
网址：'http://api.geonames.org/earthquakesJSON?formatted=true&north=44.1&south=-9.9东=22.4西=55.2用户名=warriorshadow样式=full'，
用户名：“jrodrguez”，
密码：“7kZ7MHZ2vj”，
数据类型：“JSON”，
成功：功能（数据）{
var map=新GMAP({
el:'地图'画布'，
纬度：0，
液化天然气：0，
});
$.each（数据、地震、函数（键、值）{
var lat=val.lat；
var long=val.lng；
map.addMarker({
拉特：拉特，
液化天然气：长，
信息窗口：{
内容：“La magnitud fue”+val.magnitude+”
}
});
});
}
});

这是我的HTML（只是div）

---

您似乎需要为画布指定宽度和高度，以便正确显示，请参见下面的代码片段：

$.ajax({
网址：'http://api.geonames.org/earthquakesJSON?formatted=true&north=44.1&south=-9.9东=22.4西=55.2用户名=warriorshadow样式=full'，
用户名：“jrodrguez”，
密码：“7kZ7MHZ2vj”，
数据类型：“JSON”，
成功：功能（数据）{
var map=新GMAP({
el:'地图'画布'，
纬度：0，
液化天然气：0，
缩放：1
});
$.each（数据、地震、函数（键、值）{
var lat=val.lat；
var long=val.lng；
map.addMarker({
拉特：拉特，
液化天然气：长，
信息窗口：{
内容：“La magnitud fue”+val.magnitude+”
'
}
});
});
}
});
#地图#画布{
高度：300px；
宽度：600px；
背景：#6699cc；
}
谢谢！很抱歉，我的评论太晚了
<div id="map_canvas"></div>