| | |
| | | <div class="content"> |
| | | <div class="title"> |
| | | <label>详细编辑</label> |
| | | <el-icon |
| | | @click="setSpatialClose" |
| | | :size="20" |
| | | style="cursor: pointer" |
| | | > |
| | | <el-icon @click="setSpatialClose" :size="20" style="cursor: pointer"> |
| | | <Close /> |
| | | </el-icon> |
| | | </div> |
| | |
| | | layerName |
| | | }}</el-checkbox> --> |
| | | {{ layerData.cnName }} |
| | | <img |
| | | src="../../assets/img/layer.png" |
| | | alt="" |
| | | /> |
| | | <img src="../../assets/img/layer.png" alt="" /> |
| | | </div> |
| | | <div class="slider-demo-block"> |
| | | <div class="slider-demo-block" v-show="diaphaneityShow"> |
| | | <div class="demonstration">透明度</div> |
| | | <el-slider |
| | | v-model="transparence" |
| | |
| | | /> |
| | | <div class="demonstration">{{ transparence }}%</div> |
| | | </div> |
| | | <div class="slider-demo-block"> |
| | | <div class="slider-demo-block" v-show="contrastShow"> |
| | | <div class="demonstration">对比度</div> |
| | | <el-slider |
| | | v-model="contrast" |
| | | @change="contrastChange" |
| | | :format-tooltip="contrastFormatTooltip" |
| | | :max="3" |
| | | :step="0.1" |
| | | /> |
| | | <div class="demonstration">{{ contrast }}%</div> |
| | | <div class="demonstration">{{ contrast }}</div> |
| | | </div> |
| | | <div class="selectBox"> |
| | | <div class="selectBox" v-show="drawingModeShow"> |
| | | <div class="selectTile demonstration">拉伸方式</div> |
| | | <el-select |
| | | v-model="stretchValue" |
| | |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="selectBox"> |
| | | <div class="selectBox" v-show="colorShow"> |
| | | <div class="selectTile demonstration">渲染类型</div> |
| | | <el-select |
| | | v-model="renderType" |
| | |
| | | <!-- <img :src="item.url" style="height: 30px; margin-right: 10px" /> |
| | | <span>{{ item.label }}</span> --> |
| | | |
| | | <img |
| | | :src="item.url" |
| | | style="height: 30px; width: 100%" |
| | | /> |
| | | <img :src="item.url" style="height: 30px; width: 100%" /> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | |
| | | import server from "@/assets/js/Map/server"; |
| | | const stretchValue = ref(""); |
| | | const transparence = ref(0); |
| | | const contrast = ref(0); |
| | | const contrast = ref(1); |
| | | let layerName = ref("图层名称"); |
| | | let layerState = ref(false); |
| | | let select = ref(); |
| | |
| | | server.layerList[layerLength.value].layerData.alpha = val / 100; |
| | | }; |
| | | const contrastChange = (val) => { |
| | | server.layerList[layerLength.value].layerData.alpha = val / 100; |
| | | server.layerList[layerLength.value].layerData.contrast = val; |
| | | }; |
| | | let diaphaneityShow = ref(false); |
| | | let contrastShow = ref(false); |
| | | let drawingModeShow = ref(false); |
| | | let colorShow = ref(false); |
| | | //判断类型显示 |
| | | const typeDisplay = (val) => { |
| | | if ( |
| | | val.data == 1 || |
| | | val.data == 3 || |
| | | val.data == 4 || |
| | | val.data == 5 || |
| | | val.data == 6 || |
| | | val.data == 7 || |
| | | val.data == 8 |
| | | ) { |
| | | diaphaneityShow.value = true; |
| | | } |
| | | if ( |
| | | val.data == 1 || |
| | | val.data == 3 || |
| | | val.data == 4 || |
| | | val.data == 5 || |
| | | val.data == 6 |
| | | ) { |
| | | contrastShow.value = true; |
| | | drawingModeShow.value = true; |
| | | } |
| | | if (val.data == 3 || val.data == 4) { |
| | | colorShow.value = true; |
| | | } |
| | | }; |
| | | onMounted(() => { |
| | | typeDisplay(props.layerData); |
| | | server.layerList.forEach((e, i) => { |
| | | if (props.layerData.id == e.id) { |
| | | if (props.layerData.id == e.id && e.layerData) { |
| | | layerLength.value = i; |
| | | transparence.value = e.layerData.alpha * 100; |
| | | } |