百度地图后台拿数据绘制多边形

<!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="http://api.map.baidu.com/api?v=2.0&ak=你的秘钥"></script>
	<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
	<title>地图展示</title>
	
	<style type="text/css">
    .anchorBL{display:none;}
    
           #manu2{
       	width: 250px;
       	height: 150px;
       	margin-top: 141px;
       	margin-left: 39px; 
       	position: absolute;
       	z-index: 9999;
       	background-color:darkgoldenrod;
       	color: #AFEEEE; 
       	border-top: 2px solid #212A56;
       	border-bottom: 2px solid #212A56;
       	
       }
</style>

</head>
<body>
	<div style="left:19px;top:11px;width:98%;height:98%;position:absolute;border-radius: 9px;" id="allmap">

	

</body>
</html>
<script type="text/javascript">
	// 百度地图API功能
	var map = new BMap.Map("allmap");    // 创建Map实例
	map.centerAndZoom(new BMap.Point(116.404, 39.915), 15); //初始化地图
	map.enableScrollWheelZoom();    启动鼠标滚轮操作
	//添加地图类型控件
	map.addControl(new BMap.MapTypeControl({
		mapTypes:[
            BMAP_HYBRID_MAP
        ]}));	

	array=new Array();//新建一个数组
	
	for (var i=0;i<10;i++)
	{	
		var a=116+Math.random();//模拟后台获取的X坐标
		var b=19+Math.random();//模拟后台获取的Y坐标
		array. push(new BMap.Point(a,b));
	
	}

	var Point=array;
	
	console.log(Point);

	var polygon = new BMap.Polygon(Point, {strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5});  //创建多边形
	map.addOverlay(polygon);   //增加多边形


</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>添加行政区划</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 = ["北京市","上海市","天津市","重庆市","黑龙江","辽宁省","吉林省","河北省","河南省","湖北省","湖南省","山东省","山西省","陕西省","安徽省","浙江省","江苏省","福建省","广东省","海南省","四川省","云南省","贵州省","青海省","甘肃省","江西省","台湾","广西","西藏","新疆","宁夏","内蒙古","香港","澳门"]; var colorArr = ['#ff541c','#1cecff','#3cff1c','#ff1c47',,'#000']; boundary(); function boundary(){ for(var j in oneDev){ (function(index){ var bdary = new BMap.Boundary(); bdary.get(oneDev[index], function(rs){ //获取行政区域 //map.clearOverlays(); //清除地图覆盖物 var count = rs.boundaries.length; //行政区域的点有多少个 for (var i = 0; i < count; i++) { var color = colorArr[Math.floor(Math.random()*3+0)]; var ply = new BMap.Polygon(rs.boundaries[i], {fillColor:color,strokeWeight: 2, strokeColor:'#000'}); //建立多边形覆盖物 map.addOverlay(ply); //添加覆盖物 } //map.setViewport(pointArray); //调整视野 ply.addEventListener('click',function(){ console.log(index) }) }); })(j) } } </script> ```
©️2020 CSDN 皮肤主题: 撸撸猫 设计师:设计师小姐姐 返回首页