图形渲染中,idw反距离权重插值算法是一个应用非常广泛的方法,但是js实现的比较少,目前实现一个:

//idw算法
//输入[[x:0,y:0,v:0],[x:0,y:0,v:0],[x:0,y:0,v:0]]
function idwcomputer(datas,result){
if(datas.lenght<3) return result;
var m0=datas.length;
var m1=result.length; //console.info(datas); //距离列表
var r=[]; for(var i=0;i<m1;i++){
for(var j=0;j<m0;j++){
var tmpDis = Math.sqrt(Math.pow(result[i].x - datas[j].x, 2) + Math.pow(result[i].y - datas[j].y, 2));
r.push(tmpDis);
}
} //插值函数 for (var i = 0; i < m1; i++)
{
//查找重复
var ifFind = false;
for (var j = m0 * i; j < m0 * i + m0; j++)
{
if (Math.abs(r[j]) < 0.0001)
{
result[i].v = datas[j - m0 * i].v;
ifFind = true;
break;
}
} if (ifFind) continue; var numerator = 0;
var denominator = 0; for (var j = m0 * i; j < m0 * i + m0; j++)
{
numerator += datas[j - m0 * i].v / (r[j] * r[j]);
denominator += 1 / (r[j] * r[j]);
} result[i].v = numerator / denominator;
}
return result; }

调用方法如下:

var idwdatas=[],idwresult=[];
//填充计算点的位置

//下边的数据从后端返回
$.each(result.result,function(i,val){
idwdatas.push({"x":val.pointLongitude,"y":val.pointLatitude,"v":val.value});
});
//计算需要范围的结果的经纬度坐标

//需要插值的格点坐标。这个通过等分经纬度实现的,
idwresult=countgridlocal(grid);
//返回idw计算结果
idwresult=idwcomputer(idwdatas,idwresult);
console.info(idwresult);

注意,前端不适合使用大量的这个算法,我这个是格点用的插值。

[原创.数据可视化系列之十三]idw反距离权重插值算法的javascript代码实现的更多相关文章

  1. PIE SDK反距离权重插值算法

      1.算法功能简介 反距离权重 (IDW) 插值使用一组采样点的线性权重组合来确定像元值.权重是一种反距离函数.进行插值处理的表面应当是具有局部因变量的表面.此方法假定所映射的变量因受到与其采样位置 ...

  2. [原创.数据可视化系列之五]韩国"萨德"系统防御图

    自从7月8日美国和韩国共同宣布将在韩国部署萨德反导系统后,韩国国内对此事的巨大争议以及本地区一些国家的强烈不满情绪在持续发酵.“萨德”(THAAD)全称“末段高空区域防御系统”,是美国导弹防御局和美国 ...

  3. [原创.数据可视化系列之八]使用等d3进行灰度图转伪彩色

    对灰度图进行彩色化是数据可视化中常见的需求,使用d3在客户端比较容易实现,本文使用d3生成图片,并显示: 代码如下: 代码中首先下载数据文件,然后设定d3的色带信息,生成一个空白的canvas元素,并 ...

  4. [原创.数据可视化系列之三]使用Ol3加载大量点数据

    不管是百度地图还是高德地图,都很难得见到在地图上加载大量点要素,比如同屏1000的,因为这样客户端性能会很低,尤其是IE系列的浏览器,简直是卡的要死.但有的时候,还真的需要,比如,我要加载全球的AQI ...

  5. [原创.数据可视化系列之十二]使用 nodejs通过async await建立同步数据抓取

    做数据分析和可视化工作,最重要的一点就是数据抓取工作,之前使用Java和python都做过简单的数据抓取,感觉用的很不顺手. 后来用nodejs发现非常不错,通过js就可以进行数据抓取工作,类似jqu ...

  6. [原创.数据可视化系列之二]使用cesium三维地图展示美国全球军事基地分布

    基于浏览器的三维地图还算是一个比较高冷的东西,最主要的技术难点是如何在浏览器上 多快好省 的显示三维数据,很遗憾,还真的没有太好的的方案,只能说还有可行的方案. 很久之前用过skyline,使用CS居 ...

  7. [原创.数据可视化系列之一]使用openlayers 3 显示聚合数据

    在地图上显示点数据是最常用的地图展示功能之一,但是如果很多点在地图上显示,或造成密密麻麻的一片,无法正常看清楚,这个时候,一般有两种解决方案,一种是根据数据重要程度进行标注,重要的显示大一些,不重要的 ...

  8. [原创.数据可视化系列之六]使用openlyaers进行公网地图剪切

    进行地图开发的过程中,我一般使用天地图或者微软的地图作为地图,因为这两种地图的经纬度偏差最小,基本可以满足用户需求,比如: 不用说,都是全部地图,这也是最常用的一种方法. 但是用户说,我只看大连的地图 ...

  9. 反距离权重插值inverse distance weighting,IDW

    反距离权重 (IDW) 插值显式假设:彼此距离较近的事物要比彼此距离较远的事物更相似.当为任何未测量的位置预测值时,反距离权重法会采用预测位置周围的测量值.与距离预测位置较远的测量值相比,距离预测位置 ...

随机推荐

  1. MongoDB和Java-PHP

    一.java操作mongoDB 配置环境: 1.下mongodb JDBC驱动mongo-java-driver-3.2.2.jar,并包含在classpath中 步骤: 1.连接数据库 // 连接到 ...

  2. object 类 toString() 和 equals() 的覆写

    基本作用: objiect类是所有类的父类. 任何一个类定义的时候如果没有明确定义了父类的话,默认父类是Object类. class A extends Object{} 在整个java里面,类的继承 ...

  3. java--面向对象编程

    instanceof的用法 静态绑定,即早期绑定,首先找父类 动态绑定,即运行时绑定,new谁找谁 Object o1 = null; //正确的语法,null也是一种特殊的引用数据类型 object ...

  4. java 图片生成缩略图后,转化成流

    功能:图片生成缩略图后,转化成流 public class ImageUtils { /** * * @param in1 * 文件流 * @param uploadFileName * 文件名称 * ...

  5. ajax 页面请求后,jsp页面定位

    如下图所示.A,B两区域为不动区域,既不随着滚动条的滚动而移动.C区域为异步加载内容区域, 在C区域中,点击查询按钮,需要异步加载查询 结果.但是查询结果会很长,这样子,就需要向下滑动滚动条,用户体验 ...

  6. bzoj 2286 [Sdoi2011]消耗战 虚树+dp

    题目大意:多次给出关键点,求切断边使所有关键点与1断开的最小费用 分析:每次造出虚树,dp[i]表示将i和i子树与父亲断开费用 对于父亲x,儿子y ①y为关键点:\(dp[x]\)+=\(dismn( ...

  7. 用蓝牙芯片CC2541/CC2540实现一个智能恒温箱

    最近突然想自己做一个智能小冰箱玩一玩,于是决定动手试一试. 成品效果图 原材料 半导体制冷片一只 散热风扇 12V电源一台 智能恒温箱电路板 控制板的PCB图 原理图 供电部分原理图 制冷片控制部分原 ...

  8. windows批处理實例

    實例: 假設我們有個資料夾為d:\tmp和e:\tmp ,而我們只要將d:\tmp中有異動的檔案複製到e:\tmp下的話,用法如下 xcopy d:\tmp\. e:\tmp\ /D /S /Y 實例 ...

  9. Delphi遍历文件夹及子文件夹(可查找固定格式文件)

    Delphi遍历文件夹及子文件夹 {-------------------------------------------------------------------------------过程名 ...

  10. spring mvc 必须传某个参数的写法

    在controller中写 @RequestMapping(中的params="json") @RequestMapping(value = "/{username}&q ...