绘制矩形

Question

我有一个项目，我想在世界地图上划分规则的网格然后突出显示该网格

我已经设法成功地破解一个例子来的某些部分吸取谷歌的世界地图

function initMap() { 

    var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 1, 
    center: {lat: 60.18, lng: 24.93}, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
    }); 

var rectangle = new google.maps.Rectangle({ 
strokeColor: '#FF0000', 
strokeOpacity: 0.8, 
strokeWeight: 2, 
fillColor: '#FF0000', 
fillOpacity: 0.35, 
map: map, 
bounds: { 

    west: 180, north:0, east: -160, south: 20 
} 
});  

initMap(); 

http://jsfiddle.net/6zea831p/4/

于20×矩形但我想变成一个功能那么多的矩形可以根据我的脚本的其他部分高亮显示。尽管我把它变成一个函数并没有太大的成功。这是我开始

function drawRec(w, n, e, s){ 


var coords = new google.maps.LatLngBounds(
     new google.maps.LatLng(w, n), 
     new google.maps.LatLng(e, s)) 

var rectangle = new google.maps.Rectangle({ 
    strokeColor: ' #ff00ff', 
    strokeOpacity: 0.8, 
    strokeWeight: 1, 
    fillColor: ' #ff00ff', 
    fillOpacity: 0.35, 

    bounds: coords, 

    map: map 

    }); 



} 

我得到的错误控制台“InvalidValueError：没有地图的一个实例：调用setMap”。

Answer 1

声明外的“地图”变种“initMap（）”功能，使之在你的脚本标签

var map; 

function initMap() { 
    map = new google.maps.Map(document.getElementById('map'), { 
    ... 
    ... 
} 

function drawRec(w, n, e, s){ 
    ... 
} 

Answer 2

全球超过全局变量傻修复程序后，我到底到了那里：

西，北等..只需从参数

var map 

function initMap() { 
map = new google.maps.Map(document.getElementById('map'), { 
zoom: 1, 
center: {lat: 60.18, lng: 24.93}, 
mapTypeId: google.maps.MapTypeId.TERRAIN 
    }); 
} 

function drawRec(w, n, e, s){ 




var rectangle = new google.maps.Rectangle({ 
    strokeColor: ' #ff00ff', 
    strokeOpacity: 0.8, 
    strokeWeight: 1, 
    fillColor: ' #ff00ff', 
    fillOpacity: 0.35, 

    bounds: { 

    west: w, north:n, east: e, south:s 
    }, 

    map: map 

    }); 

} 


initMap(); 
drawRec(180, 10, 160, 30);