TDataView_ui/scripts/meteo/f/cloudMap.js

/**
 * Created by Administrator on 2017/10/31.
 * 云图类
 */
define(['modDir/menu/myLayerActions'], function (_myLayerActions) {
    var cloud = {
        id: 'cloud',
        title: '风云2 云图',

        data: null,                     //云图数据存储位置
        playId: null,                   //云图动画任务id
        //imgOverlay: null,               //云图覆盖物对象
        layer: null,
        showIndex: null,                   //正在被显示的云图索引
        isHide: false,                //是否被隐藏
        type: {
            ch1: '(红外一)',
            ch3: '(水汽)',
            ch4: '(可见光)'
        },
        showType: null,
        getCloudData: function () {     //获取云图数据
            // var dateStr = meteo.c.time.getTime();
            var dateStr = new Date();
            dateStr = dateStr.getFullYear() + "-" + (dateStr.getMonth() + 1) + "-" + dateStr.getDate()
                 + " " + dateStr.getHours() + ":00";
            // var dateStr = '2018-07-12 20:00';
            var params = {
                dateStr: dateStr,
                ch: cloud.showType
            }
            meteo.c.http.httpFunction(meteo.c.http.cloud, null, params, function (json) {
                cloud.data = json;
                cloud.showList();
                cloud.loadImage();
            }, function () {
                ONEMAP.C.publisher.publish({type: 'warning', message: '当前通道云图暂无数据'}, 'noteBar::add');
            })
            //开启侧栏
            var zIndex = ONEMAP.M.sideBar.getZIndex();
            $('#meteo-control-cloud').css({zIndex: zIndex});
            ONEMAP.D.currentSideBarMod = 'atlas';
            ONEMAP.C.publisher.publish('handShow', 'layout::sideBar');
        },
        showList: function () {
            cloud.isHide = false;
            var content = '';
            for (var i = 0; i < cloud.data.length; i++) {
                content += " <li class='meteo-twoLi meteo-lastLi'>" +
                    "<a href='javascript:;' id='meteo-cloud-item" + i + "' class='meteo-twoBtn meteo-lastBtn meteo-typh-item'"
                    + " onclick='meteo.f.cloud.clickCloudList(" + i + ")'>";

                // content += typhoon.getId(adata.id) + "  " + adata.cname + "  " + adata.ccc;
                // var odate = json[i].odate ? json[i].cname : json[i].ename;
                content += cloud.data[i].odate;
                content += "</a></li>";
            }
            $('#meteo-list-cloud').html(content);
            cloud.clickCloudList(cloud.data.length - 1);
        },
        clickCloudList: function (index) {
            // if (!cloud.layer || !cloud.layer.imgOverlay) return;    //如果当前云图图层隐藏，则不显示
            if (cloud.isHide) return;
            if (cloud.showIndex == index) return;                     //已被显示，则不继续显示
            if (!cloud.layer) return;

            // $("#meteo-bt-cloud-" + cloud.showType).parent().addClass('current');
            $('#meteo-cloud-item' + cloud.showIndex).parent().removeClass('current');
            $("#meteo-cloud-item" + index).parent().addClass('current');  //
            cloud.showIndex = index;
            var time = cloud.data[index].odate;
            meteo.c.title.updateTitle(cloud.id, meteo.c.process.setCloudTitle(time, cloud.title, cloud.type[cloud.showType]));

            cloud.showCloud();
        },
        showCloud: function (opacity) {   //临时使用的云图显示
            // var layerid = meteo.f.cloud.layer.tLayer;
            // var layer = map2DViewer.groups[layerid];

            // var url = meteo.c.http.myUrl + "scripts/meteo/test/cloud/" +
            //     'CLOUD_2017122500_ch1_mkt.fy2.png';

            // var cloudImageNew = L.imageOverlay(
            //     json.url,
            //     L.latLngBounds(L.latLng(json.slat, json.slng), L.latLng(json.elat, json.elng))
            //     // L.latLngBounds(L.latLng(-9, 85), L.latLng(40, 160))
            // ).addTo(layer);
            var data = meteo.f.cloud.data[cloud.showIndex].data;
            data = JSON.parse(data);
            var cloudImageNew = meteo.c.map.addImage(data.url, data.slat, data.slng, data.elat, data.elng, opacity);

            if (!cloud.layer || !cloud.layer.tLayer || cloud.isHide) {
                meteo.c.map.removeLayer(cloudImageNew);
                return;
            }
            if (cloud.layer.imgOverlay) {
                meteo.c.map.removeImage(cloud.layer.imgOverlay);
            }
            cloud.layer.imgOverlay = cloudImageNew;
        },
        loadImage: function () {
            for (var i = 0; i < cloud.data.length; i++) {
                var url = JSON.parse(cloud.data[i].data).url;
                var img = $('<img />').attr('src', url);
                img = null;
            }
        },
        create: function () {
            cloud.layer = {
                tLayer: meteo.c.map.createLayer(),
                // cLayer: meteo.c.map.createLayer(),
                imgOverlay: null,
            }
        },
        remove: function () {
            if (cloud.layer) {
                meteo.c.map.removeLayer(cloud.layer.tLayer);
                cloud.removeImage();
                cloud.layer = null;
            }
        },
        removeImage: function () {
            if (cloud.layer && cloud.layer.imgOverlay) {
                meteo.c.map.removeImage(cloud.layer.imgOverlay);
                cloud.layer.imgOverlay = null;
            }
        },
        show: function () {
            cloud.isHide = false;
            cloud.showCloud();
        },
        hide: function () {
            cloud.isHide = true;
            if (cloud.playId) {
                cloud.clearPlay();
            }
            cloud.removeImage();
        },
        open: function (type) {
            if (ONEMAP.M.myLayers.checkLength() >= map23DConfig.layerMaxLength) {
                ONEMAP.C.publisher.publish({type: 'warning', message: '图层数量已达上限'}, 'noteBar::add');
                return;
            }
            //-------------创建图层------------------
            if (cloud.layer) {
                cloud.close();
            }
            cloud.create();
            //----------------图层管理-------------------
            var options = {
                action: "add",
                // mod: "qixiang",
                DOM: {
                    guid: cloud.layer.tLayer,
                    type: "group",
                    name: cloud.title + cloud.type[type],
                },
            }

            var guid = ONEMAP.M.myLayers.myLayerControl(options);
            ONEMAP.C.publisher.subscribe(function (option) {
                switch (option.action) {
                    case 'remove':
                        cloud.close();
                        break;
                    case 'opacity':
                        if (option.options.opacity) {
                            cloud.show();
                        } else {
                            cloud.hide();
                        }
                        // cloud.updateOpacity(option.options.opacity);
                        break;
                }
            }, guid);
            //-------------------------------------
            $('#meteo-bt-cloud-ch1').parent().removeClass('current');
            $('#meteo-bt-cloud-ch3').parent().removeClass('current');
            $('#meteo-bt-cloud-ch4').parent().removeClass('current');
            $("#meteo-bt-cloud-" + type).parent().addClass('current');
            //------------------------------------------
            meteo.c.title.addTitle(cloud.id);
            //--------------------------------------
            cloud.showType = type;
            cloud.getCloudData();
        },
        close: function () {
            if (cloud.playId) {
                cloud.clearPlay();
            }
            var options = {
                action: "remove",
                DOMid: cloud.layer.tLayer,
            }
            ONEMAP.M.myLayers.myLayerControl(options);

            $("#meteo-bt-cloud-" + cloud.showType).parent().removeClass('current');
            meteo.c.title.removeTitle(cloud.id);

            $('#meteo-cloud-item' + cloud.showIndex).parent().removeClass('current');
            cloud.showIndex = null;
            cloud.remove();

            $('#meteo-list-cloud').html('');   //关闭时清空列表
        },
        updateOpacity: function (opacity) {     //透明度调整（仅限二维地图
            if (!cloud.layer || !cloud.layer.imgOverlay) return;
            // cloud.showCloud(opacity);

            meteo.c.map.upDateImage(cloud.layer.imgOverlay, opacity);
        },
        init: function () {
            $('#meteo-bt-cloud-ch1').click(function () {    //红外一通道
                if (cloud.layer && cloud.showType == 'ch1') {
                    cloud.close();
                } else {
                    cloud.open('ch1');
                }
            });

            $('#meteo-bt-cloud-ch4').click(function () {    //可见光
                if (cloud.layer && cloud.showType == 'ch4') {
                    cloud.close();
                } else {
                    cloud.open('ch4');
                }
            });

            $('#meteo-bt-cloud-ch3').click(function () {    //水汽通道
                if (cloud.layer && cloud.showType == 'ch3') {
                    cloud.close();
                } else {
                    cloud.open('ch3');
                }
            });

            $('#meteo-bt-cloud-paly').click(function () {
                cloud.play();
            });
            // _myLayerActions.init();
        },
        play: function () {             //云图动画
            if (cloud.isHide) return;
            if (!cloud.layer) return;
            if (cloud.playId) {
                cloud.clearPlay();
            } else {
                cloud.playId = window.setInterval(function () {
                    var index = cloud.showIndex + 1;
                    if (index == cloud.data.length) {
                        index = 0;
                    }
                    cloud.clickCloudList(index);
                }, 1000);
                $('#meteo-bt-cloud-paly').addClass('current');
            }
        },
        clearPlay: function () {
            window.clearInterval(cloud.playId);
            $('#meteo-bt-cloud-paly').removeClass('current');
            cloud.playId = null;
        }
    }
    meteo.f.cloud = cloud;
    return meteo.f.cloud;
})

// showCloud: function (type, json) {        //根据索引 显示云图
//     var data = cloud.data[cloud.showIndex];
//     var layerid = meteo.c.map.createLayer();
//     var imageO = map2DViewer.groups[layerid];
//
//     var cloudImageNew = L.imageOverlay(
//         data.url,
//         L.latLngBounds(L.latLng(data.slat, data.slng), L.latLng(data.elat, data.elng))
//     ).addTo(imageO);
//
//     cloudImageNew.on("load", function (e) {
//         if (cloud.imgOverlay) {
//             meteo.c.map.removeLayer(cloud.imgOverlay);
//         }
//         cloud.imgOverlay = layerid;
//     });
//     if (cloud.title) {
//         meteo.c.title.removeTitle(cloud.title);
//     }
//     cloud.title = "云图 " + cloud.data[cloud.showIndex].time;
//     meteo.c.title.addTitle(cloud.title);
// },