使用类选择多个canvas时，Google地图无法使用
我目前正在构建一个能够动态渲染多个Google Maps实例的cms。 我目前的方法是找到所有具有类“gMapsCanvas”的div并为每个div初始化Gmaps。 Google地图的地址取自div的“数据地址”属性。
HTML示例：
CSS：
.gMapsCanvas { width: 100%; height: 100%; }
JavaScript的
var GoogleMap = function(canvas, address) { var _parent = this; this.location = new google.maps.LatLng(-34.397, 150.644); var options = { center: this.location, zoom: 16, mapTypeId: google.maps.MapTypeId.ROADMAP, mapTypeControlOptions: { style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR, position: google.maps.ControlPosition.TOP_CENTER }, streetViewControl: false }; this.map = new google.maps.Map(canvas, options); var geocoder = new google.maps.Geocoder(); geocoder.geocode( { 'address': address}, function(results, status) { if (status != google.maps.GeocoderStatus.OK) return; _parent.location = results[0].geometry.location; var marker = new google.maps.Marker( { map: _parent.map, position: _parent.location }); _parent.resize(); }); }; GoogleMap.prototype.resize = function() { google.maps.event.trigger(this.map, "resize"); this.map.setCenter(this.location); } var Maps = function(classes) { var _parent = this; this.maps = new Array(); classes.each(function() { _parent.maps.push(new GoogleMap($(this).get(), $(this).attr("data-address"))); }); }; Maps.prototype.resize = function() { for (var cnt = 0; cnt < this.maps.length; cnt++) { this.maps[cnt].resize(); } }; var maps; $(window).load(function() { maps = new Maps($(".gMapsCanvas")); });
我需要全局“maps”变量和resize方法，以便我能够全局调整地图的大小（我的布局是动态的）。
我的问题是它不起作用：在所有浏览器中，canvas保持空白，在Firefox中，我得到以下错误代码：
NS_ERROR_FAILURE: Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMWindow.getComputedStyle]
使用标准的“getElementById”-Method时，所有代码都可以正常工作，所以似乎问题就是我使用JQuery来选择div的方式。
.get（）返回一个数组。
更改：
_parent.maps.push(new GoogleMap($(this).get(), $(this).attr("data-address")));
至：
_parent.maps.push(new GoogleMap($(this).get(0), $(this).attr("data-address")));
工作实例