809 lines
22 KiB
Vue
809 lines
22 KiB
Vue
<template>
|
||
<div class="soilMositure">
|
||
<div class="smBodyLeft">
|
||
<div class="smps">
|
||
<div class="box1">
|
||
<span class="sp1"></span><span class="sp2">样本库</span>
|
||
</div>
|
||
<div>
|
||
<el-form :inline="true" :model="simpleForm" class="demo-form-inline">
|
||
<el-form-item>
|
||
<el-cascader
|
||
v-model="simpleForm.sampleFun"
|
||
:disabled="sampleFun !== ''"
|
||
:options="funcOpt"
|
||
size="mini"
|
||
placeholder="请选择抽样方法"
|
||
popper-class="cascader-popper"
|
||
@change="changeSampleFun"
|
||
clearable
|
||
:show-all-levels="false"
|
||
></el-cascader>
|
||
<el-button
|
||
v-if="isDeepSpace"
|
||
class="edit-btn"
|
||
plain
|
||
size="mini"
|
||
type="primary"
|
||
icon="el-icon-edit-outline"
|
||
@click="editDeepSpace"
|
||
></el-button>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-input
|
||
v-model="simpleForm.sampleNum"
|
||
size="mini"
|
||
placeholder="请输入样本个数"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button type="primary" @click="samplesCk">确定</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
<el-table
|
||
ref="multipleTable"
|
||
v-loading="loading"
|
||
element-loading-text="拼命加载中"
|
||
element-loading-spinner="el-icon-loading"
|
||
element-loading-background="rgba(0, 0, 0, 0.8)"
|
||
:data="simpleData"
|
||
tooltip-effect="dark"
|
||
:header-cell-style="headerRowClass"
|
||
style="width: 98%; margin-left: 1%"
|
||
@selection-change="handleSelectionChange"
|
||
:stripe="true"
|
||
:cell-style="tableRowClassName"
|
||
height="460"
|
||
>
|
||
<el-table-column type="selection" width="55"> </el-table-column>
|
||
<el-table-column label="序号" type="index" width="70">
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="samplesId"
|
||
label="样本编号"
|
||
show-overflow-tooltip
|
||
min-width="100px;"
|
||
>
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="lat"
|
||
label="纬度"
|
||
sortable
|
||
show-overflow-tooltip
|
||
>
|
||
</el-table-column>
|
||
<el-table-column
|
||
prop="lng"
|
||
label="经度"
|
||
sortable
|
||
show-overflow-tooltip
|
||
>
|
||
</el-table-column>
|
||
<!-- <el-table-column :label="smLabel" show-overflow-tooltip>
|
||
<template slot-scope="scope">{{
|
||
scope.row.paramStr | getSampleVal
|
||
}}</template>
|
||
</el-table-column> -->
|
||
<el-table-column
|
||
prop="collectDate"
|
||
label="采样时间"
|
||
sortable
|
||
show-overflow-tooltip
|
||
min-width="120px;"
|
||
>
|
||
</el-table-column>
|
||
<el-table-column label="操作" align="center">
|
||
<template slot-scope="scope">
|
||
<el-button
|
||
type="primary"
|
||
size="small"
|
||
icon="el-icon-edit"
|
||
></el-button>
|
||
<el-button
|
||
type="danger"
|
||
size="small"
|
||
icon="el-icon-delete"
|
||
@click="deleteSelected(scope.$index, simpleData)"
|
||
></el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="smBodyRight">
|
||
<div class="box1">
|
||
<span class="sp1"></span
|
||
><span class="sp2">待检验产品及样本分布结果</span>
|
||
</div>
|
||
<div
|
||
:class="
|
||
checkRealityWait ? 'sceneShowContent onBorder' : 'sceneShowContent'
|
||
"
|
||
id="sceneShowContent"
|
||
>
|
||
<!-- <div v-show="checkRealityWait" class="topContent">
|
||
<span class="mapTitle">待检验{{ productSubType | productTypeMap }}图</span>
|
||
</div> -->
|
||
<div :id="checkRealityWait ? 'mapContent' : 'cesiumContent'">
|
||
<canvas v-show="checkRealityWait" id="grid"></canvas>
|
||
<div id="cesiumView" @click="pickValue">
|
||
<div v-show="checkRealityWait" class="compass">
|
||
<img
|
||
src="../../../assets/images/compass_one.svg"
|
||
alt=""
|
||
style="width: 100%; height: 100%"
|
||
/>
|
||
</div>
|
||
<canvas v-show="checkRealityWait" id="scaleBar"></canvas>
|
||
</div>
|
||
</div>
|
||
<div v-show="checkRealityWait" class="bottomCont">
|
||
<span>制图单位：中国科学院空天信息创新研究院</span><br />
|
||
<span>制图日期：{{ createImgTime }}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<SampleSetting
|
||
:stepSampling="stepSampling"
|
||
@handleStepSampling="handleStepSampling"
|
||
@handleDepthList="handleDepthList"
|
||
:sampleCldFun="sampleCldFun"
|
||
ref="sampleSettingPanel"
|
||
></SampleSetting>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getSamplesList,
|
||
getSampleData,
|
||
getSamplesByLayer,
|
||
} from "@/api/lang/pendingOrder";
|
||
|
||
import cu from "@/lib/cesiumUtils";
|
||
import SampleSetting from "@/components/ration/sampleSetting/index.vue";
|
||
import WKT from "terraformer-wkt-parser";
|
||
import Formator from "@/mixins/formator";
|
||
import { drawScaleTwo, drawGrid, getNowFormatDate } from "@/lib/utils";
|
||
export default {
|
||
components: {
|
||
SampleSetting,
|
||
},
|
||
mixins: [Formator],
|
||
props: {
|
||
sampleFun: {
|
||
require: true,
|
||
type: String,
|
||
},
|
||
sampleCldFun: {
|
||
require: false,
|
||
type: String,
|
||
},
|
||
pixelFun: {
|
||
require: true,
|
||
type: String,
|
||
},
|
||
geoWorkSpace: {
|
||
require: true,
|
||
type: String,
|
||
},
|
||
geoLayerName: {
|
||
require: true,
|
||
type: String,
|
||
},
|
||
geoLayerPos: {
|
||
require: true,
|
||
},
|
||
pixelNum: {
|
||
require: true,
|
||
},
|
||
orderId: {
|
||
require: true,
|
||
},
|
||
productSubType: {
|
||
require: true,
|
||
},
|
||
checkRealityWait: {
|
||
require: true,
|
||
},
|
||
},
|
||
filters: {
|
||
getSampleVal(paramStr) {
|
||
return JSON.parse(paramStr).featureValue.featureValue;
|
||
},
|
||
productTypeMap(pdtype) {
|
||
const pdtypeMap = {
|
||
45: "正射产品",
|
||
46: "高程产品",
|
||
51: "后向散射系数产品",
|
||
52: "大气延迟校正产品",
|
||
53: "干涉测量形变产品",
|
||
39: "地表覆盖类型产品",
|
||
38: "土壤水分产品",
|
||
49: "土壤盐碱度产品",
|
||
50: "地表粗糙度产品",
|
||
48: "植被高度产品",
|
||
43: "叶面积指数产品",
|
||
47: "植被物候产品",
|
||
};
|
||
if (pdtype == null) return null;
|
||
else return pdtypeMap[pdtype];
|
||
},
|
||
},
|
||
data() {
|
||
return {
|
||
simpleForm: {
|
||
sampleFun: "",
|
||
sampleNum: "",
|
||
},
|
||
simpleData: [],
|
||
loading: true,
|
||
allSampleData: [],
|
||
simpleDataTotal: 0,
|
||
smLabel: "土壤水分",
|
||
pixelFormData: {
|
||
pixelDealFun: "",
|
||
},
|
||
multipleSelection: [],
|
||
pdShow: false,
|
||
stepSampling: false,
|
||
funcOpt: [],
|
||
isDeepSpace: false,
|
||
depthList: [],
|
||
createImgTime: null,
|
||
};
|
||
},
|
||
mounted() {
|
||
cu.initCesium("cesiumView");
|
||
cu.handleClick();
|
||
cu.addlayer(this.geoWorkSpace, this.geoLayerName);
|
||
let gp = this.geoLayerPos;
|
||
cu.flyToLayerRect(gp[0], gp[1], gp[2], gp[3]);
|
||
},
|
||
created() {
|
||
this.funcOpt = this.configration.funcOpt;
|
||
this.getSplData();
|
||
this.initParam();
|
||
},
|
||
watch: {
|
||
checkRealityWait(val) {
|
||
const navigationDiv = document.getElementsByClassName(
|
||
"cesium-widget-cesiumNavigationContainer"
|
||
);
|
||
if (val) {
|
||
window.selfDefine.viewer.scene.postRender.addEventListener(
|
||
this.addScale
|
||
);
|
||
window.selfDefine.viewer.scene.postRender.addEventListener(
|
||
this.addGrid
|
||
);
|
||
this.createImgTime = getNowFormatDate();
|
||
if (navigationDiv) navigationDiv[0].style.display = "none";
|
||
} else {
|
||
this.removeListener();
|
||
this.createImgTime = null;
|
||
if (navigationDiv) navigationDiv[0].style.display = "block";
|
||
}
|
||
},
|
||
},
|
||
destroyed() {
|
||
this.removeListener();
|
||
},
|
||
methods: {
|
||
addScale() {
|
||
let barWidth = undefined;
|
||
let currentScaleUnit = undefined;
|
||
var geodesic = new Cesium.EllipsoidGeodesic();
|
||
var distances = [
|
||
1, 2, 3, 5, 10, 20, 30, 50, 100, 200, 300, 500, 1000, 2000, 3000, 5000,
|
||
10000, 20000, 30000, 50000, 100000, 200000, 300000, 500000, 1000000,
|
||
2000000, 3000000, 5000000, 10000000, 20000000, 30000000, 50000000,
|
||
];
|
||
// Find the distance between two pixels at the bottom center of the screen.
|
||
let scene = window.selfDefine.viewer.scene;
|
||
let width = scene.canvas.clientWidth;
|
||
let height = scene.canvas.clientHeight;
|
||
let left = scene.camera.getPickRay(
|
||
new Cesium.Cartesian2((width / 2) | 0, height - 1)
|
||
);
|
||
let right = scene.camera.getPickRay(
|
||
new Cesium.Cartesian2((1 + width / 2) | 0, height - 1)
|
||
);
|
||
let globe = scene.globe;
|
||
let leftPosition = globe.pick(left, scene);
|
||
let rightPosition = globe.pick(right, scene);
|
||
if (!Cesium.defined(leftPosition) || !Cesium.defined(rightPosition)) {
|
||
barWidth = undefined;
|
||
currentScaleUnit = undefined;
|
||
return;
|
||
}
|
||
let leftCartographic =
|
||
globe.ellipsoid.cartesianToCartographic(leftPosition);
|
||
let rightCartographic =
|
||
globe.ellipsoid.cartesianToCartographic(rightPosition);
|
||
geodesic.setEndPoints(leftCartographic, rightCartographic);
|
||
let pixelDistance = geodesic.surfaceDistance;
|
||
// Find the first distance that makes the scale bar less than 100 pixels.
|
||
let maxBarWidth = 100;
|
||
let distance;
|
||
for (
|
||
let i = distances.length - 1;
|
||
!Cesium.defined(distance) && i >= 0;
|
||
--i
|
||
) {
|
||
if (distances[i] / pixelDistance < maxBarWidth) {
|
||
distance = distances[i];
|
||
}
|
||
}
|
||
if (Cesium.defined(distance)) {
|
||
currentScaleUnit = distance >= 1000 ? "km" : "m";
|
||
barWidth =
|
||
distance >= 1000 ? (distance / 1000).toString() : distance.toString();
|
||
} else {
|
||
barWidth = undefined;
|
||
currentScaleUnit = undefined;
|
||
}
|
||
drawScaleTwo(barWidth, currentScaleUnit);
|
||
},
|
||
addGrid() {
|
||
const cesiumExtent =
|
||
window.selfDefine.viewer.camera.computeViewRectangle();
|
||
const params = {};
|
||
params.xmax = Cesium.Math.toDegrees(cesiumExtent.east);
|
||
params.ymax = Cesium.Math.toDegrees(cesiumExtent.north);
|
||
params.xmin = Cesium.Math.toDegrees(cesiumExtent.west);
|
||
params.ymin = Cesium.Math.toDegrees(cesiumExtent.south);
|
||
drawGrid(6, 6, "cesiumView", [
|
||
params.xmax,
|
||
params.ymax,
|
||
params.xmin,
|
||
params.ymin,
|
||
]);
|
||
},
|
||
getcurrentdomwidth(dom) {
|
||
const domObj = document.getElementById(dom);
|
||
const clientWidth = domObj.clientWidth;
|
||
const clientHeight = domObj.clientHeight;
|
||
const offsetWidth = domObj.offsetWidth;
|
||
const offsetHeight = domObj.offsetHeight;
|
||
const clientLeft = parseFloat(
|
||
getComputedStyle(domObj).getPropertyValue("padding-left")
|
||
);
|
||
const clientTop = parseFloat(
|
||
getComputedStyle(domObj).getPropertyValue("padding-top")
|
||
);
|
||
return {
|
||
w: clientWidth,
|
||
h: clientHeight,
|
||
concentW: offsetWidth,
|
||
concentH: offsetHeight,
|
||
paddingL: clientLeft,
|
||
paddingT: clientTop,
|
||
};
|
||
},
|
||
DegreesCoverttoDuFenMiao(degrees) {
|
||
let du = degrees.split(".")[0];
|
||
let fen = ("0." + degrees.split(".")[1]) * 60 + "";
|
||
let miao = (("0." + fen.split(".")[1]) * 60).toFixed(0);
|
||
return du + "°" + fen.split(".")[0] + "′" + miao + "″";
|
||
},
|
||
removeListener() {
|
||
window.selfDefine.viewer.scene.postRender.removeEventListener(
|
||
this.addScale
|
||
);
|
||
window.selfDefine.viewer.scene.postRender.removeEventListener(
|
||
this.addGrid
|
||
);
|
||
},
|
||
handleStepSampling(newVal) {
|
||
this.stepSampling = newVal;
|
||
},
|
||
handleDepthList(newVal) {
|
||
this.depthList = newVal;
|
||
},
|
||
editDeepSpace() {
|
||
this.stepSampling = true;
|
||
},
|
||
initParam() {
|
||
if (this.sampleCldFun) {
|
||
this.simpleForm.sampleFun = new Array(
|
||
this.sampleFun,
|
||
this.sampleCldFun
|
||
);
|
||
} else {
|
||
this.simpleForm.sampleFun = new Array(this.sampleFun);
|
||
}
|
||
const ssf = Number(this.simpleForm.sampleFun[0]);
|
||
if (
|
||
this.simpleForm.sampleFun.length >= 1 &&
|
||
ssf === 2 &&
|
||
Number(this.simpleForm.sampleFun[1]) === 0
|
||
) {
|
||
this.isDeepSpace = true;
|
||
} else {
|
||
this.isDeepSpace = false;
|
||
}
|
||
},
|
||
pickValue() {
|
||
cu.handleClick();
|
||
},
|
||
changeSampleFun(sfVal) {
|
||
//保存样本抽样方法
|
||
if (Array.isArray(sfVal)) {
|
||
const ssf = Number(sfVal[0]);
|
||
this.$store.commit("setSampleFun", sfVal.length === 0 ? null : ssf);
|
||
if (sfVal.length >= 1 && ssf === 2 && Number(sfVal[1]) === 0) {
|
||
this.isDeepSpace = true;
|
||
} else {
|
||
this.isDeepSpace = false;
|
||
}
|
||
}
|
||
},
|
||
samplesCk() {
|
||
const self = this;
|
||
if (self.simpleForm.sampleFun[0] === "") {
|
||
self.$message.error("请选择抽样方法");
|
||
return false;
|
||
}
|
||
const ssf = self.simpleForm.sampleFun,
|
||
st = self.simpleDataTotal,
|
||
ssn = self.simpleForm.sampleNum;
|
||
if (ssn == "") {
|
||
this.$message.error("请选择抽样个数");
|
||
this.getSplData();
|
||
return false;
|
||
}
|
||
if (ssn > st) {
|
||
this.$message.error("抽样数不可大于总样本数量");
|
||
return false;
|
||
}
|
||
if (ssn < 0) {
|
||
this.$message.error("样本个数不可为负数");
|
||
return false;
|
||
}
|
||
if (Number(ssf[0]) === 2) {
|
||
const stepSampParams = self.$refs.sampleSettingPanel;
|
||
const hierarchyVal = ssf[1];
|
||
if (hierarchyVal === "" || hierarchyVal === undefined) {
|
||
self.stepSampling = true;
|
||
return false;
|
||
}
|
||
const ssForm = new FormData();
|
||
ssForm.append("samplesList", JSON.stringify(self.allSampleData));
|
||
ssForm.append("stepType", Number(hierarchyVal));
|
||
ssForm.append("orderID", self.orderId);
|
||
if (hierarchyVal === "0") {
|
||
const depthList = this.depthList;
|
||
ssForm.append("condition", JSON.stringify(depthList));
|
||
} else if (hierarchyVal === "2") {
|
||
const jsonContent = JSON.parse(stepSampParams.jsonContent);
|
||
const jg = jsonContent.geometries;
|
||
const newPolygon = [];
|
||
for (let i in jg) {
|
||
const jsonContentWKT = WKT.convert(jg[i]);
|
||
newPolygon.push({ coordinates: jsonContentWKT });
|
||
}
|
||
ssForm.append("condition", JSON.stringify(newPolygon));
|
||
}
|
||
ssForm.append("splCount", ssn);
|
||
getSamplesByLayer(ssForm).then((res) => {
|
||
if (res.length === 0 || res == []) {
|
||
self.multipleSelection = self.simpleData = [];
|
||
cu.removePoint();
|
||
self.$message.error("当前分层设置返回列表为空");
|
||
return false;
|
||
} else {
|
||
const dl = [];
|
||
for (let i in res) {
|
||
const ri = res[i];
|
||
for (let j in ri) {
|
||
ri[j]["hierarchicalIdentification"] = i;
|
||
dl.push(ri[j]);
|
||
}
|
||
}
|
||
self.multipleSelection = self.simpleData = dl;
|
||
self.$refs.multipleTable.toggleAllSelection();
|
||
cu.removePoint();
|
||
for (let i in dl) {
|
||
cu.addPoint(dl[i].lng, dl[i].lat, 10);
|
||
}
|
||
}
|
||
});
|
||
} else {
|
||
const spFrom = new FormData();
|
||
spFrom.append("sampleFun", Number(ssf[0])); //抽样方法
|
||
spFrom.append("minNum", 0);
|
||
spFrom.append("MaxNum", st - 1); //样本总数
|
||
spFrom.append("splCount", ssn); //抽样个数
|
||
getSampleData(spFrom).then((res) => {
|
||
const dl = [];
|
||
for (const i in res) {
|
||
let sri = self.allSampleData[res[i]];
|
||
sri["hierarchicalIdentification"] = "0";
|
||
dl.push(sri);
|
||
}
|
||
self.multipleSelection = self.simpleData = dl;
|
||
self.$refs.multipleTable.toggleAllSelection();
|
||
cu.removePoint();
|
||
for (let i in dl) {
|
||
cu.addPoint(dl[i].lng, dl[i].lat, 10);
|
||
}
|
||
});
|
||
}
|
||
},
|
||
tableRowClassName({ rowIndex }) {
|
||
if ((rowIndex + 1) % 2 !== 0) {
|
||
return "background:#F5F7FA;text-align:center";
|
||
} else {
|
||
return "background:#FFFFFF;text-align:center";
|
||
}
|
||
},
|
||
headerRowClass() {
|
||
return "background: #E4E9F1;text-align:center";
|
||
},
|
||
handleSelectionChange(val) {
|
||
cu.removePoint();
|
||
if (val.length !== 0) {
|
||
for (let i in val) {
|
||
cu.addPoint(val[i].lng, val[i].lat, 10);
|
||
}
|
||
}
|
||
this.multipleSelection = val;
|
||
},
|
||
getSplData() {
|
||
getSamplesList(this.orderId).then((res) => {
|
||
if (res.code == 200) {
|
||
let rd = res.data.list;
|
||
if (rd.length > 0) {
|
||
for (const i in rd) {
|
||
// 添加默认样本分层标识
|
||
rd[i]["hierarchicalIdentification"] = "0";
|
||
}
|
||
this.multipleSelection = this.allSampleData = this.simpleData = rd;
|
||
this.loading = false;
|
||
this.$refs.multipleTable.toggleAllSelection();
|
||
let min = Number.MAX_SAFE_INTEGER;
|
||
let max = Number.MIN_SAFE_INTEGER;
|
||
this.$store.commit("setAltRange", null);
|
||
this.allSampleData.forEach((k, v) => {
|
||
k.dataTime = this.formatDatetime(k.dataTime);
|
||
const xqsmParam = JSON.parse(k.paramStr);
|
||
if (xqsmParam.alt) {
|
||
min = min > xqsmParam.alt ? xqsmParam.alt : min;
|
||
max = max < xqsmParam.alt ? xqsmParam.alt : max;
|
||
} else {
|
||
(min = 0), (max = 0);
|
||
}
|
||
});
|
||
if (this.allSampleData.length > 0) {
|
||
this.$store.commit("setAltRange", min + "," + (max + 1));
|
||
}
|
||
this.simpleDataTotal = this.simpleForm.total = rd.length;
|
||
this.smLabel = this.simpleData[0].productSubTypeName;
|
||
}
|
||
}
|
||
});
|
||
},
|
||
deleteSelected(index, simpleData) {
|
||
this.$confirm(`确定删除该样本？`, "提示", {
|
||
confirmButtonText: "确定",
|
||
cancelButtonText: "取消",
|
||
type: "warning",
|
||
}).then(async () => {
|
||
simpleData.splice(index, 1);
|
||
});
|
||
},
|
||
},
|
||
computed: {
|
||
globalSampleFun: function () {
|
||
return this.$store.state.sampleFun;
|
||
},
|
||
globalPixelFun: function () {
|
||
return this.$store.state.pixelFun;
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
.soilMositure {
|
||
margin-top: 10px;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.smBodyLeft {
|
||
width: 56%;
|
||
height: 570px;
|
||
float: left;
|
||
margin-right: 4px;
|
||
}
|
||
|
||
.smBodyRight {
|
||
width: calc(44% - 4px);
|
||
height: 570px;
|
||
background-color: white;
|
||
float: left;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.smps {
|
||
height: 570px;
|
||
background-color: white;
|
||
margin-bottom: 5px;
|
||
}
|
||
|
||
/deep/.smps .el-form-item {
|
||
margin-left: 15px;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
/deep/.smps .el-table th > .cell {
|
||
font-size: 15px;
|
||
}
|
||
|
||
/deep/.smps .el-table .cell {
|
||
font-size: 13px;
|
||
}
|
||
|
||
.block .pagination-container {
|
||
padding: 0px;
|
||
margin-top: 6px;
|
||
text-align: center;
|
||
}
|
||
|
||
.pixelDeal {
|
||
height: 165px;
|
||
background-color: white;
|
||
}
|
||
|
||
/deep/.pixelDeal .el-form-item {
|
||
margin-left: 15px;
|
||
}
|
||
|
||
.cardsp {
|
||
display: block;
|
||
margin-left: 17px;
|
||
font-size: 15px;
|
||
color: #606266;
|
||
line-height: 40px;
|
||
}
|
||
|
||
.sceneShowContent {
|
||
height: calc(100% - 55px);
|
||
padding: 5px;
|
||
|
||
.topContent {
|
||
height: 30px;
|
||
width: 100%;
|
||
text-align: center;
|
||
line-height: 30px;
|
||
|
||
.mapTitle {
|
||
font-size: 22px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
#mapContent {
|
||
height: calc(100% - 100px);
|
||
position: relative;
|
||
padding-left: 70px;
|
||
padding-top: 30px;
|
||
|
||
#grid {
|
||
position: absolute;
|
||
left: 0;
|
||
right: 0;
|
||
top: 0;
|
||
left: 0;
|
||
}
|
||
|
||
.compass {
|
||
width: 50px;
|
||
height: 50px;
|
||
position: absolute;
|
||
top: 10px;
|
||
right: 20px;
|
||
z-index: 2;
|
||
}
|
||
|
||
#scaleBar {
|
||
width: 300px;
|
||
height: 40px;
|
||
position: absolute;
|
||
bottom: 10px;
|
||
left: 30px;
|
||
z-index: 2;
|
||
}
|
||
}
|
||
|
||
#cesiumContent {
|
||
height: 100%;
|
||
position: relative;
|
||
padding-top: 5px;
|
||
padding-left: 5px;
|
||
}
|
||
|
||
#cesiumView {
|
||
width: calc(100% - 10px);
|
||
height: calc(100% - 10px);
|
||
overflow: hidden;
|
||
position: relative;
|
||
border: 2px solid black;
|
||
}
|
||
|
||
.bottomCont {
|
||
height: 60px;
|
||
text-align: left;
|
||
width: fit-content;
|
||
transform: translateX(-100%);
|
||
margin-left: 100%;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.onBorder {
|
||
border: 1px solid;
|
||
}
|
||
|
||
.box1 {
|
||
height: 40px;
|
||
line-height: 40px;
|
||
border-bottom: 1px solid rgb(205, 205, 205, 0.5);
|
||
}
|
||
|
||
.sp1 {
|
||
display: inline-block;
|
||
width: 7px;
|
||
height: 26px;
|
||
background-color: #354595;
|
||
vertical-align: top;
|
||
margin-left: 20px;
|
||
margin-top: 8px;
|
||
}
|
||
|
||
.sp2 {
|
||
margin-left: 10px;
|
||
font-size: 20px;
|
||
font-weight: 700;
|
||
color: #354595;
|
||
vertical-align: top;
|
||
}
|
||
|
||
.sp3 {
|
||
position: relative;
|
||
top: -13px;
|
||
margin-left: 10px;
|
||
}
|
||
|
||
// 分层抽样弹出框设置
|
||
/deep/.sampleFunParam .el-upload-dragger .el-icon-upload {
|
||
margin: 0;
|
||
line-height: 30px;
|
||
font-size: 20px;
|
||
color: black;
|
||
}
|
||
|
||
.sampleFunParam .upload-demo {
|
||
display: inline-block;
|
||
}
|
||
|
||
/deep/.sampleFunParam .el-upload-dragger {
|
||
width: 150px;
|
||
height: 35px;
|
||
margin-left: 15px;
|
||
margin-top: 20px;
|
||
border: 1px solid #d9d9d9;
|
||
}
|
||
|
||
/deep/.sampleFunParam .el-dialog__body {
|
||
padding: 20px 10px;
|
||
text-align: center;
|
||
}
|
||
|
||
.edit-btn {
|
||
margin-left: 15px;
|
||
}
|
||
</style>
|