| | |
| | | this.m = $(dom); |
| | | this.div = $(div); |
| | | this.mapId = $(map); |
| | | this.__xx = null;//鼠标实时位置 |
| | | this.__xx = null; //鼠标实时位置 |
| | | this.__yy = null; |
| | | this.__sx = null;//鼠标开始位置 |
| | | this.__sx = null; //鼠标开始位置 |
| | | this.__sy = null; |
| | | this.__dx = null;//dom位置 |
| | | this.__dx = null; //dom位置 |
| | | this.__dy = null; |
| | | this.mapH = null;//地图高度 |
| | | this.__wy = null;//屏幕高度 |
| | | this.state = "up";//dom状态默认up |
| | | this.mapH = null; //地图高度 |
| | | this.__wy = null; //屏幕高度 |
| | | this.state = "up"; //dom状态默认up |
| | | |
| | | this.getMosePosition = (x, y) => {//获取鼠标位置 |
| | | this.getMosePosition = (x, y) => { //获取鼠标位置 |
| | | this.__sx = x; |
| | | this.__sy = y; |
| | | // console.log(this.__sy, '鼠标开始'); |
| | | |
| | | } |
| | | this.getDomPosition = () => {//获取dom位置 |
| | | this.getDomPosition = () => { //获取dom位置 |
| | | this.__dx = this.m.offset().left; |
| | | this.__dy = this.m.offset().top; |
| | | this.__wy = document.documentElement.clientHeight; |
| | | // console.log(this.__dy, 'dom'); |
| | | } |
| | | this.getMapHeight = () => {//获取地图高度 |
| | | this.getMapHeight = () => { //获取地图高度 |
| | | var that = this; |
| | | this.mapId.css("height", (index, value) => { |
| | | that.mapH = parseFloat(value); |
| | | }) |
| | | // console.log(that.mapH, 'map位置'); |
| | | that.mapH = parseFloat(value); |
| | | }) |
| | | // console.log(that.mapH, 'map位置'); |
| | | } |
| | | this.changeDomPosition = (x, y, dy) => {//改变dom位置 |
| | | this.changeDomPosition = (x, y, dy) => { //改变dom位置 |
| | | var that = this; |
| | | // this.mapId.css("height", (index, value) => {//改变地图高度 |
| | | // var h = this.mapH + y; |
| | |
| | | |
| | | |
| | | //begin |
| | | this.followFinger = (map, state = 14) => {//(地图实例,dom状态判断是向上还是向下) |
| | | this.followFinger = (map, state = 14) => { //(地图实例,dom状态判断是向上还是向下) |
| | | // console.log('开始跟随手指'); |
| | | var that = this; |
| | | if(state != 14){ |
| | | if (state != 14) { |
| | | that.state = state; |
| | | // console.log(that.state); |
| | | } |
| | | that.getDomPosition();//获取dom位置 |
| | | that.getMapHeight();//获取地图高度 |
| | | that.getDomPosition(); //获取dom位置 |
| | | that.getMapHeight(); //获取地图高度 |
| | | var once = true; |
| | | that.div.on('touchmove', function (e) {//获取鼠标位置 |
| | | that.div.on('touchmove', function(e) { //获取鼠标位置 |
| | | e = e || window.event; |
| | | that.__xx = e.touches[0].clientX; |
| | | that.__yy = e.touches[0].clientY; |
| | | if (once) {//获取第一次点击的位置 |
| | | if (once) { //获取第一次点击的位置 |
| | | once = false; |
| | | that.getMosePosition(that.__xx, that.__yy); |
| | | } |
| | | // console.log(that.__yy, '鼠标'); |
| | | var h = that.__yy - that.__sy//鼠标移动距离y |
| | | var h = that.__yy - that.__sy //鼠标移动距离y |
| | | |
| | | if (that.state == 'down') {//两种模式 |
| | | if (that.state == 'down') { //两种模式 |
| | | // console.log(that.state); |
| | | if (h >= 0 && h + that.__dy <= that.__wy - 20) { |
| | | that.changeDomPosition(0, h, h + that.__dy);//改变位置 |
| | | that.changeDomPosition(0, h, h + that.__dy); //改变位置 |
| | | // console.log(that.state,h + that.__dy,112); |
| | | } |
| | | } else if (that.state == 'up') { |
| | | if (h >= -that.__dy && h <= that.__wy - 20) { |
| | | that.changeDomPosition(0, h, h + that.__wy - 20);//改变位置 |
| | | that.changeDomPosition(0, h, h + that.__wy - 20); //改变位置 |
| | | // console.log(that.state,h + that.__wy - 20,112); |
| | | } |
| | | } |
| | | |
| | | }); |
| | | that.div.on('touchend', function () {//抬起重置 |
| | | once = true;//抬起重置鼠标点击位置 |
| | | if (that.state == 'down') {//两种模式 |
| | | var chous = Math.abs(that.__yy - that.__sy) < that.__wy / 8; |
| | | that.div.on('touchend', function() { //抬起重置 |
| | | once = true; //抬起重置鼠标点击位置 |
| | | var chous = null; |
| | | if (that.state == 'down') { //两种模式 |
| | | // var chous = Math.abs(that.__yy - that.__sy) < that.__wy / 4; |
| | | chous = (that.__sy - that.__yy) < 0; |
| | | } else if (that.state == 'up') { |
| | | var chous = Math.abs(that.__yy - that.__sy) > that.__wy / 8; |
| | | // var chous = Math.abs(that.__yy - that.__sy) > that.__wy / 4; |
| | | chous = (that.__sy - that.__yy) < 0; |
| | | } |
| | | if (chous) { |
| | | that.changeDomPosition(0, 0, (parseFloat(that.__wy / 10) * 2.999));//改变位置 |
| | | if (!chous) { |
| | | //改变dom位置 |
| | | that.changeDomPosition(0, 0, (parseFloat(that.__wy / 10) * 3.999)); |
| | | // that.getDomPosition();//抬起获取dom位置/持续停留使用 |
| | | that.state = 'down'; |
| | | $('#map').css("height", (index, value) => {//改变地图高度 |
| | | $('#map').css("height", (index, value) => { //改变地图高度 |
| | | return '50%'; |
| | | }) |
| | | map.invalidateSize(true);//应用地图高度 |
| | | map.invalidateSize(true); //应用地图高度 |
| | | } else { |
| | | that.changeDomPosition(0, 0, that.__wy - 80);//改变位置 |
| | | // that.changeDomPosition(0, 0, that.__wy - 50); //改变位置 |
| | | that.changeDomPosition(0, 0, that.__wy); //改变位置 |
| | | // that.getDomPosition();//抬起获取dom位置/持续停留使用 |
| | | that.state = 'up'; |
| | | $('#map').css("height", (index, value) => {//改变地图高度 |
| | | $('#map').css("height", (index, value) => { //改变地图高度 |
| | | return '100%'; |
| | | }) |
| | | map.invalidateSize(true);//应用地图高度 |
| | | map.invalidateSize(true); //应用地图高度 |
| | | } |
| | | that.getMapHeight();//抬起获取map高度 |
| | | that.getMapHeight(); //抬起获取map高度 |
| | | }); |
| | | } |
| | | this.destruction = () => {//初始化销毁 |
| | | this.destruction = () => { //初始化销毁 |
| | | this.m = $(dom); |
| | | this.div = $(div); |
| | | this.mapId = $(map); |
| | | this.__xx = null;//鼠标实时位置 |
| | | this.__xx = null; //鼠标实时位置 |
| | | this.__yy = null; |
| | | this.__sx = null;//鼠标开始位置 |
| | | this.__sx = null; //鼠标开始位置 |
| | | this.__sy = null; |
| | | this.__dx = null;//dom位置 |
| | | this.__dx = null; //dom位置 |
| | | this.__dy = null; |
| | | this.mapH = null;//地图高度 |
| | | this.__wy = null;//屏幕高度 |
| | | this.state = "up";//dom状态默认up |
| | | this.mapH = null; //地图高度 |
| | | this.__wy = null; //屏幕高度 |
| | | this.state = "up"; //dom状态默认up |
| | | this.div.off(); |
| | | } |
| | | } |