• 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';
             },
  • 相关阅读:
    Asp.Net服务器Cassini
    Vista系统Administrator帐户的激活与禁用
    SqlServer中的Top * With Ties
    SqlServer建远程服务连接
    SqlServer2005安装成功后补加Sa用户
    列出某个表中所有的列名
    水晶报表周期性打开报表失败
    Asp.net中文cookie的乱码问题
    HTML数据库编程、JavaScript数据库编程
    试图索引的限制
  • 原文地址:https://www.cnblogs.com/tiandi/p/13209536.html
Copyright © 2020-2023  润新知