zhangzl
/
nsgk_mobile
2
0
複製 0
程式碼 問題 0 合併請求 0 版本發佈 0 Wiki 活動
瀏覽代碼

优化地图

wulanhaote
hbao 3 年之前
父節點
a21171052c
當前提交
fb56b806b7
共有 3 個檔案被更改，包括 135 行新增 和 94 行删除
統一視圖
Diff Options
Show Stats Download Patch File Download Diff File
  1. +47
    -49
      src/components/Map/MapGisDrawing.vue
  2. +36
    -13
      src/views/homesteadSurvey/add.vue
  3. +52
    -32
      src/views/homesteadSurvey/list.vue

+ 47
- 49
src/components/Map/MapGisDrawing.vue 查看文件

@@ -35,6 +35,7 @@ export default {
newZb: null, newZb: null,
newGeom: null, newGeom: null,
mapData: null, mapData: null,
map:this.guidProduct(),
//地图服务地址 //地图服务地址
mapGeoServerUrl:"", mapGeoServerUrl:"",
}; };
@@ -68,7 +69,7 @@ export default {
/* console.log(this.message);*/ /* console.log(this.message);*/
//加载地图编辑 //加载地图编辑
var that = this; var that = this;
var map;
//var map;
//var hc_land; //var hc_land;
var draw; // global so we can remove it later var draw; // global so we can remove it later
var vector_drawing; var vector_drawing;
@@ -102,6 +103,7 @@ export default {
}), }),
isGroup: true, isGroup: true,
name: "卫星影像图", name: "卫星影像图",
resolution:Math.random() * 0.00000001
}); });


var yingxzi = new ol.layer.Tile({ var yingxzi = new ol.layer.Tile({
@@ -110,9 +112,10 @@ export default {
}), }),
isGroup: true, isGroup: true,
name: "天地图文字标注--卫星影像图", name: "天地图文字标注--卫星影像图",
resolution:Math.random() * 0.00000001
}); });
//加载地图 //加载地图
map = new ol.Map({
that.map = new ol.Map({
controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮 controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
layers: [aerial, yingxzi], layers: [aerial, yingxzi],
projection: projection, projection: projection,
@@ -122,7 +125,10 @@ export default {
zoom: 15, zoom: 15,
minZoom: 5, //地图缩小限制 minZoom: 5, //地图缩小限制
maxZoom: 18.3, //地图放大限制 maxZoom: 18.3, //地图放大限制
resolution:Math.random() * 0.00000001
resolution:Math.random() * 0.00000001,
}),
interactions: ol.interaction.defaults({
pinchRotate: false // 移动端禁止地图旋转
}), }),
//view: new ol.View({ol.view.getResolution() + Math.random() * 0.00000001)});//随机数缩放实现刷新 //view: new ol.View({ol.view.getResolution() + Math.random() * 0.00000001)});//随机数缩放实现刷新
}); });
@@ -130,22 +136,14 @@ export default {
var zjdTc; var zjdTc;
var zrzTc; var zrzTc;
var fsssTc; var fsssTc;
map.removeLayer(zrzTc);
map.removeLayer(zjdTc);
map.removeLayer(fsssTc);
that.map.removeLayer(zrzTc);
that.map.removeLayer(zjdTc);
that.map.removeLayer(fsssTc);
//宅基地图层查询开始 ------------------start //宅基地图层查询开始 ------------------start
// var zjddmNew;
// if(that.$cookies.get("search").zjddm !=undefined && that.$cookies.get("search").zjddm !=""){
// zjddmNew = that.$cookies.get("search").zjddm;
// }else {
// if(that.$cookies.get("item").zjddm !=undefined && that.$cookies.get("item").zjddm !=""){
// zjddmNew = that.$cookies.get("item").zjddm;
// }
// }
var cql_filter_all = "dept_id='" + that.$cookies.get("search").deptId + "'" + "and zjddm='" + that.$cookies.get("search").zjddm + "'";

//村边界查询开始 ------------------------------end
var cql_filter_all = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + that.$cookies.get("search").zjddm + "'";
console.log(cql_filter_all); console.log(cql_filter_all);
console.log(that.$cookies.get("item"));
console.log(that.$cookies.get("search"));
zjdTc= new ol.layer.Image({ zjdTc= new ol.layer.Image({
source: new ol.source.ImageWMS({ source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl +"/geoserver/zjd_dc/wms", url: that.mapGeoServerUrl +"/geoserver/zjd_dc/wms",
@@ -158,7 +156,7 @@ export default {
resolution:Math.random() * 0.00000001, resolution:Math.random() * 0.00000001,
}), }),
}); });
map.addLayer(zjdTc);
that.map.addLayer(zjdTc);
//宅基地图层查询开始 ------------------start //宅基地图层查询开始 ------------------start
//自然幢图层查询开始 ------------------start //自然幢图层查询开始 ------------------start
zrzTc= new ol.layer.Image({ zrzTc= new ol.layer.Image({
@@ -173,7 +171,7 @@ export default {
resolution:Math.random() * 0.00000001, resolution:Math.random() * 0.00000001,
}), }),
}); });
map.addLayer(zrzTc);
that.map.addLayer(zrzTc);
//自然幢图层查询结束 ------------------end //自然幢图层查询结束 ------------------end


//附属设施图层查询开始 ------------------start //附属设施图层查询开始 ------------------start
@@ -189,7 +187,7 @@ export default {
resolution:Math.random() * 0.00000001, resolution:Math.random() * 0.00000001,
}), }),
}); });
map.addLayer(fsssTc);
that.map.addLayer(fsssTc);
//附属设施图层查询结束 ------------------end //附属设施图层查询结束 ------------------end
//图层查询定位开始 ---------start //图层查询定位开始 ---------start
if(this.message.substring(0,1) =="{"){ if(this.message.substring(0,1) =="{"){
@@ -218,14 +216,14 @@ export default {
}), }),
}), }),
}); });
map.addLayer(hc_land);
that.map.addLayer(hc_land);
var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX; var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY; var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX; var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY; var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置 //定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置 var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
that.map.getView().animate({
// 只设置需要的属性即可 // 只设置需要的属性即可
center: center, // 中心点 center: center, // 中心点
zoom: 16.9, // 缩放级别 zoom: 16.9, // 缩放级别
@@ -262,14 +260,14 @@ export default {
}), }),
}), }),
}); });
map.addLayer(hc_land);
that.map.addLayer(hc_land);
var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX; var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY; var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX; var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY; var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置 //定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置 var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
that.map.getView().animate({
// 只设置需要的属性即可 // 只设置需要的属性即可
center: center, // 中心点 center: center, // 中心点
zoom: 16.9, // 缩放级别 zoom: 16.9, // 缩放级别
@@ -287,15 +285,15 @@ export default {
//开始绘制地图 //开始绘制地图
$("#"+this.drawingPolygonMap).click(function () { $("#"+this.drawingPolygonMap).click(function () {
that.newGeom = 1; that.newGeom = 1;
map.removeLayer(hc_land);
map.removeLayer(vector_drawing);
that.map.removeLayer(hc_land);
that.map.removeLayer(vector_drawing);
//that.closeMoule = null; //that.closeMoule = null;
map.removeInteraction(draw);
that.map.removeInteraction(draw);
//var source = new ol.source.Vector({wrapX: false}); //var source = new ol.source.Vector({wrapX: false});
vector_drawing = new ol.layer.Vector({ vector_drawing = new ol.layer.Vector({
source: new ol.source.Vector(), source: new ol.source.Vector(),
}); });
map.addLayer(vector_drawing);
that.map.addLayer(vector_drawing);


function addInteraction() { function addInteraction() {
draw = new ol.interaction.Draw({ draw = new ol.interaction.Draw({
@@ -308,12 +306,12 @@ export default {
var coordinate = geometry.getCoordinates(); var coordinate = geometry.getCoordinates();
if(coordinate !="" && coordinate !=null){ if(coordinate !="" && coordinate !=null){
//map.addLayer(vector_drawing); //map.addLayer(vector_drawing);
map.removeInteraction(draw);
that.map.removeInteraction(draw);
} }
that.closeMoule = coordinate; that.closeMoule = coordinate;
that.formSubmit(); that.formSubmit();
}); });
map.addInteraction(draw);
that.map.addInteraction(draw);
} }


addInteraction(); addInteraction();
@@ -328,9 +326,9 @@ export default {
$("#"+this.drawingResetMap).click(function () { $("#"+this.drawingResetMap).click(function () {
that.newGeom = 2; that.newGeom = 2;
if(that.closeMoule !=null) { if(that.closeMoule !=null) {
map.addLayer(hc_land);
map.removeInteraction(draw);
map.removeLayer(vector_drawing);
that.map.addLayer(hc_land);
that.map.removeInteraction(draw);
that.map.removeLayer(vector_drawing);
that.formSubmit(); that.formSubmit();
} }
}); });
@@ -381,7 +379,7 @@ export default {
var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY; var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置 //定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置 var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
that.map.getView().animate({
// 只设置需要的属性即可 // 只设置需要的属性即可
center: center, // 中心点 center: center, // 中心点
zoom: 17.9, // 缩放级别 zoom: 17.9, // 缩放级别
@@ -423,7 +421,7 @@ export default {
var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY; var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置 //定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置 var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
that.map.getView().animate({
// 只设置需要的属性即可 // 只设置需要的属性即可
center: center, // 中心点 center: center, // 中心点
zoom: 16.9, // 缩放级别 zoom: 16.9, // 缩放级别
@@ -465,7 +463,7 @@ export default {
var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY; var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置 //定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置 var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
that.map.getView().animate({
// 只设置需要的属性即可 // 只设置需要的属性即可
center: center, // 中心点 center: center, // 中心点
zoom: 17.9, // 缩放级别 zoom: 17.9, // 缩放级别
@@ -508,7 +506,7 @@ export default {
var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY; var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置 //定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置 var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
that.map.getView().animate({
// 只设置需要的属性即可 // 只设置需要的属性即可
center: center, // 中心点 center: center, // 中心点
zoom: 16.9, // 缩放级别 zoom: 16.9, // 缩放级别
@@ -548,7 +546,7 @@ export default {
}); });


//加载地图 //加载地图
map = new ol.Map({
that.map = new ol.Map({
controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮 controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
layers: [aerial, yingxzi], layers: [aerial, yingxzi],
projection: projection, projection: projection,
@@ -610,8 +608,8 @@ export default {
console.log(data); console.log(data);
let resolution = map.getView().getResolutionForExtent(data.bbox,map.getSize()); let resolution = map.getView().getResolutionForExtent(data.bbox,map.getSize());
resolution:resolution + Math.random() * 0.00000001, resolution:resolution + Math.random() * 0.00000001,
map.getView().fit(data.bbox);
map.getView().setResolution(resolution);
that.map.getView().fit(data.bbox);
that.map.getView().setResolution(resolution);
// var datamap = data.bbox; // var datamap = data.bbox;
// var center = ol.extent.getCenter(datamap); // var center = ol.extent.getCenter(datamap);
// map.getView().animate({ // map.getView().animate({
@@ -623,7 +621,7 @@ export default {
.catch((error) => { .catch((error) => {
console.log("【异常】", error); console.log("【异常】", error);
}); });
map.addLayer(cunTc);
that.map.addLayer(cunTc);
//村边界查询开始 ------------------------------end //村边界查询开始 ------------------------------end
//宅基地图层查询开始 ------------------start //宅基地图层查询开始 ------------------start
//var cql_filter_all = "dept_id='" + that.$cookies.get("item").deptId + "'"; //var cql_filter_all = "dept_id='" + that.$cookies.get("item").deptId + "'";
@@ -638,7 +636,7 @@ export default {
}, },
}), }),
}); });
map.addLayer(zjdTc);
that.map.addLayer(zjdTc);
//宅基地图层查询开始 ------------------start //宅基地图层查询开始 ------------------start
// getQueryLand().then((response) => { // getQueryLand().then((response) => {
// if (response.code == 200) { // if (response.code == 200) {
@@ -674,12 +672,12 @@ export default {
//开始绘制地图 //开始绘制地图
$("#"+this.drawingPolygonMap).click(function () { $("#"+this.drawingPolygonMap).click(function () {
//that.closeMoule = null; //that.closeMoule = null;
map.removeInteraction(draw);
that.map.removeInteraction(draw);
//var source = new ol.source.Vector({wrapX: false}); //var source = new ol.source.Vector({wrapX: false});
vector_drawing = new ol.layer.Vector({ vector_drawing = new ol.layer.Vector({
source: new ol.source.Vector(), source: new ol.source.Vector(),
}); });
map.addLayer(vector_drawing);
that.map.addLayer(vector_drawing);


function addInteraction() { function addInteraction() {
draw = new ol.interaction.Draw({ draw = new ol.interaction.Draw({
@@ -698,7 +696,7 @@ export default {
that.closeMoule = coordinate; that.closeMoule = coordinate;
that.formSubmit(); that.formSubmit();
}); });
map.addInteraction(draw);
that.map.addInteraction(draw);
} }


addInteraction(); addInteraction();
@@ -712,8 +710,8 @@ export default {
// }); // });
//还原之前图层 //还原之前图层
$("#"+this.drawingResetMap).click(function () { $("#"+this.drawingResetMap).click(function () {
map.removeInteraction(draw);
map.removeLayer(vector_drawing);
that.map.removeInteraction(draw);
that.map.removeLayer(vector_drawing);
//that.closeMoule = null; //that.closeMoule = null;
that.formSubmit(); that.formSubmit();
}); });
@@ -755,7 +753,7 @@ export default {
var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY; var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置 //定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置 var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
that.map.getView().animate({
// 只设置需要的属性即可 // 只设置需要的属性即可
center: center, // 中心点 center: center, // 中心点
zoom: 17.9, // 缩放级别 zoom: 17.9, // 缩放级别
@@ -798,7 +796,7 @@ export default {
var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY; var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置 //定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置 var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
that.map.getView().animate({
// 只设置需要的属性即可 // 只设置需要的属性即可
center: center, // 中心点 center: center, // 中心点
zoom: 16.9, // 缩放级别 zoom: 16.9, // 缩放级别


+ 36
- 13
src/views/homesteadSurvey/add.vue 查看文件

@@ -20,7 +20,7 @@
<div style=" width:90%; left:5%;position:absolute;background:#fff;border-radius:15px;box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.16);padding: .3rem; <div style=" width:90%; left:5%;position:absolute;background:#fff;border-radius:15px;box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.16);padding: .3rem;
top:1.2rem"> top:1.2rem">
<van-row> <van-row>
<van-col span="4" :offset="1" style="text-align:center;" @click="mapClickLoading">
<van-col span="4" :offset="1" style="text-align:center;" @click="zjdProduct">
<div @click="active=1"> <div @click="active=1">
<van-icon :name="require('../../assets/images/housesteadSurvey/zjd'+(active==1?'A':'D')+'.png')" size="1rem" style="margin-top:0px;"/> <van-icon :name="require('../../assets/images/housesteadSurvey/zjd'+(active==1?'A':'D')+'.png')" size="1rem" style="margin-top:0px;"/>
<p :style="{color:(active==1?'rgb(34, 183, 242)':'#000')}">宅基地</p> <p :style="{color:(active==1?'rgb(34, 183, 242)':'#000')}">宅基地</p>
@@ -446,7 +446,7 @@
placeholder="备注" placeholder="备注"
maxlength="200" maxlength="200"
/> />
<MapGisDrawing ref="drewingClickLoading1" :message="form.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
<MapGisDrawing :ref="this.zjdProductResh" :message="form.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
<div style="margin: 16px;"> <div style="margin: 16px;">
<van-button v-if="isFinished" round color="#7AC943" style="width:100%" native-type="submit">保存</van-button> <van-button v-if="isFinished" round color="#7AC943" style="width:100%" native-type="submit">保存</van-button>
</div> </div>
@@ -1039,7 +1039,7 @@
label="备注" label="备注"
placeholder="备注" placeholder="备注"
/> />
<MapGisDrawing ref="drewingClickLoading3" :message="form3.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
<MapGisDrawing :ref="this.zrzProductResh" :message="form3.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
<div style="margin: 16px;" v-if="isFinished"> <div style="margin: 16px;" v-if="isFinished">
<van-button round block color="#7AC943" native-type="submit">保存</van-button> <van-button round block color="#7AC943" native-type="submit">保存</van-button>
</div> </div>
@@ -2418,7 +2418,7 @@
label="备注" label="备注"
placeholder="备注" placeholder="备注"
/> />
<MapGisDrawing ref="drewingClickLoading4" :message="form4.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
<MapGisDrawing :ref="this.fsssProductResh" :message="form4.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
<div style="margin: 16px;" v-if="isFinished"> <div style="margin: 16px;" v-if="isFinished">
<van-button round block color="#7AC943" native-type="submit">保存</van-button> <van-button round block color="#7AC943" native-type="submit">保存</van-button>
</div> </div>
@@ -3155,6 +3155,10 @@
cookiesInfo:null, cookiesInfo:null,
// 异常标记照片 // 异常标记照片
fileListyc:[], fileListyc:[],
//刷新随机数
zjdProductResh:this.guidProduct(),
zrzProductResh:this.guidProduct(),
fsssProductResh:this.guidProduct(),
}; };
}, },
created(){ created(){
@@ -3217,6 +3221,7 @@
this.cookiesInfo = this.$cookies.get("search") this.cookiesInfo = this.$cookies.get("search")
this.$cookies.set("search","") this.$cookies.set("search","")
this.item = this.cookiesInfo this.item = this.cookiesInfo
this.$cookies.set("search",this.cookiesInfo);
if(this.item.houseDataConfirmStatus!="CONFIRMED"){ if(this.item.houseDataConfirmStatus!="CONFIRMED"){
this.isFinished = true this.isFinished = true
} }
@@ -4521,7 +4526,7 @@
this.form.djName = res.dictLabel this.form.djName = res.dictLabel
} }
}) })
this.mapClickLoading();
this.zjdProduct();
}); });
}else{ }else{
let params = { let params = {
@@ -4556,7 +4561,7 @@
this.form.suyqrdm = response.rows[0].suyqrdm this.form.suyqrdm = response.rows[0].suyqrdm
this.form.zl = response.rows[0].suyqrmc this.form.zl = response.rows[0].suyqrmc
} }
this.mapClickLoading();
this.zjdProductResh();
}); });
} }
}, },
@@ -5478,7 +5483,7 @@


} }
this.showzrz = true; this.showzrz = true;
this.mapClickLoading();
this.zrzProduct();
this.active = 3; this.active = 3;
// if(){ // if(){
// //
@@ -5811,7 +5816,7 @@
} }
this.showfsss = true; this.showfsss = true;
this.active = 4; this.active = 4;
this.mapClickLoading();
this.fsssProduct();
} }
}, },
showPopup3() { showPopup3() {
@@ -6006,15 +6011,13 @@
}, },
//地图加载js------start //地图加载js------start
mapClickLoading(){ mapClickLoading(){
//this.$cookies.set("item", this.form);
console.log(this.$cookies.get("item"));
setTimeout(() => { setTimeout(() => {
if(this.active =="1"){ if(this.active =="1"){
this.$refs.drewingClickLoading1.drawingPaceCountryDarw();
this.$refs[this.zjdProductResh].drawingPaceCountryDarw();
}else if(this.active=="3"){ }else if(this.active=="3"){
this.$refs.drewingClickLoading3.drawingPaceCountryDarw();
this.$refs[this.zrzProductResh].drawingPaceCountryDarw();
}else if(this.active=="4"){ }else if(this.active=="4"){
this.$refs.drewingClickLoading4.drawingPaceCountryDarw();
this.$refs[this.fsssProductResh].drawingPaceCountryDarw();
} else { } else {


} }
@@ -6032,6 +6035,26 @@


} }
}, },
zjdProduct(){
this.zjdProductResh = this.guidProduct();
console.log(this.zjdProductResh);
this.mapClickLoading();
},
zrzProduct(){
this.zrzProductResh = this.guidProduct();
this.mapClickLoading();
},
fsssProduct(){
this.fsssProductResh = this.guidProduct();
this.mapClickLoading();
},
guidProduct(){
return 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = Math.random() * 16 | 0,
v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
},
//地图加载js------end //地图加载js------end
} }
} }


+ 52
- 32
src/views/homesteadSurvey/list.vue 查看文件

@@ -1382,6 +1382,7 @@
backTheGeom:"", backTheGeom:"",
//地图服务地址 //地图服务地址
mapGeoServerUrl:"", mapGeoServerUrl:"",
backMap:"",
// 任务完成标记 // 任务完成标记


isFinished:false, isFinished:false,
@@ -1390,10 +1391,10 @@
mounted(){ mounted(){
}, },
created(){ created(){
// if(location.href.indexOf("#reloaded")==-1){
// location.href=location.href+"#reloaded";
// location.reload();
// }
if(location.href.indexOf("#reloaded")==-1){
location.href=location.href+"#reloaded";
location.reload();
}
this.getDicts("zjlx").then(response => { this.getDicts("zjlx").then(response => {
this.zjlxOptions = response.data; this.zjlxOptions = response.data;
}); });
@@ -2921,13 +2922,12 @@
zoom: 10, zoom: 10,
minZoom: 5, //地图缩小限制 minZoom: 5, //地图缩小限制
maxZoom: 18.3, //地图放大限制 maxZoom: 18.3, //地图放大限制
resolution:Math.random() * 0.00000001,
resolution: Math.random() * 0.00000001,
}), }),
interactions: ol.interaction.defaults({ interactions: ol.interaction.defaults({
pinchRotate: false // 移动端禁止地图旋转 pinchRotate: false // 移动端禁止地图旋转
}), }),
}); });

//使用geoserver服务查询开始 -------------------start //使用geoserver服务查询开始 -------------------start
//镇边界查询开始 ------------------------------start //镇边界查询开始 ------------------------------start
// var zhenTc= new ol.layer.Tile({ // var zhenTc= new ol.layer.Tile({
@@ -2945,21 +2945,21 @@
//镇边界查询开始 ------------------------------end //镇边界查询开始 ------------------------------end
//村边界查询开始 ------------------------------start //村边界查询开始 ------------------------------start
var cql_filter var cql_filter
if(that.mapAddJumpNum == 1){
if (that.mapAddJumpNum == 1) {
cql_filter = "dept_id='" + that.mapAddJump + "'"; cql_filter = "dept_id='" + that.mapAddJump + "'";
} else { } else {
cql_filter = "dept_id='" + that.$cookies.get("item").deptId + "'"; cql_filter = "dept_id='" + that.$cookies.get("item").deptId + "'";
} }
var cunTc= new ol.layer.Image({
var cunTc = new ol.layer.Image({
source: new ol.source.ImageWMS({ source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: { params: {
LAYERS: 'zjd_dc:t_house_survey_border_village', LAYERS: 'zjd_dc:t_house_survey_border_village',
TILED: true, TILED: true,
cql_filter: cql_filter, cql_filter: cql_filter,
SRID: 3857, SRID: 3857,
}, },
resolution:Math.random() * 0.00000001,
resolution: Math.random() * 0.00000001,
}), }),
}); });
//定位查询位置 //定位查询位置
@@ -2976,7 +2976,7 @@
outputFormat: "application/json", outputFormat: "application/json",
//filter: ol.format.filter.equalTo(t,e,r)//前者是属性名，后者是对应值 //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名，后者是对应值
}; };
let url_dw = that.mapGeoServerUrl+"/geoserver/zjd_dc/wfs"; //wfsurl;
let url_dw = that.mapGeoServerUrl + "/geoserver/zjd_dc/wfs"; //wfsurl;
url_dw = url_dw + "?"; url_dw = url_dw + "?";
for (let key in param_dw) { for (let key in param_dw) {
url_dw = url_dw + key + "=" + param_dw[key] + "&"; url_dw = url_dw + key + "=" + param_dw[key] + "&";
@@ -2990,7 +2990,7 @@
return geojsonmap; return geojsonmap;
}) })
.then((data) => { .then((data) => {
if(that.backTheGeom !="" && that.backTheGeom !=undefined && that.backTheGeom.substring(0,1) =="{"){
if (that.backTheGeom != "" && that.backTheGeom != undefined && that.backTheGeom.substring(0, 1) == "{") {
hc_land_on = new ol.layer.Vector({ hc_land_on = new ol.layer.Vector({
title: "add Layer", title: "add Layer",
source: new ol.source.Vector({ source: new ol.source.Vector({
@@ -3018,13 +3018,17 @@
zoom: 17.9, // 缩放级别 zoom: 17.9, // 缩放级别
rotation: undefined, // 缩放完成view视图旋转弧度 rotation: undefined, // 缩放完成view视图旋转弧度
duration: 1000, // 缩放持续时间，默认不需要设置 duration: 1000, // 缩放持续时间，默认不需要设置
resolution:Math.random() * 0.00000001,
resolution: Math.random() * 0.00000001,
}); });
} else if(that.backTheGeom !="" && that.backTheGeom !=undefined && that.backTheGeom.substring(0,1) =="[") {
this.backMap =1;
} else if (that.backTheGeom != "" && that.backTheGeom != undefined && that.backTheGeom.substring(0, 1) == "[") {
//that.newHt ="1"; //that.newHt ="1";
var zbNew = JSON.stringify({"type": "MultiPolygon", "coordinates": [that.backTheGeom.replaceAll("\"","")]});
var leftJoin = zbNew.replace("\"[","[");
var rightJoin = leftJoin.replace("\"]","]");
var zbNew = JSON.stringify({
"type": "MultiPolygon",
"coordinates": [that.backTheGeom.replaceAll("\"", "")]
});
var leftJoin = zbNew.replace("\"[", "[");
var rightJoin = leftJoin.replace("\"]", "]");
hc_land_on = new ol.layer.Vector({ hc_land_on = new ol.layer.Vector({
title: "add Layer", title: "add Layer",
source: new ol.source.Vector({ source: new ol.source.Vector({
@@ -3058,12 +3062,13 @@
zoom: 16.9, // 缩放级别 zoom: 16.9, // 缩放级别
rotation: undefined, // 缩放完成view视图旋转弧度 rotation: undefined, // 缩放完成view视图旋转弧度
duration: 1000, // 缩放持续时间，默认不需要设置 duration: 1000, // 缩放持续时间，默认不需要设置
resolution:Math.random() * 0.00000001,
resolution: Math.random() * 0.00000001,
}); });
}else {
let resolution = map.getView().getResolutionForExtent(data.bbox,map.getSize());
this.backMap =1;
} else {
let resolution = map.getView().getResolutionForExtent(data.bbox, map.getSize());
resolution:resolution + Math.random() * 0.00000001, resolution:resolution + Math.random() * 0.00000001,
map.getView().fit(data.bbox);
map.getView().fit(data.bbox);
map.getView().setResolution(resolution); map.getView().setResolution(resolution);
} }
}) })
@@ -3074,55 +3079,69 @@
//村边界查询开始 ------------------------------end //村边界查询开始 ------------------------------end
//宅基地图层查询开始 ------------------start //宅基地图层查询开始 ------------------start
//var cql_filter_all = "dept_id='" + that.$cookies.get("item").deptId + "'"; //var cql_filter_all = "dept_id='" + that.$cookies.get("item").deptId + "'";
var zjdTc= new ol.layer.Image({
var zjdTc = new ol.layer.Image({
source: new ol.source.ImageWMS({ source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: { params: {
LAYERS: 'zjd_dc:t_house_survey_zjdzd', LAYERS: 'zjd_dc:t_house_survey_zjdzd',
TILED: true, TILED: true,
cql_filter: cql_filter, cql_filter: cql_filter,
SRID: 3857, SRID: 3857,
}, },
resolution:Math.random() * 0.00000001,
resolution: Math.random() * 0.00000001,
}), }),
}); });
map.addLayer(zjdTc); map.addLayer(zjdTc);
//宅基地图层查询开始 ------------------start //宅基地图层查询开始 ------------------start


//自然幢图层查询开始 ------------------start //自然幢图层查询开始 ------------------start
var zrzTc= new ol.layer.Image({
var zrzTc = new ol.layer.Image({
source: new ol.source.ImageWMS({ source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: { params: {
LAYERS: 'zjd_dc:t_house_survey_zrz', LAYERS: 'zjd_dc:t_house_survey_zrz',
TILED: true, TILED: true,
cql_filter: cql_filter, cql_filter: cql_filter,
SRID: 3857, SRID: 3857,
}, },
resolution:Math.random() * 0.00000001,
resolution: Math.random() * 0.00000001,
}), }),
}); });
map.addLayer(zrzTc); map.addLayer(zrzTc);
//自然幢图层查询开始 ------------------start //自然幢图层查询开始 ------------------start


//附属设施图层查询开始 ------------------start //附属设施图层查询开始 ------------------start
var fsssTc= new ol.layer.Image({
var fsssTc = new ol.layer.Image({
source: new ol.source.ImageWMS({ source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: { params: {
LAYERS: 'zjd_dc:t_house_survey_fsss', LAYERS: 'zjd_dc:t_house_survey_fsss',
TILED: true, TILED: true,
cql_filter: cql_filter, cql_filter: cql_filter,
SRID: 3857, SRID: 3857,
}, },
resolution:Math.random() * 0.00000001,
resolution: Math.random() * 0.00000001,
}), }),
}); });
map.addLayer(fsssTc); map.addLayer(fsssTc);
//附属设施图层查询开始 ------------------start //附属设施图层查询开始 ------------------start
//使用geoserver服务查询开始 -------------------end //使用geoserver服务查询开始 -------------------end


if(this.backMap ==1){
var cql = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + this.mapZjdTeAll.mapZjdAData.zjddm + "'";
var wmsSourceBack = new ol.source.ImageWMS({
crossOrigin: 'anonymous',
params: {
LAYERS: 'zjd_dc:t_house_survey_all',
'VERSION': '1.1.0',
'FORMAT': "image/png",
'CQL_FILTER': cql
},
serverType: 'geoserver',
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
});
zjdTc.setSource(wmsSourceBack);
ol.view.setResolution(ol.view.getResolution() + Math.random() * 0.00000001);//随机数缩放实现刷新
}
//数据库直接加载数据渲染方式---------------------------------------------------start //数据库直接加载数据渲染方式---------------------------------------------------start
//判断当前账套是否有数据 //判断当前账套是否有数据
// var mapTalkAbout = true; // var mapTalkAbout = true;
@@ -4498,6 +4517,7 @@
//属性查询结束 ------------------end //属性查询结束 ------------------end
//点击查询详细信息 //点击查询详细信息
map.on("singleclick", function (evt) { map.on("singleclick", function (evt) {
console.log(evt);
let feature = map.forEachFeatureAtPixel( let feature = map.forEachFeatureAtPixel(
evt.pixel, evt.pixel,
(feature) => feature (feature) => feature


Write Preview
Loading…
取消
儲存