This commit is contained in:
parent
95794a9199
commit
da9d53099b
|
@ -58,7 +58,7 @@ window.addEventListener("resize", function () {
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.content {
|
.content {
|
||||||
background: url("../assets/bgImg.png") no-repeat 100% 100%;
|
background: url("../assets/bgImg.png") no-repeat 0/100% 100%;
|
||||||
background-color: #254574;
|
background-color: #254574;
|
||||||
// background-image: url("../assets/bgImg.png");
|
// background-image: url("../assets/bgImg.png");
|
||||||
// background-size: 100% 100%;
|
// background-size: 100% 100%;
|
||||||
|
|
|
@ -1056,7 +1056,7 @@ const pagination = reactive({
|
||||||
//--------定义方法----------------------------------------
|
//--------定义方法----------------------------------------
|
||||||
//地图初始化
|
//地图初始化
|
||||||
const initMap = () => {
|
const initMap = () => {
|
||||||
map = new BMapGL.Map("map", { minZoom: 8, maxZoom: 18 });
|
map = new BMapGL.Map("map", { minZoom: 8, maxZoom: 19 });
|
||||||
map.setMapType(BMAP_SATELLITE_MAP);
|
map.setMapType(BMAP_SATELLITE_MAP);
|
||||||
map.enableScrollWheelZoom(true);
|
map.enableScrollWheelZoom(true);
|
||||||
goMapCenter([119.178783, 29.034583], 11);
|
goMapCenter([119.178783, 29.034583], 11);
|
||||||
|
@ -3231,18 +3231,21 @@ const createCustomOverlay = (polygon, indexx) => {
|
||||||
content.style.display = "flex";
|
content.style.display = "flex";
|
||||||
content.style.flexDirection = "column";
|
content.style.flexDirection = "column";
|
||||||
content.style.alignItems = "center";
|
content.style.alignItems = "center";
|
||||||
|
content.style.justifyContent = "end";
|
||||||
content.style.height = "40px";
|
content.style.height = "40px";
|
||||||
content.style.width = "40px";
|
content.style.width = "140px";
|
||||||
content.style.zIndex = BMapGL.Overlay.getZIndex(this.point.lat);
|
content.style.zIndex = BMapGL.Overlay.getZIndex(this.point.lat);
|
||||||
|
|
||||||
var div = document.createElement("div");
|
var div = document.createElement("div");
|
||||||
div.style.color = "#ddd";
|
div.style.color = "#ddd";
|
||||||
div.style.padding = `${polygon.padding}`;
|
div.style.padding = `${polygon.padding}`;
|
||||||
div.style.whiteSpace = "nowrap";
|
// div.style.whiteSpace = "nowrap";
|
||||||
|
div.style.maxWidth = "100px";
|
||||||
div.style.MozUserSelect = "none";
|
div.style.MozUserSelect = "none";
|
||||||
div.style.fontSize = "12px";
|
div.style.fontSize = "12px";
|
||||||
div.style.borderRadius = "10px";
|
div.style.borderRadius = "10px";
|
||||||
div.style.display = "flex";
|
div.style.display = "flex";
|
||||||
|
div.style.flexWrap = "wrap";
|
||||||
div.style.justifyContent = "center";
|
div.style.justifyContent = "center";
|
||||||
div.style.alignItems = "center";
|
div.style.alignItems = "center";
|
||||||
div.style.background = `url(${polygon.img}) no-repeat 0/100% 100%`;
|
div.style.background = `url(${polygon.img}) no-repeat 0/100% 100%`;
|
||||||
|
@ -3254,6 +3257,7 @@ const createCustomOverlay = (polygon, indexx) => {
|
||||||
title.style.fontSize = "14px";
|
title.style.fontSize = "14px";
|
||||||
title.style.fontWeight = "700";
|
title.style.fontWeight = "700";
|
||||||
title.style.marginLeft = "0px";
|
title.style.marginLeft = "0px";
|
||||||
|
title.style.display = "flex";
|
||||||
title.style.color = `${polygon.textColor}`;
|
title.style.color = `${polygon.textColor}`;
|
||||||
div.appendChild(title);
|
div.appendChild(title);
|
||||||
title.appendChild(document.createTextNode(this.properties.title));
|
title.appendChild(document.createTextNode(this.properties.title));
|
||||||
|
@ -3281,6 +3285,7 @@ const createCustomOverlay = (polygon, indexx) => {
|
||||||
// offsetY: 0,
|
// offsetY: 0,
|
||||||
offsetX: 10,
|
offsetX: 10,
|
||||||
offsetY: -15,
|
offsetY: -15,
|
||||||
|
zIndex: 10,
|
||||||
properties: {
|
properties: {
|
||||||
title: polygon.name,
|
title: polygon.name,
|
||||||
imgSrc2: polygon.img2,
|
imgSrc2: polygon.img2,
|
||||||
|
@ -3321,7 +3326,6 @@ const addFwqCs = () => {
|
||||||
fillColor: fillColor,
|
fillColor: fillColor,
|
||||||
fillOpacity: 0.6,
|
fillOpacity: 0.6,
|
||||||
name: item.name,
|
name: item.name,
|
||||||
zIndex: 2,
|
|
||||||
});
|
});
|
||||||
map.addOverlay(fwq_dk.value[index]);
|
map.addOverlay(fwq_dk.value[index]);
|
||||||
}
|
}
|
||||||
|
@ -3368,6 +3372,7 @@ const addFwqCsCenter = (polygon, indexx) => {
|
||||||
}
|
}
|
||||||
fwq_center.value[indexx] = new BMapGL.CustomOverlay(createLabelDOM, {
|
fwq_center.value[indexx] = new BMapGL.CustomOverlay(createLabelDOM, {
|
||||||
point: new BMapGL.Point(...polygon.center),
|
point: new BMapGL.Point(...polygon.center),
|
||||||
|
zIndex: 1,
|
||||||
opacity: 0.5,
|
opacity: 0.5,
|
||||||
offsetX: 10,
|
offsetX: 10,
|
||||||
offsetY: -15,
|
offsetY: -15,
|
||||||
|
@ -3382,12 +3387,7 @@ const addFwqCsCenter = (polygon, indexx) => {
|
||||||
//
|
//
|
||||||
//服务点数据处理
|
//服务点数据处理
|
||||||
const updateFwqList = (data, townName, communityName) => {
|
const updateFwqList = (data, townName, communityName) => {
|
||||||
// console.log(data, townName, communityName,'服务器数据');
|
|
||||||
let updatedFwqList = [];
|
let updatedFwqList = [];
|
||||||
// jbfwqTotal.value.forEach((town) => {
|
|
||||||
// if (town.name === townName) {
|
|
||||||
// town.child.forEach((community, index) => {
|
|
||||||
// if (community.name === communityName) {
|
|
||||||
fwq_cslist.value.length = 0;
|
fwq_cslist.value.length = 0;
|
||||||
fwq_jzdk.value.length = 0;
|
fwq_jzdk.value.length = 0;
|
||||||
fwq_centerList.value.length = 0;
|
fwq_centerList.value.length = 0;
|
||||||
|
@ -3409,8 +3409,75 @@ const updateFwqList = (data, townName, communityName) => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
console.log(77, fwq_centerList.value);
|
console.log(77, fwq_centerList.value);
|
||||||
|
//把坐标相同的合并
|
||||||
|
// let toP = [];//存放坐标
|
||||||
|
// let toName = [];//存放名称
|
||||||
|
// data.forEach((item, index) => {
|
||||||
|
// if (toP.length == 0) {
|
||||||
|
// toP.push([item.jd, item.wd]);
|
||||||
|
// toName.push(item.zyysmc);
|
||||||
|
// } else {
|
||||||
|
// let b = [item.jd, item.wd];
|
||||||
|
// let indexS = toP.findIndex((subArray) => {
|
||||||
|
// return subArray.every((element, index) => element === b[index]);
|
||||||
|
// });
|
||||||
|
|
||||||
updatedFwqList = data.map((item) => ({
|
// if (indexS !== -1) {
|
||||||
|
// toName[indexS] = toName[indexS] + "," + item.zyysmc;
|
||||||
|
// } else {
|
||||||
|
// toP.push(b);
|
||||||
|
// toName.push(item.zyysmc);
|
||||||
|
// }
|
||||||
|
// }aa
|
||||||
|
// });
|
||||||
|
// let totalA = [];
|
||||||
|
// toP.forEach((item, index) => {
|
||||||
|
// totalA.push({
|
||||||
|
// zyysmc: toName[index],
|
||||||
|
// jd: item[0],
|
||||||
|
// wd: item[1],
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
//根据字数来修改参数
|
||||||
|
updatedFwqList = data.map((item) => {
|
||||||
|
if (item.zyysmc.length > 21) {
|
||||||
|
return {
|
||||||
|
x: 53,
|
||||||
|
y: 0,
|
||||||
|
img: fwqbg1,
|
||||||
|
img2: b2,
|
||||||
|
name: item.zyysmc,
|
||||||
|
point: [item.jd, item.wd],
|
||||||
|
padding: "4px 8px 24px",
|
||||||
|
textColor: "#fff",
|
||||||
|
bgColor: "#00b050",
|
||||||
|
};
|
||||||
|
} else if (item.zyysmc.length > 14) {
|
||||||
|
return {
|
||||||
|
x: 53,
|
||||||
|
y: 0,
|
||||||
|
img: fwqbg1,
|
||||||
|
img2: b2,
|
||||||
|
name: item.zyysmc,
|
||||||
|
point: [item.jd, item.wd],
|
||||||
|
padding: "4px 8px 18px",
|
||||||
|
textColor: "#fff",
|
||||||
|
bgColor: "#00b050",
|
||||||
|
};
|
||||||
|
} else if (item.zyysmc.length > 7) {
|
||||||
|
return {
|
||||||
|
x: 53,
|
||||||
|
y: 0,
|
||||||
|
img: fwqbg1,
|
||||||
|
img2: b2,
|
||||||
|
name: item.zyysmc,
|
||||||
|
point: [item.jd, item.wd],
|
||||||
|
padding: "4px 8px 13px",
|
||||||
|
textColor: "#fff",
|
||||||
|
bgColor: "#00b050",
|
||||||
|
};
|
||||||
|
} else if (item.zyysmc.length > 4) {
|
||||||
|
return {
|
||||||
x: 53,
|
x: 53,
|
||||||
y: 0,
|
y: 0,
|
||||||
img: fwqbg1,
|
img: fwqbg1,
|
||||||
|
@ -3420,7 +3487,21 @@ const updateFwqList = (data, townName, communityName) => {
|
||||||
padding: "4px 8px 10px",
|
padding: "4px 8px 10px",
|
||||||
textColor: "#fff",
|
textColor: "#fff",
|
||||||
bgColor: "#00b050",
|
bgColor: "#00b050",
|
||||||
}));
|
};
|
||||||
|
} else {
|
||||||
|
return {
|
||||||
|
x: 30,
|
||||||
|
y: 0,
|
||||||
|
img: fwqbg1,
|
||||||
|
img2: b2,
|
||||||
|
name: item.zyysmc,
|
||||||
|
point: [item.jd, item.wd],
|
||||||
|
padding: "4px 8px 10px",
|
||||||
|
textColor: "#fff",
|
||||||
|
bgColor: "#00b050",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
});
|
||||||
// community.fwqList = updatedFwqList;
|
// community.fwqList = updatedFwqList;
|
||||||
// }
|
// }
|
||||||
// });
|
// });
|
||||||
|
|
Loading…
Reference in New Issue