Openlayers3中实现台风风圈绘制算法

概述

台风的风圈的NE、NW、SW、SE四个方位的影响范围是不一致,本文介绍一种简单的风圈的绘制方法,并在OL3中展示。

效果

Openlayers3中实现台风风圈绘制算法_第1张图片
台风风圈

代码

  1. 数据格式
            var Configs = {
                CIRCLE_CENTER_X:104.21390114106414,
                CIRCLE_CENTER_Y:35.847595169932646,
                CIRCLE_R:{
                    "SE":0.5,
                    "NE":0.3,
                    "NW":0.2,
                    "SW":0.5
                }
            };
  1. 关键代码
            var wkt = "POLYGON((";
            var wkt0 = "", _interval = 6;
            for(var i=0;i<360/_interval;i++){
                var _r = 0;
                var _ang = i*_interval;
                if(_ang>0&&_ang<=90){
                    _r = Configs.CIRCLE_R.NE;
                }
                else if(_ang>90&&_ang<=180){
                    _r = Configs.CIRCLE_R.NW;
                }
                else if(_ang>180&&_ang<=270){
                    _r = Configs.CIRCLE_R.SW;
                }
                else{
                    _r = Configs.CIRCLE_R.SE;
                }

                var x = Configs.CIRCLE_CENTER_X + _r * Math.cos(_ang * 3.14 /180);
                var y = Configs.CIRCLE_CENTER_Y + _r  * Math.sin(_ang * 3.14/180);

                wkt = wkt+""+x+" "+y+", ";
                if(i===0){
                    wkt0 = ""+x+" "+y+"";
                }
            }
            wkt = wkt+wkt0+"))";
  1. 完整代码


    
    Ol3 draw
    
    
    
    
    



类型 内容
qq 1004740957
公众号 lzugis15
e-mail [email protected]
webgis群 1004740957
Android群 337469080
GIS数据可视化群 458292378

技术博客
CSDN:http://blog.csdn.NET/gisshixisheng
博客园:http://www.cnblogs.com/lzugis/
在线教程
http://edu.csdn.Net/course/detail/799
Github
https://github.com/lzugis/
联系方式

类型 内容
qq 1004740957
公众号 lzugis15
e-mail [email protected]
webgis群 1004740957
Android群 337469080
GIS数据可视化群 458292378
LZUGIS

你可能感兴趣的:(Openlayers3中实现台风风圈绘制算法)