/** * 海浪 浪高 */ define(['meteoDir/other/smooth'], function (smooth) { var wave = { id: 'wave', title: '海浪', legend: 'images/meteo/legend/wave.png', slat: null, //开始lat slng: null, //开始lng elat: null, //结束lat elng: null, //结束lng delta: null, //每个数据地理间隔 rowNum: null, //lng跨度 colNum: null, //lat跨度 wd: null, //流向数组 image: null, //图标所在图片 interval: 1, //绘制间隔(控制疏密程度) timeOutId: null, elem: 'HS', layer: null, //为了方便图层控制,使用了一个对象来控制多个图层 isInit: false, isoData: null, data: null, isHide: false, getData: function () { var dateStr = meteo.c.time.getTime(); var vti = meteo.c.time.getVti(); var params = { elem: wave.elem, level: '9999', vti: vti, dateStr: dateStr, }; var params2 = { vti: vti, dateStr: dateStr, }; // meteo.c.http.httpFunction(meteo.c.http.oceanD, null, params2, function (json) { //海浪方向 // wave.slat = json.slat; // wave.slng = json.slng; // wave.elat = json.elat; // wave.elng = json.elng; // wave.delta = json.delta; // wave.rowNum = json.rowNum; // wave.colNum = json.colNum; // wave.wd = json.vals; meteo.c.http.httpFunction(meteo.c.http.oceanCI, null, params, function (json) { meteo.c.title.updateTitle(wave.id, meteo.c.process.setTitleTime(json.odate, json.vti, wave.title, '')); $('#meteo-video-query-startDate').val(json.odate); json = JSON.parse(json.data); wave.data = json; wave.showWave(json); }, function () { // ONEMAP.C.publisher.publish({ type: 'warning', message: '浪高暂无当前时次/层次数据' }, 'noteBar::add'); // meteo.c.title.updateTitle(wave.id, '浪高暂无当前时次/层次数据'); }); // }, function () { // }) params.vti = parseInt(vti) + 3; meteo.c.http.httpFunction(meteo.c.http.oceanCI, null, params, function (json) { json = json.data; json = JSON.parse(json); wave.loadImage(json); }, function () { }) // meteo.c.http.httpFunction(meteo.c.http.oceanC, null, params, function (json) { // wave.isoData = json['000_HS_9999']; // var params2 = {}; // // }) }, showWave: function (data) { var images = []; var latI = (data.elat - data.slat) / data.row; var lngI = (data.elng - data.slng) / data.col; for (var i = 0; i < data.files.length; i++) { var value = data.files[i]; if (value) { var str = value.split("\.")[0]; str = str.split("_"); var x = str[0]; var y = str[1]; var slat = data.slat + x * latI; var slng = data.slng + y * lngI; var elat = slat + latI; var elng = slng + lngI; elat = elat > data.elat ? data.elat : elat; elng = elng > data.elng ? data.elat : elng; images.push(meteo.c.map.addImage(data.url + value + '.mkt', slat, slng, elat, elng)); // L.imageOverlay( // data.url + value + '.mkt', // // "scripts/meteo/test/wyl/WYL_2017122320_000_TT_0000_" + x + "_" + y + ".png.mkt", // L.latLngBounds(L.latLng(slat, slng), L.latLng(elat, elng)) // ).addTo(layer); } } if (!wave.layer|| !wave.layer.tLayer || wave.isHide) { for (var i = 0; i < images.length; i++) { meteo.c.map.removeImage(images[i]); } } else { if (wave.layer.images) { wave.removeImage(); } wave.layer.images = images; } // setTimeout(function () { // // }, 300); // wave.showWaveWD(); }, loadImage:function (data) { //预先加载图片 for (var key in data.files) { var value = data.files[key]; if (value) { var url = data.url + value + '.mkt'; var img = $('').attr('src', url); img = null; } } }, showWaveWD: function () { if (!wave.layer) { return; } //计算当前屏幕内显示的索引 var zoom = meteo.c.map.getZoom(); var interval = zoom < 4 ? 10 : zoom < 5 ? 8 : zoom < 6 ? 6 : zoom < 7 ? 4 : zoom < 8 ? 2 : 1; var se = meteo.c.map.getBounds(); var layerId = meteo.c.map.createLayer(); var layer = map2DViewer.groups[layerId]; //计算流向绘制屏幕内的初始索引 var istart = (wave.elat - se[2]) / wave.delta >> 0; var jstart = (se[1] - wave.slng) / wave.delta >> 0; if (istart < 0) istart = 0; if (jstart < 0) jstart = 0; //计算流向绘制屏幕内的最大索引 var row = Math.abs(se[0] - wave.elat) / wave.delta + 1; // var row = Math.abs(se[2] - wave.slat) / wave.delta + 1; var col = Math.abs(se[3] - wave.slng) / wave.delta + 1; if (row > wave.rowNum) row = wave.rowNum; if (col > wave.colNum) col = wave.colNum; for (var i = istart; i < row; i += interval) { for (var j = jstart; j < col; j += interval) { var lat = wave.elat - i * wave.delta; var lng = wave.slng + j * wave.delta; var wd = wave.wd[i][j]; // if (wd == 0 || wd == -9999) continue; // if (wd == -9999) continue; if (wd < 0) continue; var icon = wave.getIcon(wd, 30); L.marker([lat, lng], {icon: icon}).addTo(layer); // meteo.c.map.addText('', i + "*" + j, 16, "#000000", 1, lat, lng, layerId); //打印数据 } } if (!wave.layer || !wave.layer.tLayer || wave.isHide) { meteo.c.map.removeLayer(layerId); return; } if (wave.layer.cLayer != null) { meteo.c.map.removeLayer(wave.layer.cLayer); } wave.layer.cLayer = layerId; //判断延时是否取消 if (wave.timeOutId) wave.timeOutId = null; }, getIcon: function (wd, size) { //获得图标 size = size; var width = size * 1.2; var a = size * 0.6; var b = size / 2; var canvas = document.createElement('canvas'); canvas.width = width; canvas.height = width; if (canvas.getContext) { //获取对应的CanvasRenderingContext2D对象(画笔) var ctx = canvas.getContext("2d"); ctx.save(); ctx.translate(a, a); ctx.rotate(wd * Math.PI / 180); // ctx.rotate(0.5 * Math.PI); // ctx.rotate(wd); ctx.translate(-a, -a); ctx.drawImage(wave.image, a - b / 2, a - b, b, size); ctx.restore(); var url = canvas.toDataURL('image/png'); return L.icon({ iconUrl: url, iconSize: [size, size], iconAnchor: [size / 2, size / 2], }); } return null; }, create: function () { wave.layer = { tLayer: meteo.c.map.createLayer(), //图层控制 // cLayer: null, //等值线图层 images: null, //图片图层列表 } }, remove: function () { if (wave.layer) { meteo.c.map.removeLayer(wave.layer.tLayer); // meteo.c.map.removeLayer(wave.layer.cLayer); wave.removeImage(); wave.layer = null; } }, removeImage: function () { if (wave.layer.images) { for (var i = 0; i < wave.layer.images.length; i++) { meteo.c.map.removeImage(wave.layer.images[i]); } wave.layer.images = null; } }, show: function () { wave.isHide = false; wave.showWave(wave.data); }, hide: function () { wave.isHide = true; if (wave.layer) { // meteo.c.map.removeLayer(wave.layer.cLayer); wave.removeImage(); } }, open: function () { if (ONEMAP.M.myLayers.checkLength() >= map23DConfig.layerMaxLength) { ONEMAP.C.publisher.publish({type: 'warning', message: '图层数量已达上限'}, 'noteBar::add'); return; } //-------------创建图层------------------ if (wave.layer) { wave.remove(); } wave.create(); //----------------图层管理------------------- var options = { action: "add", // mod: "qixiang", DOM: { guid: wave.layer.tLayer, type: "group", name: wave.title, }, } var guid = ONEMAP.M.myLayers.myLayerControl(options); ONEMAP.C.publisher.subscribe(function (option) { switch (option.action) { case 'remove': wave.close(); break; case 'opacity': if (option.options.opacity) { wave.show(); } else { wave.hide(); } break; } }, guid); //------------------------------------- $("#meteo-bt-wave").parent().addClass('current'); meteo.c.title.addTitle(wave.id); meteo.c.legend.addLegend(wave.id, wave.legend); meteo.c.time.open(true); wave.isHide = false; wave.getData(); }, close: function () { var options = { action: "remove", DOMid: wave.layer.tLayer, } ONEMAP.M.myLayers.myLayerControl(options); $("#meteo-bt-wave").parent().removeClass('current'); meteo.c.title.removeTitle(wave.id); meteo.c.legend.removeLegend(wave.id); meteo.c.time.close(); wave.remove(); }, onMove: function () { // if (wave.layer && !wave.isHide && meteo.c.map.mapType == '2d') { // if (wave.timeOutId) { //如果有未开始的流向绘制,就取消对应任务 // window.clearTimeout(wave.timeOutId); // } // wave.timeOutId = window.setTimeout(function () { // wave.showWaveWD(); // }, 800) // } }, update: function () { //用于时间变化时更新数据 if (!wave.layer || wave.isHide) return; // var option = { // action: 'update', // DOMid: wave.layer.tLayer, // DOM: { // name: '海浪浪高' // } // } // ONEMAP.M.myLayers.myLayerControl(option); wave.getData() }, init: function () { wave.image = new Image(); wave.image.src = meteo.c.http.myImageUrlJs + "oceanCurrent/red.png"; $('#meteo-bt-wave').click(function () { if (meteo.f.wave.layer) { meteo.f.wave.close(); } else { meteo.f.wave.open(); } }); } } meteo.f.wave = wave; return meteo.f.wave; })