稍后项目可能用到,做个笔记。
在百度地图上划区块取点,在原demo上修改而来
<!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{width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
#allmap {height:500px; width: 100%;}
#control{width:100%;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
<title>设置线、面可编辑</title>
</head>
<body>
<div id="allmap"></div>
<div id="control">
<button onclick = "polygon.enableEditing();">开启线、面编辑功能</button>
<button onclick = "polygon.disableEditing();">关闭线、面编辑功能</button>
<button onclick = "print()">显示坐标</button>
<p id="aaaa" ></p>
</div>
</body>
</html>
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(121.34912, 31.500192), 18);
map.enableScrollWheelZoom();
var polygon = new BMap.Polygon([
new BMap.Point(121.348763,31.501547),
new BMap.Point(121.348098,31.5007),
new BMap.Point(121.35012,31.499192),
new BMap.Point(121.351054,31.500639)
], {strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5}); //创建多边形
map.addOverlay(polygon); //增加多边形
function print(){
var path = polygon.getPath();
var i =0;
var pathstr = "";
for(;i<path.length;i++){
pathstr+=path[i].lat+","+path[i].lng+";";
}
document.getElementById('aaaa').innerHTML=pathstr;
}
</script>