gis-common 3.1.1 → 3.1.2

package/src/utils/DomUtils.js

@@ -0,0 +1,94 @@
+function trim(str) {
+    return str.trim ? str.trim() : str.replace(/^\s+|\s+$/g, '')
+}
+function splitWords(str) {
+    return trim(str).split(/\s+/)
+}
+export default {
+    getStyle(el, style) {
+        let value = el.style[style] || (el.currentStyle && el.currentStyle[style])
+
+        if ((!value || value === 'auto') && document.defaultView) {
+            const css = document.defaultView.getComputedStyle(el, null)
+            value = css ? css[style] : null
+        }
+        return value === 'auto' ? null : value
+    },
+    create(tagName, className, container) {
+        const el = document.createElement(tagName)
+        el.className = className || ''
+
+        if (container) {
+            container.appendChild(el)
+        }
+        return el
+    },
+    remove(el) {
+        const parent = el.parentNode
+        if (parent) {
+            parent.removeChild(el)
+        }
+    },
+    empty(el) {
+        while (el.firstChild) {
+            el.removeChild(el.firstChild)
+        }
+    },
+    toFront(el) {
+        const parent = el.parentNode
+        if (parent && parent.lastChild !== el) {
+            parent.appendChild(el)
+        }
+    },
+    toBack(el) {
+        const parent = el.parentNode
+        if (parent && parent.firstChild !== el) {
+            parent.insertBefore(el, parent.firstChild)
+        }
+    },
+    getClass(el) {
+        if (el.correspondingElement) {
+            el = el.correspondingElement
+        }
+        return el.className.baseVal === undefined ? el.className : el.className.baseVal
+    },
+    hasClass(el, name) {
+        if (el.classList !== undefined) {
+            return el.classList.contains(name)
+        }
+        const className = this.getClass(el)
+        return className.length > 0 && new RegExp('(^|\\s)' + name + '(\\s|$)').test(className)
+    },
+    addClass(el, name) {
+        if (el.classList !== undefined) {
+            const classes = splitWords(name)
+            for (let i = 0, len = classes.length; i < len; i++) {
+                el.classList.add(classes[i])
+            }
+        } else if (!this.hasClass(el, name)) {
+            const className = this.getClass(el)
+            this.setClass(el, (className ? className + ' ' : '') + name)
+        }
+    },
+    removeClass(el, name) {
+        if (el.classList !== undefined) {
+            const classes = splitWords(name)
+            classes.forEach((name) => el.classList.remove(name))
+        } else {
+            this.setClass(el, trim((' ' + this.getClass(el) + ' ').replace(' ' + name + ' ', ' ')))
+        }
+    },
+    setClass(el, name) {
+        if (el.className.baseVal === undefined) {
+            el.className = name
+        } else {
+            // in case of SVG element
+            el.className.baseVal = name
+        }
+    },
+    parseFromString(str) {
+        const parser = new DOMParser()
+        const doc = parser.parseFromString(str, 'text/xml')
+        return doc.children[0]
+    },
+}

package/src/utils/FileUtils.js

@@ -0,0 +1,104 @@
+export default {
+    /**
+     * 将base64类型编码的图片转换成blob类型
+     *
+     * @param {*} data
+     * @returns {*}
+     */
+    convertBase64ToBlob(data) {
+        var mimeString = data.split(',')[0].split(':')[1].split(';')[0]
+        var byteString = window.atob(data.split(',')[1])
+        var ab = new ArrayBuffer(byteString.length)
+        var ia = new Uint8Array(ab)
+
+        for (var i = 0; i < byteString.length; i++) {
+            ia[i] = byteString.charCodeAt(i)
+        }
+        var bb = window.BlobBuilder || window.WebKitBlobBuilder || window.MozBlobBuilder
+
+        if (bb) {
+            bb = new (window.BlobBuilder || window.WebKitBlobBuilder || window.MozBlobBuilder)()
+            bb.append(ab)
+            return bb.getBlob(mimeString)
+        } else {
+            bb = new Blob([ab], {
+                type: mimeString,
+            })
+            return bb
+        }
+    },
+    /**
+     * 将url图片转换成base64编码的图片,也可用于图片压缩
+     *
+     * @param {*} url 需要转换的图片url
+     * @param {*} width 指定宽高,如未指定则使用默认宽度
+     * @param {*} height
+     * @returns {*}
+     */
+    convertUrlToBase64(url, width, height) {
+        return new Promise(function (resolve, reject) {
+            var img = new Image()
+            img.crossOrigin = 'Anonymous'
+            img.src = url
+            img.onload = function () {
+                var canvas = document.createElement('canvas')
+                canvas.width = width || img.width
+                canvas.height = height || img.height
+                var ctx = canvas.getContext('2d')
+                ctx.drawImage(img, 0, 0, img.width, img.height)
+                var ext = img.src.substring(img.src.lastIndexOf('.') + 1).toLowerCase()
+                var dataURL = canvas.toDataURL('image/' + ext)
+                var base64 = {
+                    dataURL: dataURL,
+                    type: 'image/' + ext,
+                    ext: ext,
+                }
+                resolve(base64)
+            }
+        })
+    },
+    /**
+     * 将base64类型编码的图片转换成file类型
+     *
+     * @param {*} dataurl
+     * @param {*} filename
+     * @returns {*}
+     */
+    convertBase64ToFile(dataurl, filename) {
+        var arr = dataurl.split(','),
+            mime = arr[0].match(/:(.*?);/)[1],
+            bstr = atob(arr[1]),
+            n = bstr.length,
+            u8arr = new Uint8Array(n)
+        while (n--) {
+            u8arr[n] = bstr.charCodeAt(n)
+        }
+        let file = new File([u8arr], filename, { type: mime })
+        return file
+    },
+    /**
+     * 直接下载文件,支持blob类型和url类型
+     *
+     * @param {*} data
+     * @param {*} saveName
+     */
+    downloadFromFile(data, saveName) {
+        if (typeof data == 'object') {
+            if (data instanceof Blob) {
+                data = URL.createObjectURL(data) // 创建blob地址
+            } else {
+                const str = JSON.stringify(data)
+                const blob = new Blob([str], { type: 'text/json' }) // json对象
+                data = window.URL.createObjectURL(blob)
+            }
+        } else if (typeof data == 'string' && data.indexOf('http') === -1) {
+            const blob = new Blob([data], { type: 'text/json' }) //json文本
+            data = window.URL.createObjectURL(blob)
+        }
+        var link = document.createElement('a')
+        link.href = data
+        link.download = saveName || '' // HTML5新增的属性，指定保存文件名，可以不要后缀，注意，file:///模式下不会生效
+        link.click()
+        window.URL.revokeObjectURL(link.href)
+    },
+}

package/src/utils/GeoUtils.js

@@ -0,0 +1,253 @@
+import MathUtils from './MathUtils'
+export default {
+    toRadian: Math.PI / 180,
+    R: 6371393,
+    /**
+     * 验证经纬度坐标
+     *
+     * @param {*} lng
+     * @param {*} lat
+     * @returns {*}  {boolean}
+     */
+    isLnglat(lng, lat) {
+        return lng && lat && !!(+lat > -90 && +lat < 90 && +lng > -180 && +lng < 180)
+    },
+    /**
+     * 格式化经纬度(转度分秒)
+     *
+     * @param {*} lng
+     * @param {*} lat
+     * @returns {*}
+     */
+    formatLnglat(lng, lat) {
+        let res = ''
+        function format(value) {
+            const a = parseFloat(value)
+            const degree = parseInt(a)
+            let min = parseInt((a - degree) * 60)
+            let sec = (a - degree) * 3600 - min * 60
+            return degree + '°' + min + '′' + sec.toFixed(2) + '″'
+        }
+        if (lng && lat) {
+            res = format(lng) + ',' + format(lat)
+        }
+        return res
+    },
+    /**
+     * 度分秒转十进制
+     *
+     * @param {*} lng
+     * @param {*} lat
+     * @returns {*}
+     */
+    transformLnglat(lng, lat) {
+        function dms2deg(s) {
+            var sw = /[sw]/i.test(s)
+            var f = sw ? -1 : 1
+            var bits = s.match(/[\d.]+/g)
+            var result = 0
+            for (var i = 0, iLen = bits.length; i < iLen; i++) {
+                result += bits[i] / f
+                f *= 60
+            }
+            return result
+        }
+        if (lng && lat) {
+            return {
+                lng: dms2deg(lng),
+                lat: dms2deg(lat),
+            }
+        }
+    },
+    /**
+     * 判断点是否在多边形内
+     *
+     * @param {*} p
+     * @param {*} poly
+     * @returns {*}
+     */
+    rayCasting(p, poly) {
+        var px = p.x,
+            py = p.y,
+            flag = false
+        for (var i = 0, l = poly.length, j = l - 1; i < l; j = i, i++) {
+            var sx = poly[i].x,
+                sy = poly[i].y,
+                tx = poly[j].x,
+                ty = poly[j].y
+            // 点与多边形顶点重合
+            if ((sx === px && sy === py) || (tx === px && ty === py)) {
+                return 'on'
+            }
+            // 判断线段两端点是否在射线两侧
+            if ((sy < py && ty >= py) || (sy >= py && ty < py)) {
+                // 线段上与射线 Y 坐标相同的点的 X 坐标
+                var x = sx + ((py - sy) * (tx - sx)) / (ty - sy)
+                // 点在多边形的边上
+                if (x === px) {
+                    return 'on'
+                }
+                // 射线穿过多边形的边界
+                if (x > px) {
+                    flag = !flag
+                }
+            }
+        }
+        // 射线穿过多边形边界的次数为奇数时点在多边形内
+        return flag ? 'in' : 'out'
+    },
+    /**
+     * 计算两点距离
+     *
+     * @param {*} fromPoint
+     * @param {*} toPoint
+     * @returns {*}
+     */
+    wgs84PointsDistance(fromPoint, toPoint) {
+        var PI = Math.PI
+        function getRad(d) {
+            return (d * PI) / 180.0
+        }
+        if (arguments.length != 2) {
+            return 0
+        }
+        lon1 = fromPoint.x
+        lat1 = fromPoint.y
+        lon2 = toPoint.x
+        lat2 = toPoint.y
+        var a = 6378137,
+            b = 6356752.3142,
+            f = 1 / 298.257223563
+        var L = getRad(lon2 - lon1)
+        var U1 = Math.atan((1 - f) * Math.tan(getRad(lat1)))
+        var U2 = Math.atan((1 - f) * Math.tan(getRad(lat2)))
+        var sinU1 = Math.sin(U1),
+            cosU1 = Math.cos(U1)
+        var sinU2 = Math.sin(U2),
+            cosU2 = Math.cos(U2)
+        var lambda = L,
+            lambdaP,
+            iterLimit = 100
+        do {
+            var sinLambda = Math.sin(lambda),
+                cosLambda = Math.cos(lambda)
+            var sinSigma = Math.sqrt(
+                cosU2 * sinLambda * (cosU2 * sinLambda) + (cosU1 * sinU2 - sinU1 * cosU2 * cosLambda) * (cosU1 * sinU2 - sinU1 * cosU2 * cosLambda)
+            )
+            if (sinSigma == 0) return 0
+            var cosSigma = sinU1 * sinU2 + cosU1 * cosU2 * cosLambda
+            var sigma = Math.atan2(sinSigma, cosSigma)
+            var sinAlpha = (cosU1 * cosU2 * sinLambda) / sinSigma
+            var cosSqAlpha = 1 - sinAlpha * sinAlpha
+            var cos2SigmaM = cosSigma - (2 * sinU1 * sinU2) / cosSqAlpha
+            if (isNaN(cos2SigmaM)) cos2SigmaM = 0
+            var C = (f / 16) * cosSqAlpha * (4 + f * (4 - 3 * cosSqAlpha))
+            lambdaP = lambda
+            lambda = L + (1 - C) * f * sinAlpha * (sigma + C * sinSigma * (cos2SigmaM + C * cosSigma * (-1 + 2 * cos2SigmaM * cos2SigmaM)))
+        } while (Math.abs(lambda - lambdaP) > 1e-12 && --iterLimit > 0)
+        if (iterLimit == 0) {
+            return NaN
+        }
+        var uSq = (cosSqAlpha * (a * a - b * b)) / (b * b)
+        var A = 1 + (uSq / 16384) * (4096 + uSq * (-768 + uSq * (320 - 175 * uSq)))
+        var B = (uSq / 1024) * (256 + uSq * (-128 + uSq * (74 - 47 * uSq)))
+        var deltaSigma =
+            B *
+            sinSigma *
+            (cos2SigmaM +
+                (B / 4) *
+                    (cosSigma * (-1 + 2 * cos2SigmaM * cos2SigmaM) -
+                        (B / 6) * cos2SigmaM * (-3 + 4 * sinSigma * sinSigma) * (-3 + 4 * cos2SigmaM * cos2SigmaM)))
+        var s = b * A * (sigma - deltaSigma)
+        var fwdAz = Math.atan2(cosU2 * sinLambda, cosU1 * sinU2 - sinU1 * cosU2 * cosLambda)
+        var revAz = Math.atan2(cosU1 * sinLambda, -sinU1 * cosU2 + cosU1 * sinU2 * cosLambda)
+        return s
+    },
+    /**
+     * P1绕一个坐标点P2旋转θ角度后,新的坐标的计算公式
+     *
+     * @param {*} p1
+     * @param {*} p2
+     * @param {*} θ 旋转角度，正：表示顺时针，负：表示逆时针
+     */
+    rotatePoint(p1, p2, θ) {
+        const x = (p1.x - p2.x) * Math.cos((Math.PI / 180) * -θ) - (p1.y - p2.y) * Math.sin((Math.PI / 180) * -θ) + p2.x
+        const y = (p1.x - p2.x) * Math.sin((Math.PI / 180) * -θ) + (p1.y - p2.y) * Math.cos((Math.PI / 180) * -θ) + p2.y
+        return { x, y }
+    },
+    calcBearAndDis(p1, p2) {
+        const { x: x1, y: y1 } = p1
+        const { x: x2, y: y2 } = p2
+        const dx = x2 - x1
+        const dy = y2 - y1
+        const distance = Math.sqrt(dx * dx + dy * dy)
+        const angleInRadians = Math.atan2(dy, dx)
+        const angle = (angleInRadians * (180 / Math.PI) + 360 + 90) % 360
+        return { angle, distance }
+    },
+    /**
+     * 计算latlng2相对于latlng1的方位角和距离
+     *
+     * @param {*} latlng1
+     * @param {*} latlng2
+     * @returns {*}  {boolean}
+     */
+    calcBearAndDisByPoints(latlng1, latlng2) {
+        var f1 = parseFloat(latlng1.lat),
+            l1 = parseFloat(latlng1.lng),
+            f2 = parseFloat(latlng2.lat),
+            l2 = parseFloat(latlng2.lng)
+        var y = Math.sin((l2 - l1) * this.toRadian) * Math.cos(f2 * this.toRadian)
+        var x =
+            Math.cos(f1 * this.toRadian) * Math.sin(f2 * this.toRadian) -
+            Math.sin(f1 * this.toRadian) * Math.cos(f2 * this.toRadian) * Math.cos((l2 - l1) * this.toRadian)
+        var angle = Math.atan2(y, x) * (180 / Math.PI)
+        var deltaF = (f2 - f1) * this.toRadian
+        var deltaL = (l2 - l1) * this.toRadian
+        var a =
+            Math.sin(deltaF / 2) * Math.sin(deltaF / 2) +
+            Math.cos(f1 * this.toRadian) * Math.cos(f2 * this.toRadian) * Math.sin(deltaL / 2) * Math.sin(deltaL / 2)
+        var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a))
+        var distance = this.R * c
+        return {
+            angle,
+            distance,
+        }
+    },
+
+    /**
+     * 根据方位角和距离生成新的坐标
+     *
+     * @param {*} latlng
+     * @param {*} angle
+     * @param {*} distance
+     * @returns {*}
+     */
+    calcPointByBearAndDis(latlng, angle, distance) {
+        const sLat = MathUtils.toRadians(parseFloat(latlng.lat))
+        const sLng = MathUtils.toRadians(parseFloat(latlng.lng))
+        angle = parseFloat(angle)
+        distance = parseFloat(distance)
+        const d = distance / this.R
+        angle = MathUtils.toRadians(angle)
+        const lat = Math.asin(Math.sin(sLat) * Math.cos(d) + Math.cos(sLat) * Math.sin(d) * Math.cos(angle))
+        const lon = sLng + Math.atan2(Math.sin(angle) * Math.sin(d) * Math.cos(sLat), Math.cos(d) - Math.sin(sLat) * Math.sin(lat))
+        return {
+            lat: MathUtils.toDegrees(lat),
+            lng: MathUtils.toDegrees(lon),
+        }
+    },
+    mercatorTolonlat(x, y) {
+        const lng = (x / 20037508.34) * 180
+        var mmy = (y / 20037508.34) * 180
+        const lat = (180 / Math.PI) * (2 * Math.atan(Math.exp((mmy * Math.PI) / 180)) - Math.PI / 2)
+        return { lng, lat }
+    },
+    lonlatToMercator(lng, lat) {
+        var earthRad = 6378137.0
+        const x = ((lng * Math.PI) / 180) * earthRad
+        var a = (lat * Math.PI) / 180
+        const y = (earthRad / 2) * Math.log((1.0 + Math.sin(a)) / (1.0 - Math.sin(a)))
+        return { x, y }
+    },
+}

package/src/utils/MathUtils.js

@@ -0,0 +1,49 @@
+export default {
+    DEG2RAD: Math.PI / 180,
+    RAD2DEG: 180 / Math.PI,
+    randInt(low, high) {
+        return low + Math.floor(Math.random() * (high - low + 1))
+    },
+    randFloat(low, high) {
+        return low + Math.random() * (high - low)
+    },
+    /**
+     * 角度转弧度
+     *
+     * @param {*} degrees
+     * @returns {*}
+     */
+    degreesToRadians(degrees) {
+        return degrees * this.DEG2RAD
+    },
+    /**
+     * 角度转弧度
+     *
+     * @param {*} degrees
+     * @returns {*}
+     */
+    toRadians(degrees) {
+        return degrees * this.DEG2RAD
+    },
+    /**
+     * 弧度转角度
+     *
+     * @param {*} radians
+     * @returns {*}
+     */
+    radiansToDegrees(radians) {
+        return radians * this.RAD2DEG
+    },
+    /**
+     * 弧度转角度
+     *
+     * @param {*} radians
+     * @returns {*}
+     */
+    toDegrees(radians) {
+        return radians * this.RAD2DEG
+    },
+    formatFloat(value, n = 2) {
+        return Math.round(value * Math.pow(10, n)) / Math.pow(10, n)
+    },
+}

package/src/utils/OptimizeUtils.js

@@ -0,0 +1,94 @@
+export default {
+    /**
+     * @desc  在事件被触发n秒后再执行回调函数，如果在这n秒内又被触发，则重新计时
+     * @desc  防止onresize，scroll，mousemove ,mousehover等，会被频繁触发影响性能
+     * @param  func 需要执行的函数
+     * @param  wait 延迟执行时间（毫秒）
+     * @param  immediate---true 表立即执行，false 表非立即执行
+     * eg: window.addEventListener("resize",debounce(handle,1000));
+     * @returns {*}
+     */
+    debounce(func, wait, immediate = true) {
+        let timeout, args, context, timestamp, result
+
+        const later = function () {
+            // 据上一次触发时间间隔
+            const last = +new Date() - timestamp
+
+            // 上次被包装函数被调用时间间隔last小于设定时间间隔wait
+            if (last < wait && last > 0) {
+                timeout = setTimeout(later, wait - last)
+            } else {
+                timeout = null
+                // 如果设定为immediate===true，因为开始边界已经调用过了此处无需调用
+                if (!immediate) {
+                    result = func.apply(context, args)
+                    if (!timeout) context = args = null
+                }
+            }
+        }
+
+        return function (...args) {
+            context = this
+            timestamp = +new Date()
+            const callNow = immediate && !timeout
+            // 如果延时不存在，重新设定延时
+            if (!timeout) timeout = setTimeout(later, wait)
+            if (callNow) {
+                result = func.apply(context, args)
+                context = args = null
+            }
+
+            return result
+        }
+    },
+    /**
+     * 规定一个单位时间，在这个单位时间内，只能有一次触发事件的回调函数执行，如果在同一个单位时间内某事件被触发多次，只有一次能生效
+     *
+     * @param {*} func
+     * @param {*} wait
+     * @param {*} type 1 表时间戳版，2 表定时器版
+     * @returns {*}
+     */
+    throttle(func, wait, type) {
+        if (type === 1) {
+            var previous = 0
+        } else if (type === 2) {
+            var timeout
+        }
+        return function () {
+            let context = this
+            let args = arguments
+            if (type === 1) {
+                let now = Date.now()
+                if (now - previous > wait) {
+                    func.apply(context, args)
+                    previous = now
+                }
+            } else if (type === 2) {
+                if (!timeout) {
+                    timeout = setTimeout(() => {
+                        timeout = null
+                        func.apply(context, args)
+                    }, wait)
+                }
+            }
+        }
+    },
+    /**
+     * 延时递归
+     *
+     * @param {Number} frequency 间隔时间ms
+     * @param {Number} duration 持续时间ms
+     */
+    recurve(fun, frequency = 500, duration = 5000) {
+        let timer = 0
+        setTimeout(function fn() {
+            timer++
+            if (timer < Math.floor(duration / frequency)) {
+                fun.call(this)
+                setTimeout(fn, frequency)
+            }
+        })
+    },
+}