zl程序教程

您现在的位置是:首页 >  后端

当前栏目

给栅格数据添加RasterFunction--自定义渲染方法

方法 -- 自定义 添加 渲染
2023-09-11 14:19:52 时间
<script type="text/javascript">
    /**
    dojo.require("esri.map");
    dojo.require("esri.layers.ArcGISImageServiceLayer");
    dojo.require("esri.layers.TimeInfo");
    dojo.require("esri.TimeExtent");
    dojo.require("esri.dijit.TimeSlider");
    dojo.require("dojo.dom");*/
    
      require([
        "esri/map", "esri/layers/ArcGISImageServiceLayer", 
        "esri/TimeExtent", "esri/layers/TimeInfo","esri/dijit/TimeSlider","esri/layers/RasterFunction",
         "dojo/dom", "dojo/domReady!"
      ], function(
        Map, ArcGISImageServiceLayer, 
        TimeExtent, TimeInfo,TimeSlider, dom
      ){
          //$("#dataTable").height($(window).height()-255);
        if(dijit.byId("timeSliderDiv")){
            dijit.byId("timeSliderDiv").destroy();    
        }
        timeSlider = new esri.dijit.TimeSlider({
            style: "width: 100%;"
        }, dojo.byId("timeSliderDiv"));
        
        var imageService = Application.configData.imageServices.get("DBZ");
        if(imageService && imageService.url){
            //
            var colorRF = new esri.layers.RasterFunction();  
            colorRF.functionName = "Colormap";    
            colorRF.functionArguments = {  
              "Colormap" : [  
                [4,0,159,245],
                [5,0,235,235],
                [6,0,215,0],
                [7,0,143,0],
                [8,254,254,0],
                [9,230,191,0],
                [10,254,143,0],
                [11,254,0,0],
                [12,213,0,0],
                [13,191,0,0],
                [14,254,0,239],
                [15,149,0,179],
                [16,172,143,239]
                ]
            };
            //
            colorRF.variableName  = "Raster";    
            //
            var imageServiceParameters = new esri.layers.ImageServiceParameters();
            //imageServiceParameters.noData = 0;
            imageServiceParameters.renderingRule = colorRF;            
                
            imageLayer = new esri.layers.ArcGISImageServiceLayer(imageService.url,{"imageServiceParameters":imageServiceParameters});
            //
            //
            imageLayer.on("load",initSlider);
            var map = Application.map;
            var layer = map.addLayer(imageLayer);
            //layer.setRenderingRule(colorRF);
        }
        
        function initSlider() {
          Application.map.setTimeSlider(timeSlider);
          
          timeSlider.setThumbCount(1);
        //  timeSlider.createTimeStopsByTimeInterval(timeExtent, 2, "esriTimeUnitsYears");
        if(imageLayer.timeInfo){
            timeSlider.createTimeStopsByTimeInterval(imageLayer.timeInfo.timeExtent,30,TimeInfo.UNIT_MINUTES);
        }
          timeSlider.setThumbMovingRate(1000);
          //timeSlider.singleThumbAsTimeInstant(true);
          timeSlider.setLoop(true);
          timeSlider.startup();
          
          for(var i=0;i<timeSlider.timeStops.length;i++){
              var date = timeSlider.timeStops[i];
              $("#dataTableBody").append("<tr onClick='onClickDataRow(event)' time='"+date.getTime()+"'><td align='center'>"+(i+1)+"</td><td align='center'>"+date.format("yyyy-MM-dd hh:mm:ss")+"</td>");
          }
          
          timeSlider.on("time-extent-change", function(evt) {
            //var startValString = evt.startTime.getUTCFullYear();
            var endValString = evt.endTime.getTime();
            //alert(endValString);
            //避免播放组件进入下一次循环播放
            if(endValString == timeSlider.timeStops[timeSlider.timeStops.length-1].getTime()){
                timeSlider.pause();
            }
            $("#dataTableBody").children().removeClass("active");
            //在列表中选中播放组件当前播放的影像
            $.each($("#dataTableBody").children(),function(i,item){
                if($(item).attr("time")==endValString){
                    $(item).addClass("active");
                }
            });
          });
          //播放组件默认播放当前最新的一张影像
          timeSlider.setThumbIndexes([timeSlider.timeStops.length-1]);
        }
        
      });

   </script>