图形渲染中,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. js生成随机数

    //生成n以内的随机数 function getRandom(n){ return Math.floor(Math.random()*n+1) } //生成1000以内的随机数 alert(getRa ...

  2. IOS开发-ObjC-对象、封装

    C语言是基于过程的一种编程语言,而OC语言是基于对象的一种语言. C是和其他的面向对象的语言的区别在于C语言更注重地层操作,思维方式相比面向对象的语言而言更接近机器的思维方式,而面向对象的语言更接近于 ...

  3. Use Wireshark to capture loopback traffic without a loopback adapter (转)

    Use Wireshark to capture loopback traffic without a loopback adapter If you’ve ever used Wireshark f ...

  4. BZOJ3270: 博物馆

    3270: 博物馆 Time Limit: 30 Sec  Memory Limit: 128 MBSubmit: 269  Solved: 147[Submit][Status][Discuss] ...

  5. selenium Chromediver

    Here we use wget to fetch the version number of the latest release, then plug the version into anoth ...

  6. ipyparallel WordCount实现

            ipyparallel 之中,可以利用多个engine同时运行一个任务来加快处理的速度.在ipyparallel之中,集群被抽象为view,包括direct_view和balanced ...

  7. Delphi拷贝目录(含子目录)的方法

    要实现目录级的拷贝,可以利用Windows API函数ShFileOperation( ),其函数声明如下: WINSHELLAPI int WINAPI SHFileOperation( LPSHF ...

  8. PHPcms 把盛大登陆换成人人网登陆

    首先要确保你的 phpcms是比较新的版本, v9.3以后的吧 这里说明一个函数 rawurlencode() 本函数将字符串编码成 URL 的字符串专用格式,特殊的字符会转换成百分比符号后面加上二个 ...

  9. --@angularJS--路由插件UI-Router

    UI-Router是angular路由插件,上一篇我们讲到了angularJS自带路由,可惜在路径嵌套上表现的有所欠缺,而angular-UI-Router插件正好弥补了这一点. [示例]: □.UI ...

  10. jquery.cookie实战用法详细解析

    Cookie是由服务器端生成,发送给User-Agent(一般是浏览器),浏览器会将Cookie的key/value保存到某个目录下的文本文件内,下次请求同一网站时就发送该Cookie给服务器(前提是 ...