|
|
@ -4,9 +4,15 @@ 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(() => { |
|
|
|
|
|
|
|
}, []) |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
console.log(olMapGeoDataHost); |
|
|
|
if (olMapGeoDataHost) { |
|
|
|
let config = { |
|
|
|
layerName: 'nanchang', |
|
|
|
center: [116.08706, 28.602018], // 中心坐标
|
|
|
@ -18,41 +24,40 @@ const OlMap = (props) => { |
|
|
|
} |
|
|
|
let arcgisUrls = { |
|
|
|
nanchang: { |
|
|
|
url: 'http://36.2.6.33:6080/arcgis/rest/services/PBDT/nachang/MapServer', |
|
|
|
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) }, |
|
|
|
onSelectClick: function (p) { |
|
|
|
// console.log(p)
|
|
|
|
}, |
|
|
|
// 鼠标滑过回调
|
|
|
|
onPointerMove: 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) |
|
|
|
// console.log(p)
|
|
|
|
}) |
|
|
|
olMapTool.map.on('singleclick', function (p) { |
|
|
|
console.log("singleclick", p) |
|
|
|
|
|
|
|
olMapTool.closeOverlay('clickOpen') |
|
|
|
olMapTool.removeGeometryLayer('geometry0') |
|
|
|
|
|
|
|
request.post('http://36.2.6.32:8811/geoserver-pg/rest/bufferSearch') |
|
|
|
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 => { |
|
|
|
console.log(res); |
|
|
|
if (res.status == 200 && res.body && res.body.code == 1) { |
|
|
|
const data = res.body.data |
|
|
|
const { datalist } = data |
|
|
@ -84,13 +89,9 @@ const OlMap = (props) => { |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}, []) |
|
|
|
} |
|
|
|
}, [olMapGeoDataHost]) |
|
|
|
|
|
|
|
return ( |
|
|
|
<div id="olMap" style={{ position: 'absolute', height: '100%', width: "100%" }}> |
|
|
@ -109,8 +110,8 @@ const OlMap = (props) => { |
|
|
|
{ |
|
|
|
olMapOpenData.map(s => { |
|
|
|
return <div style={{ display: 'flex' }}> |
|
|
|
<div style={{ width: 120 }}>1</div> |
|
|
|
<div style={{ flex: 1 }}>: {s.k}</div> |
|
|
|
{/* <div style={{ width: 120 }}>1</div> |
|
|
|
<div style={{ flex: 1 }}>: {s.k}</div> */} |
|
|
|
</div> |
|
|
|
}) |
|
|
|
} |
|
|
@ -125,6 +126,8 @@ function mapStateToProps (state) { |
|
|
|
return { |
|
|
|
user: auth.user, |
|
|
|
actions: global.actions, |
|
|
|
olMapArcgisHost: global.olMapArcgisHost, |
|
|
|
olMapGeoDataHost: global.olMapGeoDataHost, |
|
|
|
}; |
|
|
|
} |
|
|
|
|
|
|
|