|
|
@@ -84,6 +84,19 @@
|
|
|
:extData="{index}"
|
|
|
:events="polygonEvents">
|
|
|
</el-amap-polygon>
|
|
|
+ <el-amap-polyline
|
|
|
+ v-for="(polyline, index) in polylines"
|
|
|
+ :key="index"
|
|
|
+ :editable="polyline.editable"
|
|
|
+ :fillColor="polyline.fillColor"
|
|
|
+ :fillOpacity="polyline.fillOpacity"
|
|
|
+ :strokeColor="polyline.strokeColor"
|
|
|
+ :strokeWeight="polyline.strokeWeight"
|
|
|
+ :strokeOpacity="polyline.strokeOpacity"
|
|
|
+ :extData="{index}"
|
|
|
+ :events="polylineEvents"
|
|
|
+ :path="polyline.path">
|
|
|
+ </el-amap-polyline>
|
|
|
</el-amap>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -97,6 +110,7 @@ export default {
|
|
|
data() {
|
|
|
const that = this
|
|
|
return {
|
|
|
+ polylines: [],
|
|
|
estateList: [],
|
|
|
schoolList: [],
|
|
|
medium_school_list: [],
|
|
|
@@ -191,6 +205,12 @@ export default {
|
|
|
// wx.miniProgram.navigateTo({url: '/pagesSchool/indexDtl?id=25'})
|
|
|
},
|
|
|
},
|
|
|
+ polylineEvents: {
|
|
|
+ click(e) {
|
|
|
+ const eData = e.target.getExtData()
|
|
|
+ that.polylineIndex = eData.index
|
|
|
+ },
|
|
|
+ },
|
|
|
estateEvents: {
|
|
|
click(e) {
|
|
|
const eData = e.target.getExtData()
|
|
|
@@ -210,6 +230,7 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
polygonIndex: 0,
|
|
|
+ polylineIndex: 0,
|
|
|
curMarkersIndex: 0,
|
|
|
plugin: [{
|
|
|
pName: 'MouseTool',
|
|
|
@@ -437,15 +458,21 @@ export default {
|
|
|
|
|
|
|
|
|
let areaList = res.area_total || []
|
|
|
- areaList.map(item => {
|
|
|
+ let newAreaList = []
|
|
|
+ areaList.forEach(item => {
|
|
|
// let lnglatArr = arrToObj(this.dictData.map_area_lnglat)[item.area_type].split(',')
|
|
|
// item.position = [lnglatArr[0], lnglatArr[1]]
|
|
|
// item.areaName = arrToObj(this.dictData.area_type)[item.area_type]
|
|
|
const areaIndex = arrToObj(arr)[item.area_type]
|
|
|
- item.position = [arr[areaIndex].longitude, arr[areaIndex].latitude]
|
|
|
- item.areaName = arr[areaIndex].areaName
|
|
|
+ if (arr[areaIndex] && arr[areaIndex].longitude) {
|
|
|
+ newAreaList.push({
|
|
|
+ ...item,
|
|
|
+ position: [arr[areaIndex].longitude, arr[areaIndex].latitude],
|
|
|
+ areaName: arr[areaIndex].areaName
|
|
|
+ })
|
|
|
+ }
|
|
|
})
|
|
|
- this.areaList = [...areaList]
|
|
|
+ this.areaList = [...newAreaList]
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
@@ -471,6 +498,7 @@ export default {
|
|
|
}).then(res => {
|
|
|
if (res.data) {
|
|
|
const data = JSON.parse(res.data)
|
|
|
+ this.polylines = data.polylines && data.polylines.length > 0 ? [...data.polylines] : []
|
|
|
this.polygons = [...data.polygons]
|
|
|
this.markerData = [...data.markerData]
|
|
|
this.mapDiyObj = {
|
|
|
@@ -491,8 +519,10 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
document.title = res.title || '洪楼地图1'
|
|
|
+ // this.getDef()
|
|
|
})
|
|
|
},
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -515,7 +545,7 @@ export default {
|
|
|
text-align: center;
|
|
|
padding: 6px 10px;
|
|
|
border-radius: 6px;
|
|
|
- background: #ebad57;
|
|
|
+ background: #369af7;
|
|
|
}
|
|
|
|
|
|
.scoped-select-center {
|
|
|
@@ -532,12 +562,13 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+
|
|
|
::v-deep .amap-marker-label {
|
|
|
border-color: #dcdcdc;
|
|
|
border-radius: 2px;
|
|
|
padding: 3px 5px;
|
|
|
color: #666;
|
|
|
- background: #f0f0f0;
|
|
|
+ background: #fff;
|
|
|
box-shadow: 0 0 3px #ccc;
|
|
|
}
|
|
|
::v-deep .amap-logo{
|
|
|
@@ -547,8 +578,8 @@ export default {
|
|
|
opacity:0;
|
|
|
}
|
|
|
::v-deep .amap-icon img {
|
|
|
- width: 20px !important;
|
|
|
- height: 20px !important;
|
|
|
+ width: 11px !important;
|
|
|
+ height: 11px !important;
|
|
|
}
|
|
|
|
|
|
.scoped-marker-area {
|
|
|
@@ -560,7 +591,7 @@ export default {
|
|
|
text-align: center;
|
|
|
font-size: 12px;
|
|
|
border-radius: 50%;
|
|
|
- padding-top: 16px;
|
|
|
+ padding-top: 20px;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
|
