瀏覽代碼

地图优化

wulanhaote
hbao 3 年之前
父節點
當前提交
16c2f5515c
共有 1 個檔案被更改,包括 281 行新增15 行删除
  1. +281
    -15
      src/views/homesteadSurvey/list.vue

+ 281
- 15
src/views/homesteadSurvey/list.vue 查看文件

@@ -1387,7 +1387,9 @@
mapGeoServerUrl:"", mapGeoServerUrl:"",
backMap:"", backMap:"",
// 任务完成标记 // 任务完成标记

//宅基地点击事件
mapXs: false,
mapClick:"",
isFinished:false, isFinished:false,
// //
showImageList:false, showImageList:false,
@@ -3095,6 +3097,38 @@
}) })
.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) == "{") {
//自然幢图层查询开始 ------------------start
var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + that.mapZjdData.zjddm + "'";
var zrzTcMapOn = new ol.layer.Image({
source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: {
LAYERS: 'zjd_dc:t_house_survey_zrz',
TILED: true,
cql_filter: cql_filter_map,
SRID: 3857,
TIMESTAMP: new Date().getTime(),
},
}),
});
map.addLayer(zrzTcMapOn);
//自然幢图层查询开始 ------------------start
//附属设施图层查询开始 ------------------start
//var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
var fsssTcMapOn = new ol.layer.Image({
source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: {
LAYERS: 'zjd_dc:t_house_survey_fsss',
TILED: true,
cql_filter: cql_filter_map,
SRID: 3857,
TIMESTAMP: new Date().getTime(),
},
}),
});
map.addLayer(fsssTcMapOn);
//附属设施图层查询开始 ------------------end
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({
@@ -4714,6 +4748,8 @@
that.mapZjdTeAll.mapZrzAData = {}; that.mapZjdTeAll.mapZrzAData = {};
that.mapZjdTeAll.mapFsssAData = {}; that.mapZjdTeAll.mapFsssAData = {};
that.mapZjdDataTure = ""; that.mapZjdDataTure = "";
that.mapXs =false;
that.mapClick ="";
console.log("【异常】", error); console.log("【异常】", error);
}); });
} }
@@ -4737,6 +4773,7 @@
if ($("#info .featureInfo .featureInfo").text() == "t_house_survey_zjdzd") { if ($("#info .featureInfo .featureInfo").text() == "t_house_survey_zjdzd") {
map.removeLayer(hc_land_on); map.removeLayer(hc_land_on);
that.mapHasDateStatus = 2; that.mapHasDateStatus = 2;
that.mapXs = true;
let obj = {}; let obj = {};
let trs = $("#info .featureInfo").find("tr:eq(1)"); let trs = $("#info .featureInfo").find("tr:eq(1)");
let zjdXq = trs.find("td").eq(0).text(); let zjdXq = trs.find("td").eq(0).text();
@@ -4755,6 +4792,7 @@
"deptId": that.$cookies.get("item").deptId, "deptId": that.$cookies.get("item").deptId,
"zjddm": obj.zjddm, "zjddm": obj.zjddm,
} }
that.mapClick = obj.zjddm;
//点击查看自然幢 //点击查看自然幢
//自然幢图层查询开始 ------------------start //自然幢图层查询开始 ------------------start
var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'"; var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
@@ -4889,20 +4927,105 @@
} }
that.$cookies.set("search", "") that.$cookies.set("search", "")
//that.$cookies.set("map", "") //that.$cookies.set("map", "")
listZjdzd(params).then((response) => {
that.mapZjdData = response.rows[0];
//that.mapZjdAData.active = 1;
that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
getZrz(obj.id).then((response) => {
if (response.data.scjzmj != "") {
that.textMjAll = response.data.scjzmj;
console.log(that.mapZjdData);
//if (that.mapZjdData !="" && that.mapZjdData !=null && that.mapZjdData !=undefined) {
console.log(that.mapClick);
console.log(obj.zjddm);
if(that.mapXs && that.mapClick == obj.zjddm){
listZjdzd(params).then((response) => {
that.mapZjdData = response.rows[0];
//that.mapZjdAData.active = 1;
that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
getZrz(obj.id).then((response) => {
if (response.data.scjzmj != "") {
that.textMjAll = response.data.scjzmj;
} else {
that.textMjAllNum = "1";
}
that.mapZrzData = response.data;
that.mapZrzData.active = 3;
that.mapZjdTeAll.mapZrzAData = that.mapZrzData;
that.zjdHcDy = obj.zjddm;
var styleZjd = new ol.style.Style({
stroke: new ol.style.Stroke({
//边界样式
color: "#CCFF66",
width: 6,
}),
});
hc_land_on = new ol.layer.Vector({
title: "add Layer",
source: new ol.source.Vector({
projection: projection,
features: new ol.format.GeoJSON().readFeatures("{\n" +
" \"type\": \"Feature\",\n" +
" \"geometry\":" + that.mapZrzData.theGeom + ", \"properties\":" + JSON.stringify(that.mapZrzData) + "}"),
}),
style: styleZjd
});
map.addLayer(hc_land_on);
var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
// 只设置需要的属性即可
center: center, // 中心点
zoom: 17.8, // 缩放级别
rotation: undefined, // 缩放完成view视图旋转弧度
duration: 1000, // 缩放持续时间,默认不需要设置
resolution: Math.random() * 0.00000001,
});
});
});
} else {
//自然幢图层查询开始 ------------------start
var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
var zrzTcMapOn = new ol.layer.Image({
source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: {
LAYERS: 'zjd_dc:t_house_survey_zrz',
TILED: true,
cql_filter: cql_filter_map,
SRID: 3857,
TIMESTAMP: new Date().getTime(),
},
}),
});
map.addLayer(zrzTcMapOn);
//自然幢图层查询开始 ------------------start
//附属设施图层查询开始 ------------------start
//var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
var fsssTcMapOn = new ol.layer.Image({
source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: {
LAYERS: 'zjd_dc:t_house_survey_fsss',
TILED: true,
cql_filter: cql_filter_map,
SRID: 3857,
TIMESTAMP: new Date().getTime(),
},
}),
});
map.addLayer(fsssTcMapOn);
//附属设施图层查询开始 ------------------end
listZjdzd(params).then((response) => {
if (response.rows[0].zdmj != "") {
that.textMjAll = response.rows[0].zdmj;
} else { } else {
that.textMjAllNum = "1"; that.textMjAllNum = "1";
} }
that.mapZrzData = response.data;
that.mapZrzData.active = 3;
that.mapZjdTeAll.mapZrzAData = that.mapZrzData;
that.mapZjdData = response.rows[0];
that.mapZjdData.active = 1;
that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
that.mapZjdDataTure = 1;
that.zjdHcDy = obj.zjddm; that.zjdHcDy = obj.zjddm;
that.mapClick = obj.zjddm;
that.mapXs = true;
var styleZjd = new ol.style.Style({ var styleZjd = new ol.style.Style({
stroke: new ol.style.Stroke({ stroke: new ol.style.Stroke({
//边界样式 //边界样式
@@ -4916,7 +5039,7 @@
projection: projection, projection: projection,
features: new ol.format.GeoJSON().readFeatures("{\n" + features: new ol.format.GeoJSON().readFeatures("{\n" +
" \"type\": \"Feature\",\n" + " \"type\": \"Feature\",\n" +
" \"geometry\":" + that.mapZrzData.theGeom + ", \"properties\":" + JSON.stringify(that.mapZrzData) + "}"),
" \"geometry\":" + that.mapZjdData.theGeom + ", \"properties\":" + JSON.stringify(that.mapZjdData) + "}"),
}), }),
style: styleZjd style: styleZjd
}); });
@@ -4935,8 +5058,39 @@
duration: 1000, // 缩放持续时间,默认不需要设置 duration: 1000, // 缩放持续时间,默认不需要设置
resolution:Math.random() * 0.00000001, resolution:Math.random() * 0.00000001,
}); });

function createLabelStyleMap() {
return new ol.style.Style({
text: new ol.style.Text({
text: that.mapZjdData.syqr,
textAlign: "center", //位置
textBaseline: "middle", //基准线
font: "normal 16px 微软雅黑", //文字样式
//text: "标注点", //文本内容
fill: new ol.style.Fill({
//文本填充样式(即文字颜色)
color: "#09DDCE",
width: 10,
}),
overflow: false //超出面的部分不显示
}),
zIndex: 9999,
});
}

var newcenterFeatureMap = new ol.Feature({
geometry: new ol.geom.Point(center), //几何信息
//name: "标注点",
});
var sourceMapLookMap = new ol.source.Vector({wrapX: false});
vector_drawing_map = new ol.layer.Vector({
source: sourceMapLookMap,
});
map.addLayer(vector_drawing_map);
newcenterFeatureMap.setStyle(createLabelStyleMap()); //设置要素样式
sourceMapLookMap.addFeature(newcenterFeatureMap);
}); });
});
}
} else if ($("#info .featureInfo .featureInfo").text() == "t_house_survey_fsss") { } else if ($("#info .featureInfo .featureInfo").text() == "t_house_survey_fsss") {
that.mapZjdTeAll.mapZrzAData = {}; that.mapZjdTeAll.mapZrzAData = {};
that.mapZjdDataTure = ""; that.mapZjdDataTure = "";
@@ -4960,7 +5114,8 @@
"pageSize": 20, "pageSize": 20,
} }
that.$cookies.remove("search") that.$cookies.remove("search")
//that.$cookies.set("map", "")
//if (that.mapZjdData !="" && that.mapZjdData !=null && that.mapZjdData !=undefined) {
if(that.mapXs && that.mapClick == obj.zjddm){
listZjdzd(params).then((response) => { listZjdzd(params).then((response) => {
that.mapZjdData = response.rows[0]; that.mapZjdData = response.rows[0];
that.mapZjdData.active = 1; that.mapZjdData.active = 1;
@@ -5006,10 +5161,121 @@
zoom: 17.8, // 缩放级别 zoom: 17.8, // 缩放级别
rotation: undefined, // 缩放完成view视图旋转弧度 rotation: undefined, // 缩放完成view视图旋转弧度
duration: 1000, // 缩放持续时间,默认不需要设置 duration: 1000, // 缩放持续时间,默认不需要设置
resolution:Math.random() * 0.00000001,
resolution: Math.random() * 0.00000001,
}); });
}); });
}); });
} else {
//自然幢图层查询开始 ------------------start
var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
var zrzTcMapOn = new ol.layer.Image({
source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: {
LAYERS: 'zjd_dc:t_house_survey_zrz',
TILED: true,
cql_filter: cql_filter_map,
SRID: 3857,
TIMESTAMP: new Date().getTime(),
},
}),
});
map.addLayer(zrzTcMapOn);
//自然幢图层查询开始 ------------------start
//附属设施图层查询开始 ------------------start
//var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
var fsssTcMapOn = new ol.layer.Image({
source: new ol.source.ImageWMS({
url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
params: {
LAYERS: 'zjd_dc:t_house_survey_fsss',
TILED: true,
cql_filter: cql_filter_map,
SRID: 3857,
TIMESTAMP: new Date().getTime(),
},
}),
});
map.addLayer(fsssTcMapOn);
//附属设施图层查询开始 ------------------end
listZjdzd(params).then((response) => {
if (response.rows[0].zdmj != "") {
that.textMjAll = response.rows[0].zdmj;
} else {
that.textMjAllNum = "1";
}
that.mapZjdData = response.rows[0];
that.mapZjdData.active = 1;
that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
that.mapZjdDataTure = 1;
that.zjdHcDy = obj.zjddm;
that.mapClick = obj.zjddm;
that.mapXs = true;
var styleZjd = new ol.style.Style({
stroke: new ol.style.Stroke({
//边界样式
color: "#CCFF66",
width: 6,
}),
});
hc_land_on = new ol.layer.Vector({
title: "add Layer",
source: new ol.source.Vector({
projection: projection,
features: new ol.format.GeoJSON().readFeatures("{\n" +
" \"type\": \"Feature\",\n" +
" \"geometry\":" + that.mapZjdData.theGeom + ", \"properties\":" + JSON.stringify(that.mapZjdData) + "}"),
}),
style: styleZjd
});
map.addLayer(hc_land_on);
var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
//定位查询位置
var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
map.getView().animate({
// 只设置需要的属性即可
center: center, // 中心点
zoom: 17.8, // 缩放级别
rotation: undefined, // 缩放完成view视图旋转弧度
duration: 1000, // 缩放持续时间,默认不需要设置
resolution:Math.random() * 0.00000001,
});

function createLabelStyleMap() {
return new ol.style.Style({
text: new ol.style.Text({
text: that.mapZjdData.syqr,
textAlign: "center", //位置
textBaseline: "middle", //基准线
font: "normal 16px 微软雅黑", //文字样式
//text: "标注点", //文本内容
fill: new ol.style.Fill({
//文本填充样式(即文字颜色)
color: "#09DDCE",
width: 10,
}),
overflow: false //超出面的部分不显示
}),
zIndex: 9999,
});
}

var newcenterFeatureMap = new ol.Feature({
geometry: new ol.geom.Point(center), //几何信息
//name: "标注点",
});
var sourceMapLookMap = new ol.source.Vector({wrapX: false});
vector_drawing_map = new ol.layer.Vector({
source: sourceMapLookMap,
});
map.addLayer(vector_drawing_map);
newcenterFeatureMap.setStyle(createLabelStyleMap()); //设置要素样式
sourceMapLookMap.addFeature(newcenterFeatureMap);
});
}
// if(obj.jzmj != ""){ // if(obj.jzmj != ""){
// that.textMjAll = obj.jzmj; // that.textMjAll = obj.jzmj;
// } else { // } else {


Loading…
取消
儲存