diff --git a/web/client/src/layout/actions/global.js b/web/client/src/layout/actions/global.js index 4b08442c..55232c48 100644 --- a/web/client/src/layout/actions/global.js +++ b/web/client/src/layout/actions/global.js @@ -38,6 +38,8 @@ export function initApiRoot () { apiRoot: res.root, vcmpWebUrl: res.vcmpWebUrl, vcmpMirrorId: res.vcmpMirrorId, + olMapArcgisHost: res.olMapArcgisHost, + olMapGeoDataHost: res.olMapGeoDataHost, } }) }); diff --git a/web/client/src/layout/reducers/global.js b/web/client/src/layout/reducers/global.js index 4edb421f..a4d2cf4b 100644 --- a/web/client/src/layout/reducers/global.js +++ b/web/client/src/layout/reducers/global.js @@ -13,6 +13,8 @@ function global (state = { apiRoot: '', vcmpWebUrl: '', vcmpMirrorId: '', + olMapArcgisHost: '', + olMapGeoDataHost: '' }, action) { const payload = action.payload; switch (action.type) { @@ -42,6 +44,8 @@ function global (state = { apiRoot: payload.apiRoot, vcmpWebUrl: payload.vcmpWebUrl, vcmpMirrorId: payload.vcmpMirrorId, + olMapArcgisHost: payload.olMapArcgisHost, + olMapGeoDataHost: payload.olMapGeoDataHost, }).toJS(); default: return state; diff --git a/web/client/src/sections/quanju/containers/public/olMap.js b/web/client/src/sections/quanju/containers/public/olMap.js index 5be87729..b6b9e6ec 100644 --- a/web/client/src/sections/quanju/containers/public/olMap.js +++ b/web/client/src/sections/quanju/containers/public/olMap.js @@ -4,93 +4,94 @@ import request from 'superagent' import { OlMapRequest } from '$utils' const OlMap = (props) => { - const { dispatch, actions, user } = props + const { dispatch, actions, user, olMapArcgisHost, olMapGeoDataHost } = props const [olMapOpenData, setOlMapOpenData] = useState([]) useEffect(() => { - let config = { - layerName: 'nanchang', - center: [116.08706, 28.602018], // 中心坐标 - zoom: 10, // 缩放 - minZoom: 8, - maxZoom: 21, - isMoveSelect: false, // 鼠标滑过是否选中 - projection: 'EPSG:4326' // 坐标系 - } - let arcgisUrls = { - nanchang: { - url: 'http://36.2.6.33:6080/arcgis/rest/services/PBDT/nachang/MapServer', - }, - } - + }, []) + useEffect(() => { + console.log(olMapGeoDataHost); + if (olMapGeoDataHost) { + let config = { + layerName: 'nanchang', + center: [116.08706, 28.602018], // 中心坐标 + zoom: 10, // 缩放 + minZoom: 8, + maxZoom: 21, + isMoveSelect: false, // 鼠标滑过是否选中 + projection: 'EPSG:4326' // 坐标系 + } + let arcgisUrls = { + nanchang: { + url: `${olMapArcgisHost || 'http://36.2.6.33:6080'}/arcgis/rest/services/PBDT/nachang/MapServer`, + }, + } - let option = { - target: 'olMap', // 元素ID - config: config, - arcgisUrls, // 动态底图图层 - onEvent: { - // 选中回调 - onSelectClick: function (p) { console.log(p) }, - // 鼠标滑过回调 - onPointerMove: function (p) { console.log(p) }, + let option = { + target: 'olMap', // 元素ID + config: config, + arcgisUrls, // 动态底图图层 + onEvent: { + // 选中回调 + onSelectClick: function (p) { + // console.log(p) + }, + // 鼠标滑过回调 + onPointerMove: function (p) { + // console.log(p) + }, + } } - } - let olMapTool = new OlMapTool(option) - olMapTool.map.on('dblclick', function (p) { - console.log(p) - }) - olMapTool.map.on('singleclick', function (p) { - console.log("singleclick", p) + let olMapTool = new OlMapTool(option) + olMapTool.map.on('dblclick', function (p) { + // console.log(p) + }) + olMapTool.map.on('singleclick', function (p) { - olMapTool.closeOverlay('clickOpen') - olMapTool.removeGeometryLayer('geometry0') + olMapTool.closeOverlay('clickOpen') + olMapTool.removeGeometryLayer('geometry0') - request.post('http://36.2.6.32:8811/geoserver-pg/rest/bufferSearch') - .type('form') - .send({ - params: `{"layerName":"view_by_line","pageSize":10,"pageNum":1,"filter":"","isReturnGeometry":"true","spatialRel":"INTERSECTS","orderByFields":" sort1, sort2, lxbm, sxxfx, qdzh asc", "spatialFilter":"point(${p.coordinate[0]} ${p.coordinate[1]})","distance":20}` - }) - .then(res => { - console.log(res); - if (res.status == 200 && res.body && res.body.code == 1) { - const data = res.body.data - const { datalist } = data - let index = 0 - for (let d of datalist.list) { - olMapTool.addGeometryJMLayer({ - features: [ - { - geometry: d.shape, - geometryType: 'LineString', - // geometryType: 'Point', - }, - ], - style: { stroke: { width: 10, color: '#9933FF' } }, - selectStyle: { stroke: { width: 5, color: '#9933FF' } }, - layerName: 'geometry' + index++ - }); - const config = { - id: 'clickOpen', - offset: [0, 25], // 偏移 - position: p.coordinate, // 坐标 - autoPan: true, - autoPanMargin: 100, - positioning: 'top-right' + request.post(`${olMapGeoDataHost || 'http://36.2.6.32:8811'}/geoserver-pg/rest/bufferSearch`) + .type('form') + .send({ + params: `{"layerName":"view_by_line","pageSize":10,"pageNum":1,"filter":"","isReturnGeometry":"true","spatialRel":"INTERSECTS","orderByFields":" sort1, sort2, lxbm, sxxfx, qdzh asc", "spatialFilter":"point(${p.coordinate[0]} ${p.coordinate[1]})","distance":20}` + }) + .then(res => { + if (res.status == 200 && res.body && res.body.code == 1) { + const data = res.body.data + const { datalist } = data + let index = 0 + for (let d of datalist.list) { + olMapTool.addGeometryJMLayer({ + features: [ + { + geometry: d.shape, + geometryType: 'LineString', + // geometryType: 'Point', + }, + ], + style: { stroke: { width: 10, color: '#9933FF' } }, + selectStyle: { stroke: { width: 5, color: '#9933FF' } }, + layerName: 'geometry' + index++ + }); + const config = { + id: 'clickOpen', + offset: [0, 25], // 偏移 + position: p.coordinate, // 坐标 + autoPan: true, + autoPanMargin: 100, + positioning: 'top-right' + } + setOlMapOpenData([{ k: Math.random() }]) + olMapTool.addOverlay('clickOpen', config) + break } - setOlMapOpenData([{ k: Math.random() }]) - olMapTool.addOverlay('clickOpen', config) - break } - } - }) - - }) - - - - - }, []) + }) + }) + } + }, [olMapGeoDataHost]) return (