123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366 |
- /**
- * 风羽功能
- * Created by Administrator on 2017/11/7.
- */
- define([], function () {
- var airPlume = {
- id: 'air',
- title: '风场', //风羽功能标题
- isInit: false,
- level: null, //当前要显示的风羽层级
- layer: null, //风羽所在地图图层id
- slat: null, //风羽图开始lat
- slng: null, //风羽图开始lng
- elat: null, //风羽图结束lat
- elng: null, //风羽图结束lng
- delta: null, //风羽图每个数据地理间隔
- rowNum: null, //lng跨度
- colNum: null, //lat跨度
- ws: null, //风速数组
- wd: null, //风向数组
- image: null, //风羽图标所在图片
- interval: 1, //风羽绘制间隔(控制风羽疏密程度)
- timeOutId: null,
- elem: 'WS',
- elem2: 'WD',
- level: null,
- levelName: {
- '9999': '10米',
- '0925': '925hPa',
- '0850': '850hPa',
- '0700': '700hPa',
- '0500': '500hPa'
- },
- buttons: {
- '9999': null,
- '0925': null,
- '0850': null,
- '0700': null,
- '0500': null
- },
- isHide: false,
- getData: function () { //获取风羽数据
- var dateStr = meteo.c.time.getTime();
- // var dateStr = '2018-01-07 14:00:00';
- var level = airPlume.level == '9999' ? '1000' : airPlume.level;
- var vti = meteo.c.time.getVti();
- var params = {
- dateStr: dateStr,
- vti: vti,
- elem: airPlume.elem,
- level: level
- }
- meteo.c.http.httpFunction(meteo.c.http.tData, null, params, function (json) {
- airPlume.slat = json.slat;
- airPlume.slng = json.slng;
- airPlume.elat = json.elat;
- airPlume.elng = json.elng;
- airPlume.delta = json.delta;
- airPlume.rowNum = json.rowNum;
- airPlume.colNum = json.colNum;
- airPlume.ws = json.vals;
- params.elem = airPlume.elem2;
- meteo.c.http.httpFunction(meteo.c.http.tData, null, params, function (json) {
- airPlume.wd = json.vals;
- meteo.c.title.updateTitle(airPlume.id,
- meteo.c.process.setTitleTime(json.odate, json.vti, airPlume.title, airPlume.levelName[airPlume.level]));
-
- $('#meteo-video-query-startDate').val(json.odate);
- airPlume.showAirplume();
- }, function () {
- // ONEMAP.C.publisher.publish({ type: 'warning', message: '暂无当前时次/层次风羽WD数据' }, 'noteBar::add');
- // meteo.c.title.updateTitle(airPlume.id, '暂无当前时次/层次风羽WD数据');
- // if (airPlume.layer.cLayer) {
- //
- // } else {
- // airPlume.close();
- // }
- });
- }, function () {
- // ONEMAP.C.publisher.publish({ type: 'warning', message: '暂无当前时次/层次风羽WS数据' }, 'noteBar::add');
- // meteo.c.title.updateTitle(airPlume.id, '暂无当前时次/层次风羽WS数据');
- // if (airPlume.layer.cLayer) {
- //
- // } else {
- // airPlume.close();
- // }
- });
- },
- showAirplume: function () { //在当前显示区域内绘制风羽
- if (!airPlume.layer) {
- return;
- }
- var zoom = meteo.c.map.getZoom();
- // airPlume.getAirPlumeLevel(zoom);
- var interval = zoom < 3 ? 8 :
- zoom < 4 ? 6 :
- zoom < 5 ? 4 :
- zoom < 6 ? 2 : 1;
- // var se = airPlume.getBounds();
- var se = meteo.c.map.getBounds();
- var layerId = meteo.c.map.createLayer();
- var layer = map2DViewer.groups[layerId];
- //------------------------------
- //计算当前屏幕内显示的风羽索引
- // var istart = se[0] - airPlume.slat / airPlume.delta >> 0;
- var istart = (airPlume.elat - se[2]) / airPlume.delta >> 0;
- var jstart = (se[1] - airPlume.slng) / airPlume.delta >> 0;
- if (istart < 0) istart = 0;
- if (jstart < 0) jstart = 0;
- var row = Math.abs(se[0] - airPlume.elat) / airPlume.delta + 1;
- var col = Math.abs(se[3] - airPlume.slng) / airPlume.delta + 1;
- if (row > airPlume.rowNum) row = airPlume.rowNum;
- if (col > airPlume.colNum) col = airPlume.colNum;
- for (var i = istart; i < row; i += interval) {
- for (var j = jstart; j < col; j += interval) {
- var lng = airPlume.slng + j * airPlume.delta;
- var lat = airPlume.elat - i * airPlume.delta;
- var ws = airPlume.ws[i][j]
- var wd = airPlume.wd[i][j]
- var icon = airPlume.getIcon(ws, wd, 30);
- L.marker([lat, lng], {icon: icon}).addTo(layer);
- }
- }
- if (!airPlume.layer || !airPlume.layer.tLayer || airPlume.isHide) {
- meteo.c.map.removeLayer(layerId);
- return;
- }
- if (airPlume.layer.cLayer != null) {
- meteo.c.map.removeLayer(airPlume.layer.cLayer);
- }
- airPlume.layer.cLayer = layerId;
- if (airPlume.timeOutId) airPlume.timeOutId = null;
- },
- getIcon: function (ws, wd, 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.translate(-a, -a);
- // var as = getWindImageX(ws);
- // var bs = getWindImageY(ws, false);
- ctx.drawImage(airPlume.image, airPlume.getWindImageX(ws), airPlume.getWindImageY(ws, false), 15, 31,
- 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;
- },
- getWindImageX: function (ws) {
- var index = ws > 72 ? 72 : ws;//最大72
- index = index < 0 ? 0 : index; //最小为0,同时0与1为同一张图片
- if (index < 3) { //当ws为1(包括0),取第0张图片 ws为2时,取第一张
- index = index >= 2 ? 1 : 0;
- } else {
- index = ((index + 1) / 2) >> 0;// 3和4为风速4,即第三张,则取角标2 依次类推
- }
- index = index % 10;
- return index * 16;
- },
- getWindImageY: function (ws, isGray) {
- var index = ws > 72 ? 72 : ws; //最大72
- index = index < 0 ? 0 : index; //最小为0,同时0与1为同一张图片
- if (ws < 3) { //当ws为1(包括0),取第0张图片 ws为2时,取第一张
- index = ws >= 2 ? 1 : 0;
- } else {
- index = ((ws + 1) / 2) >> 0;// 3和4为风速4,即第三张,则取角标2 依次类推
- }
- index = (index / 10) >> 0;
- if (isGray) {
- return index * 32 + 128;
- }
- return index * 32;
- },
- getAirPlumeLevel: function (zoom) { //根据地图缩放等级获取风羽疏密等级
- // var zoom = map2DViewer.map.getZoom();
- airPlume.interval = zoom < 3 ? 18 :
- zoom < 4 ? 12 :
- zoom < 5 ? 6 :
- zoom < 6 ? 2 : 1;
- },
- getBounds: function () { //获取当前显示范围
- var se = [];
- se.push(map2DViewer.map.getBounds().getSouthWest().lat);
- se.push(map2DViewer.map.getBounds().getSouthWest().lng);
- se.push(map2DViewer.map.getBounds().getNorthEast().lat);
- se.push(map2DViewer.map.getBounds().getNorthEast().lng);
- return se;
- },
- create: function () {
- airPlume.layer = {
- tLayer: meteo.c.map.createLayer(),
- cLayer: null,
- }
- },
- remove: function () {
- if (airPlume.layer) {
- meteo.c.map.removeLayer(airPlume.layer.tLayer);
- meteo.c.map.removeLayer(airPlume.layer.cLayer);
- airPlume.layer = null;
- }
- },
- show: function () {
- airPlume.isHide = false
- airPlume.showAirplume();
- },
- hide: function () {
- airPlume.isHide = true;
- if (airPlume.layer) {
- meteo.c.map.removeLayer(airPlume.layer.cLayer);
- airPlume.layer.cLayer = null;
- }
- },
- open: function () {
- if(ONEMAP.M.myLayers.checkLength() >= map23DConfig.layerMaxLength) {
- ONEMAP.C.publisher.publish({ type: 'warning', message: '图层数量已达上限' }, 'noteBar::add');
- return;
- }
- //-------------创建图层------------------
- if (airPlume.layer) {
- airPlume.close();
- }
- airPlume.create();
- //----------------图层管理-------------------
- var options = {
- action: "add",
- // mod: "qixiang",
- DOM: {
- guid: airPlume.layer.tLayer,
- type: "group",
- name: airPlume.title,
- },
- }
- var guid = ONEMAP.M.myLayers.myLayerControl(options);
- ONEMAP.C.publisher.subscribe(function (option) {
- switch (option.action) {
- case 'remove':
- airPlume.close();
- break;
- case 'opacity':
- if (option.options.opacity) {
- airPlume.show();
- } else {
- airPlume.hide();
- }
- break;
- }
- }, guid);
- //------------------勾选选择框及添加标题-------------------
- airPlume.buttons[airPlume.level].parent().addClass('current');
- meteo.c.title.addTitle(airPlume.id);
- meteo.c.time.open();
- //----------------------获取数据----------------------------
- airPlume.getData();
- //-----------------第一次开启功能时添加动态绘制--------------------
- // if (airPlume.isInit) return;
- // airPlume.isInit = true;
- // map2DViewer.map.on("moveend", function (e) {
- // if (airPlume.layer && airPlume.layer.cLayer) {
- // if (airPlume.timeOutId) { //如果有未开始的风羽绘制,就取消对应任务
- // window.clearTimeout(airPlume.timeOutId);
- // }
- // airPlume.timeOutId = window.setTimeout(function () {
- // airPlume.showAirplume();
- // }, 800)
- // }
- // });
- },
- close: function () { //关闭功能调用
- var options = {
- action: "remove",
- DOMid: airPlume.layer.tLayer,
- }
- ONEMAP.M.myLayers.myLayerControl(options);
- airPlume.buttons[airPlume.level].parent().removeClass('current');
- meteo.c.title.removeTitle(airPlume.id);
- meteo.c.time.close();
- airPlume.level = null;
- airPlume.remove();
- },
- onMove: function () { //移动地图时触发,控制当前是否需要重新绘制
- if (airPlume.layer && !airPlume.isHide && meteo.c.map.mapType == '2d') {
- if (airPlume.timeOutId) { //如果有未开始的风羽绘制,就取消对应任务
- window.clearTimeout(airPlume.timeOutId);
- }
- airPlume.timeOutId = window.setTimeout(function () {
- airPlume.showAirplume();
- }, 800)
- }
- },
- update: function () { //用于时间变化时更新数据
- if (!airPlume.layer || airPlume.isHide) return;
- // var option = {
- // action: 'update',
- // DOMid: airPlume.layer.tLayer,
- // DOM: {
- // name: '风羽' + meteo.c.time.getTimeOnTitle()
- // }
- // }
- // ONEMAP.M.myLayers.myLayerControl(option);
- airPlume.getData()
- },
- updateLevel: function () {
- airPlume.buttons[airPlume.level].parent().siblings().removeClass('current');
- airPlume.buttons[airPlume.level].parent().addClass('current');
- airPlume.getData();
- },
- click: function (level) {
- if (airPlume.level && level != airPlume.level) {
- airPlume.level = level;
- airPlume.updateLevel();
- } else {
- airPlume.level = level;
- if (airPlume.layer) {
- airPlume.close();
- } else {
- airPlume.open();
- }
- }
- },
- init: function () {
- airPlume.image = new Image();
- airPlume.image.src = meteo.c.http.myImageUrlJs + "windy.png";
- var buttons = $('.meteo-button-799');
- airPlume.buttons['9999'] = buttons.eq(16);
- airPlume.buttons['0925'] = buttons.eq(17);
- airPlume.buttons['0850'] = buttons.eq(18);
- airPlume.buttons['0700'] = buttons.eq(19);
- airPlume.buttons['0500'] = buttons.eq(20);
- }
- }
- meteo.f.air = airPlume;
- return meteo.f.air;
- })
|