背景:

在项目中,我需要对解析后的nc文件数据进行筛选,选出符合要求的点,绘制相应的polygon。

代码:ajax获取某一时刻的数据

var url ="/api/config/PostCoordinates/"+times+"/0";
$.ajax({
type:"GET",
url:url,
success:function(data){
//画polygon
createPolygon(data);
},
error:function(data){
console.log(data);
}
});

绘制polygon的方法,数据解析完成后,发现数据的是有规则的,每一行的维度都是一样的,那么为了筛选出边界点,我需要将维度不一样的第一个点拿到,并将其push到数组中。同时,在实际的效果中,我发现生成的polygon并不是我想要的。这样我发现利用arcgis绘制polygon的过程是按照点的添加顺序来绘制的,因而我不能只接将符合要求的点push到数组中,我还需要做进一步的操作,将同一行的最后一个点的数据放在另一个数组中,并倒叙取出,再push到最终的数组中。代码如下:

//画polygon
function createPolygon(data){

//设置polygon的颜色填充
var polySymbolRed = new esri.symbol.SimpleFillSymbol(
esri.symbol.SimpleLineSymbol.STYLE_SOLID,
new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,
new Color([0, 0, 0, 0]),3),
new Color([255, 106, 106,0.3])
);

var polygon = new Polygon(new SpatialReference({wkid:4326}));

//定义数组
var ring = new Array();var pts,pts2;
var result = new Array();
for(var i=0;i<data.length-1;i++){

//数据点的第一个和最后一个点push到数组中
if(i==0||i==data.length-1){
pts = new Point(data[i].winddir,data[i].windspeed,sr);
ring.push(pts);
}

//将维度不一样的第一个点,和前一个点push到不同的数组中
if(data[i].windspeed!=data[i+1].windspeed){
pts2 = new Point(data[i+1].winddir,data[i+1].windspeed,sr);
ring.push(pts2);
pts = new Point(data[i].winddir,data[i].windspeed,sr);
result.push(pts);
}
}

//倒叙取出同一行的最后一个点的数据
for(var j=result.length-1;j>0;j--){
console.log("result is "+result[j]);
ring.push(result[j]);
}
//绘制polygon
polygon.addRing(ring);
var gra = new esri.Graphic(polygon,polySymbolRed);
map.graphics.add(gra);
}

部分数据如下,windspeed是维度,winddir为经度,数组长度580:

最终的效果如下,粉红色的部分就是从nc文件中解析出来的数据绘制的polygon:

利用javascript实现二维数组的筛选的更多相关文章

  1. 同事问如何判断同花顺,我用javascript的二维数组写了个简易demo

    有个前同事在群里问如何判断是否为同花顺我用javascript的二维数组写了个简易demo. <!DOCTYPE html> <html> <body> <s ...

  2. 一道JavaScript的二维数组求平均数的题

    JavaScript中只支持一维数组,但是可以在数组中嵌套数组来创建二维以至于多维的数组.今天下午在看书时候,发现一道感觉比较有意思的题,就是js中如何求二维数组的列之和和行之和,现在就给大家分享下, ...

  3. JavaScript -- 定义二维数组

    方法一:直接定义并且初始化,这种遇到数量少的情况可以用var _TheArray = [["0-1","0-2"],["1-1"," ...

  4. JavaScript的二维数组

    二维数组的初始化: 实例① var arr = [[1,2],['a','b']]; console.log(arr[1][0]); //a 第2列第1行所在的元素 实例② var arr = new ...

  5. javascript定义二维数组与添加

    你定义的已经就是的了啊.不是很明白你的问的什么.你是说如何向里面填充?双层循环就行了撒:for(var i = 0; i < X; i++){ for(var j = 0; j < Y; ...

  6. javascript 二维数组的例子

    javascript没有二维数组.所有自定义了一个数组类,下面是实例代码. 代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans ...

  7. C++二维数组的动态声明

    int **a  =  new int* [m]   //分配一个指针数组,将其首地址保存在a中   . for(int i = 0; i < m; i++)   //为指针数组的每个元素分配一 ...

  8. Vector 二维数组 实现

    1.C++实现动态二维数组 int **p; p = ]; //注意,int*[10]表示一个有10个元素的指针数组 ; i < ; ++i) { p[i] = ]; } 2.利用指针数组实现二 ...

  9. java基础:进制详细介绍,进制快速转换,二维数组详解,循环嵌套应用,杨辉三角实现正倒直角正倒等腰三角,附练习案列

    1.Debug模式 1.1 什么是Debug模式 是供程序员使用的程序调试工具,它可以用于查看程序的执行流程,也可以用于追踪程序执行过程来调试程序. 1.2 Debug介绍与操作流程 如何加断点 选择 ...

随机推荐

  1. [Xcode 实际操作]九、实用进阶-(13)调用相机并获取拍摄后的图片

    目录:[Swift]Xcode实际操作 本文将演示如何调用相机并获取拍摄后的图片. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit //首 ...

  2. Springboot整合elasticSearch的官方API实例

    前言:在上一篇博客中,我介绍了从零开始安装ElasticSearch,es是可以理解为一个操作数据的中间件,可以把它作为数据的存储仓库来对待,它具备强大的吞吐能力和计算能力,其基于Lucene服务器开 ...

  3. Spring Boot Autowirted注入找不到Bean对象解决方法

    报错:Consider defining a bean of type 'xxxxxxxxxxxxx' in your configuration 1. 你应该在 ApplyApplication 启 ...

  4. 在 UIViewController 中手动增加 TableView 出现 Type 'SomeViewController' does not confirm to protocol 'UITableViewDataSource' 问题的解决办法

    许多时候我们都有在普通的继承自 UIViewController 的控制器中使用 TableView 的需求,这时候就需要当前控制器类继承 UITableViewDelegate 和 UITableV ...

  5. CF1110F Nearest Leaf

    传送门 这是我第二次看见这个题目了,第一次看见是另一场比赛的A题,想了一个小时不会写就弃了 从来没想过这个题能这么玩 线段树上记录根到叶子节点的距离 初始线段树上先记下根节点1到各叶子节点的距离 先离 ...

  6. java 8 lamda Stream的Collectors.toMap 参数

    使用toMap()函数之后,返回的就是一个Map了,自然会需要key和value.toMap()的第一个参数就是用来生成key值的,第二个参数就是用来生成value值的.第三个参数用在key值冲突的情 ...

  7. Linux —— 压缩命令

    压缩与解压命令 .zip格式 压缩文件: zip 压缩文件名 原文件名 (压缩目录添加 -r) 解压缩文件/目录: unzip .zip压缩包 .gz格式 压缩文件: gzip 原文件名称 压缩文件为 ...

  8. 101 Symmetric Tree 判断一颗二叉树是否是镜像二叉树

    给定一个二叉树,检查它是否是它自己的镜像(即,围绕它的中心对称).例如,这个二叉树 [1,2,2,3,4,4,3] 是对称的.    1   / \  2   2 / \ / \3  4 4  3但是 ...

  9. 浅析ES6中的iterator

    1.iterator迭代器必须保证其遍历终止条件可控,否则会形成死循环demo: //会用到iterator接口的场合 //1.for...of循环 //2. ...解构表达式 const obj = ...

  10. [Ubuntu]“ubuntu.sh: 113: ubuntu.sh:Syntax error: "(" unexpected ”报错解决方法

    原因:有可能是兼容性问题 解决方法: 1.sudo dpkg-reconfigure dash   2.在弹出的窗口选择no