From 55799a2edbfc4bc6fce4f4c2350e5b9bb7214ed7 Mon Sep 17 00:00:00 2001
From: YANGDL <114714267@qq.com>
Date: 星期二, 09 三月 2021 14:51:35 +0800
Subject: [PATCH] 修复ie下不能显示的问题
---
src/router/routes.js | 7 +++
.eslintrc.js | 3 +
src/api/index.js | 4 +-
src/main.js | 5 +-
package.json | 7 ++-
src/utils/AjaxUtils.js | 61 ++++++++++++++++++------------
src/api/mapUrl.js | 12 +++---
src/components/helpers/ServiceLayerHelper.js | 19 ++++++---
8 files changed, 72 insertions(+), 46 deletions(-)
diff --git a/.eslintrc.js b/.eslintrc.js
index 654134e..60ec4b5 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,7 +1,8 @@
module.exports = {
root: true,
env: {
- node: true
+ node: true,
+ amd: true
},
extends: [
'plugin:vue/essential',
diff --git a/package.json b/package.json
index e098be7..5360251 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,7 @@
"element-ui": "^2.14.1",
"jquery": "^3.5.1",
"js-cookie": "^2.2.0",
- "leaflet": "^1.6.0",
+ "leaflet": "^1.7.1",
"leaflet-canvas-markers": "^1.0.6",
"leaflet.markercluster": "^1.4.1",
"lodash": "^4.17.10",
@@ -40,17 +40,18 @@
"@vue/eslint-config-standard": "^5.1.2",
"babel-eslint": "^10.1.0",
"babel-loader": "^8.2.2",
+ "babel-polyfill": "^6.26.0",
"cache-loader": "^4.1.0",
"css-loader": "^5.0.1",
"eslint": "^6.7.2",
- "eslint-plugin-vue": "^6.2.2",
"eslint-plugin-import": "^2.20.2",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^4.2.1",
"eslint-plugin-standard": "^4.0.0",
- "mockjs": "^1.1.0",
+ "eslint-plugin-vue": "^6.2.2",
"less": "^3.13.0",
"less-loader": "^7.1.0",
+ "mockjs": "^1.1.0",
"vue-loader": "^15.9.5",
"vue-template-compiler": "^2.6.11"
},
diff --git a/src/api/index.js b/src/api/index.js
index 5654a60..1df9919 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -2,6 +2,6 @@
import * as mapUrl from './mapUrl'
export default {
- mapApi,
- mapUrl
+ mapApi,
+ mapUrl
}
diff --git a/src/api/mapUrl.js b/src/api/mapUrl.js
index c337552..bc905e4 100644
--- a/src/api/mapUrl.js
+++ b/src/api/mapUrl.js
@@ -1,10 +1,10 @@
/**
- * 璇ユ枃浠堕厤缃帴鍙ｇ殑URL鍦板潃
- */
-class ApiURLs{
- constructor(){
- this.APIURL_HELLOWORLD = 'http://www.baidu.com'
- }
+ * 璇ユ枃浠堕厤缃帴鍙ｇ殑URL鍦板潃
+ */
+class ApiURLs {
+ constructor () {
+ this.APIURL_HELLOWORLD = 'http://www.baidu.com'
+ }
}
export default new ApiURLs()
diff --git a/src/components/helpers/ServiceLayerHelper.js b/src/components/helpers/ServiceLayerHelper.js
index a38ef6c..96da67f 100644
--- a/src/components/helpers/ServiceLayerHelper.js
+++ b/src/components/helpers/ServiceLayerHelper.js
@@ -116,18 +116,21 @@
* @param url
* @param item
*/
- loadGeojsonLayer (url, item) {
+ async loadGeojsonLayer (url, item) {
var matches = this.regex.exec(url)
var matchValue = item[matches[1]]
var code = item.code
var newUrl = url.replace(this.regex, matchValue)
var that = this
if (!that.layerArray[code]) {
- AjaxUtils.GetDataAsynByUrl(newUrl, {}, function (res) {
- store.commit('addSewersDatas', res)
- var layer = that.loadGeojson(res, item)
- that.layerArray[code] = layer
- })
+ const res = await AjaxUtils.GetDataAsynByUrl(newUrl, {})
+ if (res.data instanceof Object && Object.prototype.hasOwnProperty.call(res.data, 'features')) {
+ store.commit('addSewersDatas', res.data)
+ if (newUrl.indexOf('绠＄綉') !== -1 || newUrl.indexOf('鍥涢��') !== -1) {
+ var layer = that.loadGeojson(res.data, item)
+ that.layerArray[code] = layer
+ }
+ }
} else {
that.layerArray[code].addTo(that.map)
}
@@ -140,6 +143,7 @@
loadGeojson (res, opt) {
var that = this
var icon = opt.icon
+ const layergroup = that.L.featureGroup().addTo(that.map)
const geojson = that.L.geoJSON(res.features, {
style: function (feature) {
return {
@@ -215,7 +219,8 @@
}
})
}
- }).addTo(that.map)
+ // }).addTo(that.map)
+ }).addTo(layergroup)
store.commit('addSewersDatas', geojson)
if (Object.prototype.hasOwnProperty.call(res, 'features') && res.features.length > 0 && (res.features[0].geometry.type === 'LineString' || res.features[0].geometry.type === 'MultiLineString')) {
geojson.bringToBack()
diff --git a/src/main.js b/src/main.js
index 28cfbd5..4bade14 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,4 +1,4 @@
-// import 'babel-polyfill'
+import 'babel-polyfill'
import Vue from 'vue'
import App from './App.vue'
import router from './router'
@@ -11,8 +11,9 @@
import 'leaflet/dist/leaflet.css'
import L from 'leaflet'
import 'leaflet.markercluster'
-import 'leaflet-canvas-markers'
+// import 'leaflet-canvas-markers'
import './components/plugin/Leaflet.GridLayer.FadeOut'
+import './components/plugin/leaflet-canvas-markers'
Vue.config.productionTip = false
Vue.use(ElementUI)
diff --git a/src/router/routes.js b/src/router/routes.js
index 2bdac51..ed5d92a 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -26,6 +26,13 @@
meta: {
title: '鍩虹鏁版嵁缁存姢'
}
+ }, {
+ path: '/mapTemplate',
+ name: 'mapTemplate',
+ component: MapTemplate,
+ meta: {
+ title: '鍩虹鍦板浘'
+ }
}]
}]
export const routes = [...mainRoutes, ...mapRoutes]
diff --git a/src/utils/AjaxUtils.js b/src/utils/AjaxUtils.js
index 11138b0..0499763 100644
--- a/src/utils/AjaxUtils.js
+++ b/src/utils/AjaxUtils.js
@@ -1,5 +1,5 @@
import $ from 'jquery'
-
+import axios from 'axios'
/**
* 瀵筳query鐨勫皝瑁卆jax鐨勪紶鏁版嵁鏂规硶
* @param pUrl 璇锋眰鐨剈rl
@@ -28,36 +28,47 @@
* @param pData 鍙傛暟
* @param pBackFun 鎴愬姛鍥炶皟
*/
-function get4JsonDataByUrl (pUrl, pData, pBackFun) {
- $.ajax({
- type: 'get',
+function get4JsonDataByUrl (oUrl, pData, pBackFun) {
+ const pUrl = encodeURI(oUrl)
+ axios({
+ method: 'get',
url: pUrl,
- dataType: 'json',
- data: pData,
- async: true,
- success: function (datas, nnn) {
- pBackFun(datas)
- },
- error: function (err, nnnn) {
- console.error('鏁版嵁鑾峰彇澶辫触', err, pUrl)
- }
+ data: pData
+ }).then(function (response) {
+ pBackFun(response)
})
+ .catch(function (error) {
+ console.error('鏁版嵁鑾峰彇澶辫触', error)
+ })
}
-function GetDataAsynByUrl (pUrl, pData, pBackFun) {
- $.ajax({
- type: 'GET',
+const GetDataAsynByUrl = async (oUrl, pData) => {
+ const pUrl = encodeURI(oUrl)
+ const res = await axios({
+ method: 'get',
url: pUrl,
- data: pData,
- timeout: 600000,
- async: true,
- success: function (datas, nnn) {
- pBackFun(datas)
- },
- error: function (e, nnnn) {
- console.error('鏁版嵁鑾峰彇澶辫触', pUrl)
- }
+ data: pData
+ }).then((response) => {
+ return (response)
})
+ .catch((error) => {
+ console.error('鏁版嵁鑾峰彇澶辫触', error)
+ })
+ return res
+
+ // $.ajax({
+ // type: 'GET',
+ // url: pUrl,
+ // data: pData,
+ // timeout: 600000,
+ // async: true,
+ // success: function (datas, nnn) {
+ // pBackFun(datas)
+ // },
+ // error: function (e, nnnn) {
+ // console.error('鏁版嵁鑾峰彇澶辫触', pUrl)
+ // }
+ // })
}
function postDataAsynByUrl (pUrl, pData, pBackFun) {
$.ajax({
--
Gitblit v1.8.0