鍍金池/ 問答/HTML5  HTML/ 百度地圖 js api 多個覆蓋物添加事件問題

百度地圖 js api 多個覆蓋物添加事件問題

我想要點擊不同的多邊形提示對應的索引,但是現(xiàn)在只彈出最后一個。是我閉包寫的有問題嗎?
請大神解答,在線等....

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微軟雅黑";}
    </style>
    <!--<script type="text/javascript" src="json.js" ></script>-->
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=zga15SpUh7sMrZkXaBKicRBshkN3bKtR"></script>
    <title>添加行政區(qū)劃</title>
</head>
<body>
    <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
    // 百度地圖API功能
    var map = new BMap.Map("allmap");
    var pointArray = [];
    map.centerAndZoom(new BMap.Point(116.403765, 39.914850), 5);
    map.enableScrollWheelZoom();
    var oneDev = ["北京市","上海市","天津市","重慶市","黑龍江","遼寧省","吉林省","河北省","河南省","湖北省","湖南省","山東省","山西省","陜西省","安徽省","浙江省","江蘇省","福建省","廣東省","海南省","四川省","云南省","貴州省","青海省","甘肅省","江西省","臺灣","廣西","西藏","新疆","寧夏","內(nèi)蒙古","香港","澳門"];
    var colorArr = ['#ff541c','#1cecff','#3cff1c','#ff1c47'];
    boundary();
    function boundary(){
        for(var j=0;j<oneDev.length;j++){
            var bdary = new BMap.Boundary();
            bdary.get(oneDev[j], function(rs){  //獲取行政區(qū)域
                var ply = null;
                //map.clearOverlays();        //清除地圖覆蓋物       
                var count = rs.boundaries.length; //行政區(qū)域的點有多少個
                for (var i = 0; i < count; i++) {
                    var color = colorArr[Math.floor(Math.random()*3+0)];
                    ply = new BMap.Polygon(rs.boundaries[i], {fillColor:color,strokeWeight: 2, strokeColor:'#000'}); //建立多邊形覆蓋物
                    map.addOverlay(ply);  //添加覆蓋物
                }  
                //map.setViewport(pointArray);    //調(diào)整視野  
                (function(){
                    var index = j;
                    ply.addEventListener('click',function(){
                        alert(j);
                    })
                })
            }); 
        }
    }
    //getBoundary();
</script>
回答
編輯回答
亮瞎她

已解決

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微軟雅黑";}
    </style>
    <!--<script type="text/javascript" src="json.js" ></script>-->
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=zga15SpUh7sMrZkXaBKicRBshkN3bKtR"></script>
    <title>添加行政區(qū)劃</title>
</head>
<body>
    <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
    // 百度地圖API功能
    var map = new BMap.Map("allmap");
    var pointArray = [];
    map.centerAndZoom(new BMap.Point(116.403765, 39.914850), 5);
    map.enableScrollWheelZoom();
    var oneDev = ["北京市","上海市","天津市","重慶市","黑龍江","遼寧省","吉林省","河北省","河南省","湖北省","湖南省","山東省","山西省","陜西省","安徽省","浙江省","江蘇省","福建省","廣東省","海南省","四川省","云南省","貴州省","青海省","甘肅省","江西省","臺灣","廣西","西藏","新疆","寧夏","內(nèi)蒙古","香港","澳門"];
    var colorArr = ['#ff541c','#1cecff','#3cff1c','#ff1c47'];
    boundary();
    function boundary(){
        for(var j=0;j<oneDev.length;j++){
            (function(index){
                var bdary = new BMap.Boundary();
                bdary.get(oneDev[index], function(rs){  //獲取行政區(qū)域
                    var ply = null;
                    //map.clearOverlays();        //清除地圖覆蓋物       
                    var count = rs.boundaries.length; //行政區(qū)域的點有多少個
                    for (var i = 0; i < count; i++) {
                        var color = colorArr[Math.floor(Math.random()*3+0)];
                        ply = new BMap.Polygon(rs.boundaries[i], {fillColor:color,strokeWeight: 2, strokeColor:'#000'}); //建立多邊形覆蓋物
                        map.addOverlay(ply);  //添加覆蓋物
                    }  
                    //map.setViewport(pointArray);    //調(diào)整視野  
                    ply.addEventListener('click',function(){
                        alert(index)
                    })
                });
            })(j)
        }
    }
</script>
2017年1月5日 15:57