修改电子围栏

master
夜笙歌 2 years ago
parent 3dc23a0bb5
commit 70d2f638c3

@ -24,12 +24,13 @@
<el-form-item label=" ">
<el-button icon="Search" type="primary" @click="handleQuery">{{ t('option.search') }}</el-button>
<el-button icon="Refresh" @click="resetQuery">{{ t('option.reset') }}</el-button>
<el-button icon="Refresh" @click="getLine"></el-button>
</el-form-item>
</el-form>
<el-button class="add" @click="createPolygon"></el-button>
<el-button class="clear" @click="clearPolygon"></el-button>
<el-button class="clear" type="primary" @click="getLine"></el-button>
<div id="container4"></div>
<el-button class="add" @click="createPolygon"></el-button>
</div>
</template>
<script setup>
@ -45,8 +46,11 @@ const {proxy} = getCurrentInstance();
const queryParams = ref({})
let map = null
let polyEditor = null
let path = [[116.390969, 39.911592], [116.391496, 39.909008], [116.389264, 39.909765], [116.38802, 39.911016]]
let path1 = [[116.391969, 39.912592], [116.392496, 39.910008], [116.390264, 39.910765], [116.38902, 39.912016]]
const areaPath = ref([path])
const areaPath1 = ref([path1])
const marketPath = ref([[116.390669, 39.911147], [116.400669, 39.921147]])
AMapLoader.load({
key: "ba8fb8d8bae1b280b93406d5959d492f", // WebKey load
@ -78,16 +82,32 @@ AMapLoader.load({
map.addControl(new AMap.MapType());
setPolygon(areaPath.value)
setMarker(marketPath.value)
// setPolygon(areaPath.value)
// setMarker(marketPath.value)
}).catch(e => {
console.log(e);
})
let one = true
const handleQuery = () => {
clearPolygon()
if (one) {
setPolygon(areaPath.value)
} else {
setPolygon(areaPath1.value)
}
setMarker(marketPath.value)
one = !one
}
const setMarker = (e) => {
let markers = map.getAllOverlays('marker');
map.remove(markers)
let polygons = map.getAllOverlays('polygon');
let list = polygons.map(e => e._opts.path)
e.forEach(val => {
let marker = new AMap.Marker({
position: val,
@ -95,9 +115,8 @@ const setMarker = (e)=>{
offset: new AMap.Pixel(0, 0)
});
marker.setTitle('我是marker的title');
console.log((areaPath.value))
let isPointInRing = false
areaPath.value.forEach(res=>{
list.forEach(res => {
if (AMap.GeometryUtil.isPointInRing(val, res)) {
isPointInRing = true
}
@ -111,66 +130,51 @@ const setMarker = (e)=>{
marker.setMap(map);
})
}
const setPolygon = (res) => {
res.forEach((e, index) => {
let polygon = new AMap.Polygon({path: e});
map.add([polygon]);
let polyEditor = new AMap.PolygonEditor(map);
polyEditor.addAdsorbPolygons([polygon]);
polygon.on('dblclick', () => {
polyEditor.setTarget(polygon);
polyEditor.open();
})
polyEditor.on('addnode', function (data) {
//
areaPath.value[index] = polyEditor.getTarget()._opts.path
setMarker(marketPath.value)
})
polyEditor.on('adjust', function (data) {
//
areaPath.value[index] = polyEditor.getTarget()._opts.path
setMarker(marketPath.value)
})
})
setMarker(marketPath.value)
const createPolygon = () => {
polyEditor.close();
polyEditor.setTarget();
polyEditor.open()
}
const removePolygon = () =>{
const clearPolygon = () => {
if (!polyEditor) return
polyEditor.close();
let polygons = map.getAllOverlays('polygon');
console.log('s',polygons)
polygons.forEach(e=>{
// e.close()
})
map.remove(polygons)
}
let createPolygon = () => {
let arr = []
map.add([new AMap.Polygon({path: arr})]);
let polyEditor = new AMap.PolygonEditor(map)
let index = areaPath.value.length
polyEditor.close();
polyEditor.setTarget();
const setPolygon = (res) => {
let polygonArr = []
res.forEach(val => {
let thisPolygon = new AMap.Polygon({path: val});
polygonArr.push(thisPolygon)
thisPolygon.on('dblclick', () => {
polyEditor.setTarget(thisPolygon);
polyEditor.open();
})
})
map.add(polygonArr)
polyEditor = new AMap.PolygonEditor(map);
polyEditor.addAdsorbPolygons(polygonArr);
polyEditor.on('add', function (data) {
areaPath.value.push(data.target._opts.path)
// polyEditor.close();
// map.clearMap()
// removePolygon()
// setPolygon([data.target._opts.path])
let polygon = data.target;
polyEditor.addAdsorbPolygons(polygon);
polygon.on('dblclick', () => {
polyEditor.setTarget(polygon);
polyEditor.open();
})
})
polyEditor.on('addnode', function (data) {
//
areaPath.value[index] = polyEditor.getTarget()._opts.path
console.log('addnode', data)
setMarker(marketPath.value)
})
polyEditor.on('adjust', function (data) {
//
areaPath.value[index] = polyEditor.getTarget()._opts.path
console.log('adjust', data)
setMarker(marketPath.value)
})
map.setFitView();
}
const getLine = () => {
let list = areaPath.value
let polygons = map.getAllOverlays('polygon');
let list = polygons.map(e => e._opts.path)
let params = []
list.forEach((e, index) => {
e.forEach(val => {
@ -189,12 +193,13 @@ const getLine = () => {
padding: 0px;
margin: 20px 0 0 0;
width: 100%;
height: calc(100vh - 190px);
height: calc(100vh - 220px);
}
.add {
position: absolute;
bottom: 15px;
right: 150px;
margin-left: 30px;
}
.clear {
}
</style>

Loading…
Cancel
Save