arcgis for js 3.X绘制雷达扫描效果

arcgis for js 3.X绘制雷达扫描效果

思路：

1、雷达刻度比较复杂，可以预先发布成图层，绘制时再调出来

2、雷达扫描效果，可由多条半径组成一个扇形 3、半径线条由起始角度（扫描方向中居于前）到截止角度，逐渐透明 4、利用定时器定期刷新，角度向前递增，绘制前先清除上一步骤的绘制结果

代码：

var _lines = [];//线条存储器var _sAngle = 0,_eAngle = 0;//起始角度。开始都为0var _timer; function go(lon,lat){ var layer = getLayer("radar1");//构造一张graphics图层，用于绘制 var p0 = lngLatToXY([lon,lat]);//雷达站坐标，转换成平面坐标系，作为绘制的圆心。 var offAngle = 0.50;//角度步长。0.50意味着每度圆弧对应2条半径 var offAngTotal = 75;//扫描扇形夹角 var offColor = (0.3 / offAngTotal) * offAngle;//透明度步长;0.3是最前面线条的透明度 var lineWidth = 8 * offAngle;//线条宽度 function scan() { //清掉现有线条 for(var i in _lines){ layer.remove(_lines[i]); } _lines = []; //记录转动角度 _sAngle++; if((_sAngle - _eAngle) > offAngTotal ) _eAngle = _sAngle - offAngTotal; //画上新线条 for(var i = _eAngle,j = 0;i < _sAngle;i += offAngle,j+=offColor){ var p = getPoint(p0,i); //r,g,b,a;a,alpha，代表透明度，0为完全透明，1为完全不透明 var color = new Color([16, 222, 14, j]); var line = getLine(color,lineWidth,p0,p); layer.add(line); _lines.push(line); } _timer = setTimeout(function(){ scan(); },25); } scan();}function getLine(color,lineWidth,p1,p2){//绘制一条半径 //构造笔 var sls = new SimpleLineSymbol( SimpleLineSymbol.STYLE_SOLID, color, lineWidth ); //画线 var polyline = new esri.geometry.Polyline({ "paths": [[p1,p2]], "spatialReference": _map.spatialReference }); return new esri.Graphic(polyline, sls);}function getPoint(center, angle) {//获得圆弧上的点（平面坐标） var radius = 42 * 1000;//雷达扫描范围为42千米；转换为米 var sin = Math.sin(angle * Math.PI / 180); var cos = Math.cos(angle * Math.PI / 180); var x = center[0] + radius * sin; var y = center[1] + radius * cos; return [x, y];}function getLayer(id) {//获取绘制图层 var layer = new GraphicsLayer({ "id": id }); map.addLayer(layer); return layer;}function lngLatToXY(pt){//经纬度转化为平面坐标 var _f = 6378137, _p = 0.017453292519943; var lng = pt[0];//经度 var lat = pt[1];//纬度 if (lat > 89.999999){ lat = 89.999999; } else if (lat < -89.999999){ lat = -89.999999; } var c = lat * _p; x = lng * _p * _f; y = _f / 2 * Math.log((1 + Math.sin(c)) / (1 - Math.sin(c))); return [x,y];}

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。