GEOJSON 的渲染实例
createGeojson:function(arr)
{
let geoArr=[];
for(let i=0;i<arr.length;i++)
{
let obj={
"type": "Feature",
"properties": {"value": -999},
"geometry": {
"type": "Polygon",
"coordinates": null}
}
if(arr[i].value==0)
{
arr[i].value=-999;
}
obj.properties={"value": arr[i].value};
obj.geometry.coordinates=this.getGeometry(arr[i].lon,arr[i].lat);
geoArr.push(obj);
}
console.log(geoArr) if (this.flexpartlayer)
{
if (this.map.hasLayer(this.flexpartlayer))
{
this.map.removeLayer(this.flexpartlayer);
}
}
this.flexpartlayer = L.geoJson(geoArr, {style: this.style});
this.map.addLayer(this.flexpartlayer); // this.timer = setTimeout(function(){
// _self.clearFlexLayer();
// },10000)
},
clearFlexLayer:function()
{
if (this.flexpartlayer)
{
if (this.map.hasLayer(this.flexpartlayer))
{
this.map.removeLayer(this.flexpartlayer);
}
}
_self.flexTxt="";
},
//生成格点polygon
getGeometry:function(lon,lat){
//数据精度是0.003,300米
let minx=lon-0.0015;
let miny=lat-0.0015;
let maxx=lon+0.0015;
let maxy=lat+0.0015;
return [[
[minx, miny],
[maxx, miny],
[maxx, maxy],
[minx, maxy],
[minx, miny]
]]; },
//polygon的样式
style:function(feature)
{
let alpha=feature.properties.value===-999?0:0.8; return {
weight: 1,
opacity: 0,
color: '#fff',
fillOpacity: alpha,
fillColor: this.getColor(feature.properties.value)}
},
//polygon填充的颜色
getColor:function(d) {
return d > Math.pow(10,-9) ? '#C5004A' :
d > Math.pow(10,-10) ? '#DC4A1C' :
d > Math.pow(10,-11) ? '#FEBA00' :
d > Math.pow(10,-12) ? '#FFFF00' :
d > Math.pow(10,-13) ? '#00EA00' :
d > Math.pow(10,-14) ? '#0CEFA6' :
d > Math.pow(10,-15) ? '#25C7CD' :
'#259ECD';
},
GEOJSON 的渲染实例的更多相关文章
- handsontable 渲染实例
单元格选择完成后将触发事件afterSelectionEnd, 然后在js中: hot.addHook('afterSelectionEnd', function(r, c, r2, c2){ // ...
- OpenGL学习日记-2015.3.13——多实例渲染
实例化(instancing)或者多实例渲染(instancd rendering)是一种连续运行多条同样渲染命令的方法.而且每一个命令的所产生的渲染结果都会有轻微的差异. 是一种很有效的.有 ...
- Linux OpenGL 实践篇-14-多实例渲染
多实例渲染 OpenGL的多实例渲染是一种连续执行多条相同的渲染命令的方法,并且每条命令产生的结果都有轻微的差异,通常用于渲染大量的几何物体. 设想一个场景,比如太空,我们需要渲染数以万记的星球,如果 ...
- 70部MAYA灯光材质渲染教程合集
MAYA灯光材质渲染教程合集 教程格式:MP4和flv 两种格式 使用版本:教程不是一年出的教程,各个版本都有 (教程软件为英文版) 清晰度:可以看清软件上的文字 语言:部分中文字幕,其他英文(通过看 ...
- vue 学前班002(创建一个实例)
创建一个Vue实例 我们之前说过,Vue是数据驱动视图的,只要model(模型层)的数据改变了,Vue就会帮我们改变视图上显示的内容,不用我们自己去动手写代码更新.那么,它是怎么做到的,我们的代码要怎 ...
- World Wind Java开发之十——AnalyticSurface栅格渲染(转)
http://blog.csdn.net/giser_whu/article/details/43017881 1.AnalyticSurfaceDemo ArcGIS下对栅格的各种分级渲染效果是非常 ...
- Directx11教程(52) 实例(instancing)的简单应用
原文:Directx11教程(52) 实例(instancing)的简单应用 有些时候,我们需要在场景中渲染大量的重复的物体,比如体育场中的观众,森林里面的树木等等,这些物体具有相似的形状,比如很多树 ...
- 11个很棒的 jQuery 图表库
如果你曾经使用过任何类型的数据,你应该知道阅读一排排数据的痛苦.通过所有这些数据弄清楚他们的意思是非常不容易的.可视化对于解决这个问题起到了重要的作用.可视化降低了数据阅读的难度,帮助决策者获得可操作 ...
- 微信小程序入门(三)
11.开发框架基本介绍 四个组成部分,其它三个前面介绍过了,主要WXS: WXS:对wxml增强的一种脚本语言,可以对请求的数据进行filter或者做计算处理,帮助wxml快速构建出页面结构. 12. ...
- WPF调用zxing生成二维码
1.登录http://zxingnet.codeplex.com/,下载对应.net版本的zxing库 2.引入zxing.dll 3.新建界面控件 using System; using Syste ...
随机推荐
- Matplotlib绘图设置--- 图例设置
plt.legend()和ax.legend()参数设置 自动会将每条线的标签与其风格.颜色进行匹配. plt.legend(*args, **kwargs) Place a legend on th ...
- opengauss数据库-主从搭建
opengauss 数据库-主从搭建 环境说明 软件下载 opengauss 下载地址:https://opengauss.org/zh/download/ 环境准备 关闭 SELINUX 修改 /e ...
- 使用PTK卸载数据库时删除用户失败怎么办?
使用 PTK 卸载数据库时删除用户失败怎么办? 背景介绍: PTK (Provisioning Toolkit)是一款针对 MogDB 数据库开发的软件安装和运维工具,旨在帮助用户更便捷地安装部署 M ...
- 痞子衡嵌入式:使能i.MXRT1050,1060 Hab签名或加密启动时App链接在片内SRAM的限制
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是使能i.MXRT1050, 1060 Hab签名或加密启动时App链接在片内SRAM的限制. 最近有客户反馈,在 RT1060 上测试 ...
- 编程小白也能快速掌握的ArkUI JS组件开发
原文:https://mp.weixin.qq.com/s/ByxCMvtxaNuKI_6cXgtLBg,点击链接查看更多技术内容. Playground自上线以来,得到了广大开发者的一致好评.特别是 ...
- Thymeleaf SSTI模板注入分析
环境搭建 先搭建一个SpringMVC项目,参考这篇文章,或者参考我以前的spring内存马分析那篇文章 https://blog.csdn.net/weixin_65287123/article/d ...
- 重新点亮linux 命令树————修改网络配置[十一四]
前言 整理一下网络配置的修改. 正文 网络配置命令 ifconfig <接口> <ip地址> [netmask 子网掩码] ifup <接口> ifdown < ...
- 《c#高级编程》第4章C#4.0中的更改(七)——命名参数和可选参数
一.概念 C#中的命名参数和可选参数是两种函数参数的特殊形式,它们可以提高代码的可读性和灵活性. 命名参数 命名参数允许我们在调用函数时指定参数名称,从而不必按照函数定义时的参数顺序进行传参.这样做可 ...
- 一文详解 Serverless 架构模式
什么是 Serverless 架构?按照 CNCF 对 Serverless 计算的定义,Serverless 架构应该是采用 FaaS(函数即服务)和 BaaS(后端服务)服务来解决问题的一种设计. ...
- 兑现 Service Mesh 的新价值:精确控制“爆炸半径”
简介:本文分享了阿里云内部所沉淀的全链路流量打标与路由的能力,做出服务网格技术新体验的同时,很好地兑现了服务网格的新价值. 作者:至简 软件是以持续迭代的方式去不断演进的.某种程度上,我们并不担心软 ...