利用SOSO地图API 画圆形

最新推荐文章于 2023-10-21 18:32:47 发布

Sam萨姆

最新推荐文章于 2023-10-21 18:32:47 发布

阅读量779

点赞数

分类专栏： GIS 文章标签： api function button input div

本文链接：https://blog.csdn.net/zzzzzzzert/article/details/7900116

版权

GIS 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

1.当鼠标左键单击后开始移动鼠标取半径，当单击鼠标右键结束操作

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>SOSOMap</title>
<style type="text/css">
*{
    margin:0px;
    padding:0px;
}
body, button, input, select, textarea {
    font: 12px/16px Verdana, Helvetica, Arial, sans-serif;
}
#info{
    width:603px;
    padding-top:3px;
    overflow:hidden;
}
.btn{
    width:190px;
}
</style>
<script charset="utf-8" src="http://api.map.soso.com/v1.0/main.js"></script>
</script>
<script type="text/javascript">
var circle;
function init(){
    var center=new soso.maps.LatLng(39.982163,116.306070);
    var map=new soso.maps.Map(document.getElementById("container"),{
        center:center,
        zoomLevel:14
    });
    circle=new soso.maps.Circle({
    map:map,
    center:center,
    radius:0,
    fillColor:"#0f0",
    fillOpacity:0.3,
    strokeWeight:2
    });
     var circle_lat;
     var circle_lng;
     var first;
     var second;
     var listener;
     var listener_click=soso.maps.Event.addListener(map,"click",function(e){	 					
	    circle.setCenter(e.latLng); 		//设置圆心
	    circle_lat=e.latLng.getLat();		//获取圆心纬度
	    circle_lng=e.latLng.getLng();       //获取圆心经度          
	    first= new soso.maps.LatLng(circle_lat,circle_lng);
	
	        listener =  soso.maps.Event.addListener(map,"mousemove",function(event){
	        second=new soso.maps.LatLng(event.latLng.getLat(),event.latLng.getLng());
	        setTimeout(function(){
       		 var aa=parseInt(map.getDistance(first,second));	
       		 circle.setRadius(aa);  
    		},0);	   	  
	    	});	  	     	 	  		    	
	    });  
	soso.maps.Event.addListener(circle,"rightclick",function(){		    
        soso.maps.Event.removeListener(listener);		//移除监听事件  
        soso.maps.Event.removeListener(listener_click); 
        alert("结束"); 
    	});	 
}
</script>
</head>
<body οnlοad="init()">
<div style="width:603px;height:300px" id="container"></div>
</body>
</html>