精细分类根据级别显示村级矢量，点击某镇级高亮其他遮罩
This commit is contained in:
parent
baf444b013
commit
8d96ed92fb
@ -8,10 +8,8 @@
|
||||
<span>作物分类面积统计</span>
|
||||
<p @click="Deta()">
|
||||
下载
|
||||
<img
|
||||
src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer"
|
||||
/>
|
||||
<img src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer" />
|
||||
</p>
|
||||
</div>
|
||||
<div ref="areaDiv" class="areaDiv"></div>
|
||||
@ -21,10 +19,8 @@
|
||||
<span>作物类型统计</span>
|
||||
<p @click="Deta2()">
|
||||
下载
|
||||
<img
|
||||
src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer"
|
||||
/>
|
||||
<img src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer" />
|
||||
</p>
|
||||
</div>
|
||||
<div ref="typesofDiv" class="typesofDiv"></div>
|
||||
@ -46,36 +42,15 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="leftFoldDiv" @click="leftFoldClick()">
|
||||
<el-tooltip
|
||||
:disabled="leftWraFlag"
|
||||
:show-arrow="false"
|
||||
hide-after="0"
|
||||
show-after="200"
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
content="展开"
|
||||
placement="top"
|
||||
>
|
||||
<el-tooltip :disabled="leftWraFlag" :show-arrow="false" hide-after="0" show-after="200" class="box-item"
|
||||
effect="dark" content="展开" placement="top">
|
||||
<!-- <el-icon v-if="!leftWraFlag"><ArrowRightBold /></el-icon> -->
|
||||
<img v-if="!leftWraFlag" src="@/assets/images/close1.png" alt="" />
|
||||
</el-tooltip>
|
||||
<el-tooltip
|
||||
:disabled="!leftWraFlag"
|
||||
:show-arrow="false"
|
||||
hide-after="0"
|
||||
show-after="200"
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
content="收起"
|
||||
placement="top"
|
||||
>
|
||||
<el-tooltip :disabled="!leftWraFlag" :show-arrow="false" hide-after="0" show-after="200"
|
||||
class="box-item" effect="dark" content="收起" placement="top">
|
||||
<!-- <el-icon v-if="leftWraFlag"><ArrowLeftBold /></el-icon> -->
|
||||
<img
|
||||
class="imgrotate"
|
||||
v-if="leftWraFlag"
|
||||
src="@/assets/images/close1.png"
|
||||
alt=""
|
||||
/>
|
||||
<img class="imgrotate" v-if="leftWraFlag" src="@/assets/images/close1.png" alt="" />
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
@ -85,10 +60,8 @@
|
||||
<span>作物类型统计-高标准农田</span>
|
||||
<p @click="Deta3()">
|
||||
下载
|
||||
<img
|
||||
src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer"
|
||||
/>
|
||||
<img src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer" />
|
||||
</p>
|
||||
</div>
|
||||
<div ref="farmlandDiv" class="farmlandDiv"></div>
|
||||
@ -99,57 +72,25 @@
|
||||
<span>作物类型统计-行政区划</span>
|
||||
<p @click="Deta4()">
|
||||
下载
|
||||
<img
|
||||
src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer"
|
||||
/>
|
||||
<img src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer" />
|
||||
</p>
|
||||
</div>
|
||||
<el-select
|
||||
popper-class="select_city"
|
||||
@change="selectTab(item)"
|
||||
v-model="value"
|
||||
clearable
|
||||
placeholder="全部"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in Township.arr"
|
||||
:key="item.tomeCode"
|
||||
:label="item.tomeName"
|
||||
:value="item.tomeCode"
|
||||
/>
|
||||
<el-select popper-class="select_city" @change="selectTab(item)" v-model="value" clearable
|
||||
placeholder="全部">
|
||||
<el-option v-for="item in Township.arr" :key="item.tomeCode" :label="item.tomeName"
|
||||
:value="item.tomeCode" />
|
||||
</el-select>
|
||||
<div ref="ASdivisionDiv" class="ASdivision"></div>
|
||||
</div>
|
||||
<div class="rightFoldDiv" @click="rightFoldClick()">
|
||||
<el-tooltip
|
||||
:disabled="!rightWraFlag"
|
||||
hide-after="0"
|
||||
:show-arrow="false"
|
||||
show-after="200"
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
content="收起"
|
||||
placement="top"
|
||||
>
|
||||
<el-tooltip :disabled="!rightWraFlag" hide-after="0" :show-arrow="false" show-after="200"
|
||||
class="box-item" effect="dark" content="收起" placement="top">
|
||||
<img v-if="rightWraFlag" src="@/assets/images/close1.png" alt="" />
|
||||
</el-tooltip>
|
||||
<el-tooltip
|
||||
:disabled="rightWraFlag"
|
||||
hide-after="0"
|
||||
:show-arrow="false"
|
||||
show-after="200"
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
content="展开"
|
||||
placement="top"
|
||||
>
|
||||
<img
|
||||
class="imgrotate"
|
||||
v-if="!rightWraFlag"
|
||||
src="@/assets/images/close1.png"
|
||||
alt=""
|
||||
/>
|
||||
<el-tooltip :disabled="rightWraFlag" hide-after="0" :show-arrow="false" show-after="200"
|
||||
class="box-item" effect="dark" content="展开" placement="top">
|
||||
<img class="imgrotate" v-if="!rightWraFlag" src="@/assets/images/close1.png" alt="" />
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
@ -158,18 +99,11 @@
|
||||
<template #title>图例</template>
|
||||
<div class="mt-4">
|
||||
<el-checkbox-group v-model="checkList" @change="change">
|
||||
<el-checkbox
|
||||
v-for="(value, item, key) in dic"
|
||||
:key="key"
|
||||
:style="{
|
||||
background: value.color,
|
||||
border: `1px solid ${value.color}`,
|
||||
width: `100%`,
|
||||
}"
|
||||
:v-model="value.disabled"
|
||||
:disabled="value.disabled"
|
||||
:label="item"
|
||||
/>
|
||||
<el-checkbox v-for="(value, item, key) in dic" :key="key" :style="{
|
||||
background: value.color,
|
||||
border: `1px solid ${value.color}`,
|
||||
width: `100%`,
|
||||
}" :v-model="value.disabled" :disabled="value.disabled" :label="item" />
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
@ -217,42 +151,21 @@
|
||||
<div class="searchDiv">
|
||||
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
||||
<el-form-item label="时间:">
|
||||
<el-select
|
||||
popper-class="selectCity"
|
||||
v-model="formInline.yearMonth"
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in timeArr"
|
||||
:key="index"
|
||||
:label="Zitem"
|
||||
:value="item"
|
||||
/>
|
||||
<el-select popper-class="selectCity" v-model="formInline.yearMonth" placeholder="请选择">
|
||||
<el-option v-for="(item, index) in timeArr" :key="index" :label="Zitem" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="统计方式:">
|
||||
<el-select
|
||||
popper-class="selectCity"
|
||||
v-model="formInline.flag"
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-select popper-class="selectCity" v-model="formInline.flag" placeholder="请选择">
|
||||
<el-option label="行政区划" value="2" />
|
||||
<el-option label="高标准农田" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="镇:">
|
||||
<el-select
|
||||
v-model="formInline.divisions"
|
||||
:disabled="formInline.flag == '2' ? false : true"
|
||||
:placeholder="formInline.flag == '2' ? '全部' : '请选择'"
|
||||
popper-class="selectCity"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in selectOption"
|
||||
:key="index"
|
||||
:label="item.tomeName"
|
||||
:value="item.tomeCode"
|
||||
/>
|
||||
<el-select v-model="formInline.divisions" :disabled="formInline.flag == '2' ? false : true"
|
||||
:placeholder="formInline.flag == '2' ? '全部' : '请选择'" popper-class="selectCity">
|
||||
<el-option v-for="(item, index) in selectOption" :key="index" :label="item.tomeName"
|
||||
:value="item.tomeCode" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
@ -273,61 +186,28 @@
|
||||
</div>
|
||||
<div v-show="SwitchFlag" class="tableBox">
|
||||
<div class="tableBorder">
|
||||
<el-table
|
||||
:data="amount"
|
||||
:header-cell-style="{ 'text-align': 'center' }"
|
||||
style="width: 100%"
|
||||
highlight-current-row
|
||||
header-row-class-name="tabth"
|
||||
v-if="!operate"
|
||||
>
|
||||
<el-table :data="amount" :header-cell-style="{ 'text-align': 'center' }" style="width: 100%"
|
||||
highlight-current-row header-row-class-name="tabth" v-if="!operate">
|
||||
<el-table-column align="center" prop="合计" width="80" />
|
||||
<el-table-column
|
||||
v-for="(item, index) in tableItem"
|
||||
:key="index"
|
||||
:prop="item.value"
|
||||
:label="index == 0 ? item.lable : item.lable + '(亩)'"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column v-for="(item, index) in tableItem" :key="index" :prop="item.value"
|
||||
:label="index == 0 ? item.lable : item.lable + '(亩)'" align="center" />
|
||||
<el-table-column prop="address" v-if="operate" align="center" label="操作">
|
||||
<template #default="scope">
|
||||
<span
|
||||
style="color: rgba(67, 181, 143, 1); cursor: pointer"
|
||||
@click="download(scope.row)"
|
||||
>
|
||||
<span style="color: rgba(67, 181, 143, 1); cursor: pointer" @click="download(scope.row)">
|
||||
下载
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-table
|
||||
:data="tableNewData"
|
||||
:header-cell-style="{ 'text-align': 'center' }"
|
||||
height="90%"
|
||||
highlight-current-row
|
||||
header-row-class-name="tabth"
|
||||
>
|
||||
<el-table-column
|
||||
type="index"
|
||||
width="80"
|
||||
align="center"
|
||||
label="序号"
|
||||
:index="Nindex"
|
||||
/>
|
||||
<el-table-column
|
||||
v-for="(item, index) in tableItem"
|
||||
:key="index"
|
||||
:prop="item.value"
|
||||
:label="index == 0 ? item.lable : item.lable + '(亩)'"
|
||||
align="center"
|
||||
/>
|
||||
<el-table :data="tableNewData" :header-cell-style="{ 'text-align': 'center' }" height="90%"
|
||||
highlight-current-row header-row-class-name="tabth">
|
||||
<el-table-column type="index" width="80" align="center" label="序号" :index="Nindex" />
|
||||
<el-table-column v-for="(item, index) in tableItem" :key="index" :prop="item.value"
|
||||
:label="index == 0 ? item.lable : item.lable + '(亩)'" align="center" />
|
||||
<el-table-column prop="address" v-if="operate" align="center" label="操作">
|
||||
<template #default="scope">
|
||||
<span
|
||||
style="color: rgba(67, 181, 143, 1); cursor: pointer"
|
||||
@click="download(scope.row)"
|
||||
>
|
||||
<span style="color: rgba(67, 181, 143, 1); cursor: pointer" @click="download(scope.row)">
|
||||
下载
|
||||
</span>
|
||||
</template>
|
||||
@ -335,14 +215,8 @@
|
||||
</el-table>
|
||||
<div class="example-pagination-block">
|
||||
共{{ insectarr.length }}条
|
||||
<el-pagination
|
||||
background
|
||||
layout="prev, pager, next"
|
||||
:total="insectarr.length"
|
||||
:current-page="currentPage"
|
||||
:page-size="pageSize"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
<el-pagination background layout="prev, pager, next" :total="insectarr.length"
|
||||
:current-page="currentPage" :page-size="pageSize" @current-change="handleCurrentChange" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="!SwitchFlag" class="chartMode">
|
||||
@ -372,6 +246,7 @@ import {
|
||||
import axios from 'axios';
|
||||
import * as xlsx from 'xlsx'; // Vue3 版本
|
||||
import { ElMessage } from 'element-plus';
|
||||
import townJson from './town.json'
|
||||
|
||||
let viewer = ref(null);
|
||||
const areaDiv = ref(null);
|
||||
@ -659,7 +534,6 @@ const onSubmit = () => {
|
||||
(currentPage.value - 1) * pageSize.value,
|
||||
(currentPage.value - 1) * pageSize.value + pageSize.value
|
||||
);
|
||||
console.log(tableNewData);
|
||||
const statInfo = chartModeDiv.value; // 获取图表元素
|
||||
statInfo.style.width = window.innerWidth - 100 + 'px'; //初始化echarts图表宽度
|
||||
statInfo.style.height = window.innerHeight - 100 + 'px';
|
||||
@ -797,7 +671,6 @@ const Deta4 = item => {
|
||||
}
|
||||
});
|
||||
});
|
||||
console.log(brr);
|
||||
exportExcel(brr, `${region}作物长势等级统计-行政区划`, 'Sheet1');
|
||||
});
|
||||
}
|
||||
@ -1164,21 +1037,26 @@ function initMap() {
|
||||
|
||||
// 图层点击事件
|
||||
layerClick();
|
||||
// 监听相机移动，实现根据缩放级别村级矢量的显隐
|
||||
cameraMove()
|
||||
// 图层遮罩
|
||||
maskLayer()
|
||||
// // 添加镇级矢量
|
||||
// addWms('shuzisannong:huangdaoqu_town', 'shuzisannong:huangdaoqu_town');
|
||||
let cityDS = Cesium.GeoJsonDataSource.load(
|
||||
`${serverAPI.geoserverUrl}/shuzisannong/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=shuzisannong%3Ahuangdaoqu_town&maxFeatures=50&outputFormat=application%2Fjson`,
|
||||
{
|
||||
fill: Cesium.Color.YELLOW.withAlpha(0.01),
|
||||
strokeWidth: 3,
|
||||
markerSymbol: '?',
|
||||
clampToGround: true,
|
||||
outline: true,
|
||||
outlineColor: Cesium.Color.BLACK,
|
||||
}
|
||||
);
|
||||
|
||||
viewer.dataSources.add(cityDS);
|
||||
// let cityDS = Cesium.GeoJsonDataSource.load(
|
||||
// `${serverAPI.geoserverUrl}/shuzisannong/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=shuzisannong%3Ahuangdaoqu_town&maxFeatures=50&outputFormat=application%2Fjson`,
|
||||
// {
|
||||
// fill: Cesium.Color.YELLOW.withAlpha(0.01),
|
||||
// strokeWidth: 3,
|
||||
// markerSymbol: '?',
|
||||
// clampToGround: true,
|
||||
// outline: true,
|
||||
// outlineColor: Cesium.Color.BLACK,
|
||||
// }
|
||||
// );
|
||||
|
||||
// viewer.dataSources.add(cityDS);
|
||||
zoomInCenter(viewer);
|
||||
}
|
||||
|
||||
@ -1227,7 +1105,6 @@ function getLevel(height) {
|
||||
}
|
||||
|
||||
function change(e, a) {
|
||||
// console.log('e:', e, a);
|
||||
// removeWms('crop');
|
||||
// addwms();
|
||||
}
|
||||
@ -1239,8 +1116,8 @@ function zoomInCenter(viewer) {
|
||||
|
||||
if (!isNaN(Amount)) {
|
||||
viewer.scene.camera.zoomIn(Amount);
|
||||
var ray = viewer.camera.getPickRay(movement.position);
|
||||
var cartesian = viewer.scene.globe.pick(ray, viewer.scene);
|
||||
// var ray = viewer.camera.getPickRay(movement.position);
|
||||
// var cartesian = viewer.scene.globe.pick(ray, viewer.scene);
|
||||
}
|
||||
}, Cesium.ScreenSpaceEventType.WHEEL);
|
||||
}
|
||||
@ -1296,7 +1173,6 @@ function addWms(layers, customName, bottom) {
|
||||
map.customName = customName; //自己定义各种属性
|
||||
let dd = viewer.imageryLayers.addImageryProvider(map); //添加图层
|
||||
// if (customName.indexOf('gbznt') > -1) {
|
||||
// console.log('dididididi');
|
||||
// // viewer.imageryLayers.lower(dd);//将图层下移一层
|
||||
// viewer.imageryLayers.lowerToBottom(dd); //将图层移到最底层
|
||||
// viewer.imageryLayers.raise(dd); //将图层上移一层
|
||||
@ -1306,10 +1182,114 @@ function addWms(layers, customName, bottom) {
|
||||
viewer.imageryLayers.raise(dd); //将图层上移一层
|
||||
}
|
||||
}
|
||||
// 根据根据级别显示村级矢量
|
||||
function cameraMove() {
|
||||
if (viewer) {
|
||||
viewer.scene.camera.moveEnd.addEventListener(function () {
|
||||
// 获取级别
|
||||
let alti = viewer.camera.positionCartographic.height;
|
||||
|
||||
if (alti && alti < 20000) {
|
||||
// 根据中心点经纬度添加，前提是添加过镇的实体
|
||||
// let centerResult = viewer.camera.pickEllipsoid(new Cesium.Cartesian2(viewer.canvas.clientWidth / 2, viewer.canvas.clientHeight / 2))
|
||||
// if (Cesium.defined(centerResult)) {
|
||||
// let curPosition = Cesium.Ellipsoid.WGS84.cartesianToCartographic(centerResult)
|
||||
// let pick = viewer.scene.pick(curPosition)
|
||||
// if (pick) {
|
||||
// let info = pick.id.properties.XZDM || null
|
||||
// removeWms(['village'], false)
|
||||
// if (info) {
|
||||
// addvillage(
|
||||
// `XZDM=${info._value}`,
|
||||
// 'village'
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// 添加全部
|
||||
addWms('shuzisannong:huangdaoqu_village', 'village')
|
||||
} else {
|
||||
removeWms(['village'], false)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
let previousPickedEntity = 1;
|
||||
// 图层遮罩鼠标移动高亮
|
||||
function maskLayer() {
|
||||
// 添加矢量遮罩
|
||||
if (viewer) {
|
||||
// let url = `${serverAPI.geoserverUrl}/shuzisannong/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=shuzisannong%3Ahuangdaoqu_town&maxFeatures=50&outputFormat=application%2Fjson`
|
||||
let url = townJson
|
||||
Cesium.GeoJsonDataSource.load(url, {
|
||||
stroke: Cesium.Color.fromCssColorString("rgba(22, 69, 153, 0)"), //轮廓颜色
|
||||
fill: Cesium.Color.fromCssColorString("rgba(22, 69, 153, 0.01)"), //内部颜色
|
||||
// strokeWidth: 3, //轮廓宽度,无效
|
||||
// clampToGround: true,//是否贴地
|
||||
}).then(function (dataSource) {
|
||||
dataSource.name = 'geojsonDataSource'//自定义属性，方便以后操作
|
||||
viewer.dataSources.add(dataSource); //添加
|
||||
// let entities = dataSource.entities.values;
|
||||
// for (var i = 0; i < entities.length; i++) {
|
||||
// let entity = entities[i];
|
||||
// entity.polygon.material = Cesium.Color.fromCssColorString("rgba(22, 69, 153, 0.8)")
|
||||
// }
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
// 监听鼠标移动
|
||||
let handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas)
|
||||
handler.setInputAction(async function (movement) {
|
||||
const earthPosition = viewer.camera.pickEllipsoid(movement.position, viewer.scene.globe.ellipsoid);//当前世界坐标笛卡尔积
|
||||
if (Cesium.defined(earthPosition)) {
|
||||
let pickedFeature = viewer.scene.pick(movement.position);//返回最上层模型属性
|
||||
if (pickedFeature && typeof (pickedFeature) != "undefined") {
|
||||
// 取消先前要素高亮
|
||||
if (previousPickedEntity && Cesium.defined(previousPickedEntity)) {
|
||||
if (previousPickedEntity === 1) {
|
||||
// 第一次添加，全部加暗
|
||||
//layerName是加载时给geojson添加的属性
|
||||
const dataSources = viewer.dataSources._dataSources
|
||||
for (let k = dataSources.length - 1; k >= 0; k--) {
|
||||
// if (dataSources[k].name.indexOf('geojsonDataSource') > -1) {
|
||||
if (dataSources[k].name && dataSources[k].name === 'geojsonDataSource') {
|
||||
// this.viewer.dataSources.remove(dataSources[k])
|
||||
let entities = dataSources[k].entities.values;
|
||||
for (var i = 0; i < entities.length; i++) {
|
||||
let entity = entities[i];
|
||||
entity.polygon.material = Cesium.Color.fromCssColorString("rgba(22, 69, 153, 0.4)")
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
previousPickedEntity.polygon.material = Cesium.Color.fromCssColorString("rgba(22, 69, 153, 0.4)");
|
||||
previousPickedEntity = null
|
||||
}
|
||||
}
|
||||
// 高亮当前选中要素
|
||||
if (Cesium.defined(pickedFeature.id) && Cesium.defined(pickedFeature.id.polygon)) {
|
||||
pickedFeature.id.polygon.material = Cesium.Color.fromCssColorString("rgba(22, 69, 153, 0)");
|
||||
previousPickedEntity = pickedFeature.id
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// 图层点击事件
|
||||
let XZDM = '';
|
||||
let XZDM = ''
|
||||
|
||||
function layerClick() {
|
||||
var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
|
||||
let handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas)
|
||||
|
||||
handler.setInputAction(async function (movement) {
|
||||
var ray = viewer.camera.getPickRay(movement.position);
|
||||
var cartesian = viewer.scene.globe.pick(ray, viewer.scene);
|
||||
@ -1321,11 +1301,7 @@ function layerClick() {
|
||||
let level = getLevel(alti);
|
||||
const layers = viewer.imageryLayers._layers;
|
||||
// 获取镇的图层 （点击镇后，再点击种植结构）
|
||||
const index = layers.findIndex(
|
||||
item =>
|
||||
item._imageryProvider._layers &&
|
||||
item._imageryProvider._layers === 'shuzisannong:huangdaoqu_town'
|
||||
);
|
||||
const index = layers.findIndex(item => item._imageryProvider._layers && item._imageryProvider._layers === 'shuzisannong:huangdaoqu_town');
|
||||
if (index > -1) {
|
||||
const providerPoint = layers[index];
|
||||
// 拿取最后一个图层
|
||||
@ -1374,12 +1350,13 @@ function layerClick() {
|
||||
'red'
|
||||
);
|
||||
// 移除以前的
|
||||
removeWms(['village_CQL']);
|
||||
// removeWms(['village_CQL']);
|
||||
// 添加新的
|
||||
addvillage(
|
||||
`XZDM=${newData.properties.XZDM}`,
|
||||
'village_CQL'
|
||||
);
|
||||
// 更改为根据级别添加村级矢量
|
||||
// addvillage(
|
||||
// `XZDM=${newData.properties.XZDM}`,
|
||||
// 'village_CQL'
|
||||
// );
|
||||
// 隐藏pop
|
||||
hiddenOverlayChart();
|
||||
} else {
|
||||
@ -1401,15 +1378,14 @@ function layerClick() {
|
||||
}
|
||||
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
||||
}
|
||||
|
||||
// 种植结构
|
||||
async function zuowuClick(layers, cartographic, level, xy, movement) {
|
||||
let newData = [];
|
||||
let promise = layers.map(async item => {
|
||||
if (item._imageryProvider._layers) {
|
||||
// 是种植结构图层
|
||||
if (
|
||||
Object.values(layersDic).findIndex(it => it === item._imageryProvider._layers) > -1
|
||||
) {
|
||||
if (Object.values(layersDic).findIndex(it => it === item._imageryProvider._layers) > -1) {
|
||||
const providerPoint = item;
|
||||
// 拿取最后一个图层
|
||||
let provider = providerPoint._imageryProvider;
|
||||
@ -1595,8 +1571,9 @@ function showOverlayChart(position) {
|
||||
pop.style.left = position.x + 10 + 'px';
|
||||
pop.style.zIndex = 99;
|
||||
}
|
||||
|
||||
//列表模式模式切换
|
||||
const SwitchMode = () => {
|
||||
function SwitchMode() {
|
||||
SwitchFlag.value = !SwitchFlag.value;
|
||||
const statInfo = chartModeDiv.value; // 获取图表元素
|
||||
statInfo.style.width = window.innerWidth - 100 + 'px'; //初始化echarts图表宽度
|
||||
@ -1622,7 +1599,7 @@ function getFarmland() {
|
||||
.then(res => {
|
||||
formLandRef.value = res.data.features;
|
||||
})
|
||||
.catch(err => {});
|
||||
.catch(err => { });
|
||||
}
|
||||
//每页条数
|
||||
const handleCurrentChange = val => {
|
||||
@ -1777,22 +1754,24 @@ const getaArea = () => {
|
||||
let arr = [];
|
||||
let a = {};
|
||||
getareas().then(res => {
|
||||
Township.crr = res.features;
|
||||
data.title.forEach((item, indexs) => {
|
||||
let town = res.features.map(i => {
|
||||
if (item === i.properties.town) {
|
||||
return i.properties;
|
||||
}
|
||||
if (res.features) {
|
||||
Township.crr = res.features;
|
||||
data.title.forEach((item, indexs) => {
|
||||
let town = res.features.map(i => {
|
||||
if (item === i.properties.town) {
|
||||
return i.properties;
|
||||
}
|
||||
});
|
||||
Object.keys(dd).forEach(it => {
|
||||
const index = town.findIndex(a => a && a.crop === it);
|
||||
if (index > -1) {
|
||||
dd[it].push(1);
|
||||
} else {
|
||||
dd[it].push(null);
|
||||
}
|
||||
});
|
||||
});
|
||||
Object.keys(dd).forEach(it => {
|
||||
const index = town.findIndex(a => a && a.crop === it);
|
||||
if (index > -1) {
|
||||
dd[it].push(1);
|
||||
} else {
|
||||
dd[it].push(null);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
ASdivision();
|
||||
// selectTab();
|
||||
});
|
||||
@ -1905,7 +1884,7 @@ const selectTab = () => {
|
||||
// 移除镇高亮
|
||||
deleteEntityByName('townLine');
|
||||
// 添加新的
|
||||
addvillage(`XZDM=${value.value}`, 'village_CQL');
|
||||
// addvillage(`XZDM=${value.value}`, 'village_CQL');
|
||||
};
|
||||
//列表模式-年
|
||||
const theTimes = () => {
|
||||
@ -2261,9 +2240,8 @@ function typesof() {
|
||||
brr = item.area;
|
||||
}
|
||||
});
|
||||
return `<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${
|
||||
params.color
|
||||
};"></span>${params.seriesName}:${Number(brr)}亩`;
|
||||
return `<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${params.color
|
||||
};"></span>${params.seriesName}:${Number(brr)}亩`;
|
||||
}
|
||||
return '';
|
||||
},
|
||||
@ -2585,7 +2563,6 @@ function farmland() {
|
||||
}
|
||||
// 图表点击事件
|
||||
function ChartClick(item) {
|
||||
console.log('item:', item);
|
||||
// 移除镇边界
|
||||
removeWms(['huangdaoqu_town'], true);
|
||||
removeWms(['shuzisannong:huangdaoqu_town']);
|
||||
@ -3294,7 +3271,6 @@ function chartModes() {
|
||||
var tooltip = option.tooltip;
|
||||
// 提示框自定义内容包括总合及文字
|
||||
function formatFun(params) {
|
||||
// console.log('params====>', params)
|
||||
let tipStr = params[0].axisValueLabel + '</br>'; // 初始化提示框文字默认当前轴名称并换行
|
||||
let totalNum = 0; // 用于存储当前列总数
|
||||
// params为当前柱状图数组数量 遍历求和并添加类目label：value
|
||||
@ -3336,6 +3312,7 @@ $height: calc(100vh - 100px);
|
||||
.centerBox {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.imgrotate {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
@ -3361,11 +3338,9 @@ $height: calc(100vh - 100px);
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 1) 33.33%,
|
||||
rgba(41, 255, 219, 1) 100%
|
||||
);
|
||||
background: linear-gradient(180deg,
|
||||
rgba(255, 255, 255, 1) 33.33%,
|
||||
rgba(41, 255, 219, 1) 100%);
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
@ -3376,11 +3351,9 @@ $height: calc(100vh - 100px);
|
||||
height: 25px;
|
||||
border-radius: 20px;
|
||||
font-size: 14px;
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(16, 111, 111, 1) 0%,
|
||||
rgba(47, 214, 214, 1) 100%
|
||||
);
|
||||
background: linear-gradient(180deg,
|
||||
rgba(16, 111, 111, 1) 0%,
|
||||
rgba(47, 214, 214, 1) 100%);
|
||||
border: 1.5px solid rgba(23, 194, 180, 1);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -3388,14 +3361,18 @@ $height: calc(100vh - 100px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabulation {
|
||||
display: none;
|
||||
padding: 20px;
|
||||
|
||||
.tableBox {
|
||||
padding: 0 10px;
|
||||
|
||||
.tableBorder {
|
||||
border-radius: 8px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.el-table--fit {
|
||||
border-radius: 8px;
|
||||
border: 2px solid rgba(100, 195, 164, 0.8);
|
||||
@ -3403,39 +3380,47 @@ $height: calc(100vh - 100px);
|
||||
0px 1px 2px 0px rgba(100, 195, 164, 0.8);
|
||||
}
|
||||
}
|
||||
:deep(
|
||||
.el-table .el-table__header-wrapper th,
|
||||
.el-table .el-table__fixed-header-wrapper th
|
||||
) {
|
||||
|
||||
:deep(.el-table .el-table__header-wrapper th,
|
||||
.el-table .el-table__fixed-header-wrapper th) {
|
||||
color: rgba(0, 0, 0, 1);
|
||||
}
|
||||
|
||||
height: 90%;
|
||||
|
||||
:deep(.el-table__inner-wrapper) {
|
||||
height: 96% !important;
|
||||
}
|
||||
|
||||
.example-pagination-block {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
:deep(.tabth) {
|
||||
background-color: rgba(247, 247, 247, 1);
|
||||
}
|
||||
}
|
||||
|
||||
.chartMode {
|
||||
width: 100%;
|
||||
height: 85%;
|
||||
|
||||
.chartModeDiv {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.searchDiv {
|
||||
display: flex;
|
||||
|
||||
.dow {
|
||||
float: right;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.modeDiv {
|
||||
width: 234px;
|
||||
height: 26px;
|
||||
@ -3456,11 +3441,13 @@ $height: calc(100vh - 100px);
|
||||
border-radius: 8px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
.Selected {
|
||||
background: rgba(100, 195, 164, 1);
|
||||
border-radius: 8px 0px 0px 8px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.Selecteds {
|
||||
background: rgba(100, 195, 164, 1);
|
||||
border-radius: 0px 8px 8px 0px;
|
||||
@ -3469,6 +3456,7 @@ $height: calc(100vh - 100px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.leftWra {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
@ -3478,6 +3466,7 @@ $height: calc(100vh - 100px);
|
||||
background: rgba(2, 31, 26, 0.85);
|
||||
box-shadow: inset 0px 0px 15px 6px rgba(41, 255, 255, 0.5);
|
||||
transition: transform 1s;
|
||||
|
||||
.leftFoldDiv {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
@ -3488,6 +3477,7 @@ $height: calc(100vh - 100px);
|
||||
font-size: 30px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.leftTop {
|
||||
height: 40%;
|
||||
max-width: 100%;
|
||||
@ -3521,6 +3511,7 @@ $height: calc(100vh - 100px);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.tableDiv {
|
||||
// background: rgba(255, 255, 255, 0.05);
|
||||
width: 100%;
|
||||
@ -3528,24 +3519,30 @@ $height: calc(100vh - 100px);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
height: 20%;
|
||||
overflow: hidden;
|
||||
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:deep(.el-table tr) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
:deep(.el-table) {
|
||||
--el-table-border-color: none;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
:deep(.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell) {
|
||||
background-color: revert;
|
||||
}
|
||||
|
||||
div {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.Crops {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
@ -3557,11 +3554,9 @@ $height: calc(100vh - 100px);
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
opacity: 1;
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
rgba(21, 173, 148, 0.1) 0%,
|
||||
rgba(21, 173, 148, 0) 100%
|
||||
);
|
||||
background: linear-gradient(90deg,
|
||||
rgba(21, 173, 148, 0.1) 0%,
|
||||
rgba(21, 173, 148, 0) 100%);
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
@ -3606,6 +3601,7 @@ $height: calc(100vh - 100px);
|
||||
background: rgba(2, 31, 26, 0.85);
|
||||
box-shadow: inset 0px 0px 15px 6px rgba(41, 255, 255, 0.5);
|
||||
transition: transform 1s;
|
||||
|
||||
.rightFoldDiv {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
@ -3616,6 +3612,7 @@ $height: calc(100vh - 100px);
|
||||
font-size: 30px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.rightTop {
|
||||
width: 100%;
|
||||
height: 40%;
|
||||
@ -3785,6 +3782,7 @@ $height: calc(100vh - 100px);
|
||||
align-items: flex-start;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#pop {
|
||||
border-radius: 5px;
|
||||
position: absolute;
|
||||
@ -3809,7 +3807,7 @@ $height: calc(100vh - 100px);
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
|
||||
& > span:nth-child(1) {
|
||||
&>span:nth-child(1) {
|
||||
font-weight: 400;
|
||||
letter-spacing: 0px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
@ -3820,7 +3818,7 @@ $height: calc(100vh - 100px);
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
& > span:nth-child(2) {
|
||||
&>span:nth-child(2) {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
width: 129px;
|
||||
height: 24px;
|
||||
@ -3879,6 +3877,7 @@ $height: calc(100vh - 100px);
|
||||
background: rgba(41, 255, 255, 0.7) !important;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.selectCity {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
1
src/views/crops/classify/town.json
Normal file
1
src/views/crops/classify/town.json
Normal file
File diff suppressed because one or more lines are too long
87
yarn-error.log
Normal file
87
yarn-error.log
Normal file
@ -0,0 +1,87 @@
|
||||
Arguments:
|
||||
C:\Program Files\nodejs\node.exe D:\Program Files (x86)\Yarn\bin\yarn.js install
|
||||
|
||||
PATH:
|
||||
D:\Python27\;D:\Python27\Scripts;C:\Program Files\Eclipse Adoptium\jdk-17.0.5.8-hotspot\bin;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;%NVM_HOME%;%NVM_SYMLINK%;D:\Program Files\Git\cmd;C:\Program Files\Docker\Docker\resources\bin;D:\Program Files (x86)\Tencent\微信web开发者工具\dll;D:\Program Files (x86)\Yarn\bin\;D:\xshell\xftp\;D:\xshell\xshell\;C:\Users\HP\AppData\Local\Microsoft\WindowsApps;C:\Users\HP\AppData\Roaming\nvm;C:\Program Files\nodejs;D:\Program Files\Microsoft VS Code\bin;D:\Program Files\JetBrains\IntelliJ IDEA 2022.2\bin;;C:\Users\HP\AppData\Local\Yarn\bin;
|
||||
|
||||
Yarn version:
|
||||
1.22.4
|
||||
|
||||
Node version:
|
||||
14.20.0
|
||||
|
||||
Platform:
|
||||
win32 x64
|
||||
|
||||
Trace:
|
||||
SyntaxError: C:\Users\HP\AppData\Local\Yarn\Cache\v6\npm-@turf-center-mean-6.5.0-2dc329c003f8012ba9ae7812a61b5647e1ae86a2-integrity\node_modules\@turf\center-mean\.yarn-metadata.json: Unexpected end of JSON input
|
||||
at JSON.parse (<anonymous>)
|
||||
at D:\Program Files (x86)\Yarn\lib\cli.js:1625:59
|
||||
at Generator.next (<anonymous>)
|
||||
at step (D:\Program Files (x86)\Yarn\lib\cli.js:310:30)
|
||||
at D:\Program Files (x86)\Yarn\lib\cli.js:321:13
|
||||
|
||||
npm manifest:
|
||||
{
|
||||
"name": "ruoyi",
|
||||
"version": "3.8.4",
|
||||
"description": "若依管理系统",
|
||||
"author": "若依",
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"start": "vite",
|
||||
"build:prod": "vite build",
|
||||
"build:stage": "vite build --mode staging",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://gitee.com/y_project/RuoYi-Vue.git"
|
||||
},
|
||||
"dependencies": {
|
||||
"@element-plus/icons-vue": "2.0.10",
|
||||
"@fit-screen/vue": "^0.2.0",
|
||||
"@turf/turf": "^6.5.0",
|
||||
"@vueuse/core": "9.5.0",
|
||||
"axios": "0.27.2",
|
||||
"echarts": "^5.3.0",
|
||||
"echarts-gl": "^2.0.9",
|
||||
"element-plus": "2.2.21",
|
||||
"file-saver": "2.0.5",
|
||||
"fuse.js": "6.6.2",
|
||||
"jquery": "^3.6.4",
|
||||
"js-cookie": "3.0.1",
|
||||
"jsencrypt": "3.3.1",
|
||||
"lib-flexible": "^0.3.2",
|
||||
"moment": "^2.29.4",
|
||||
"nprogress": "0.2.0",
|
||||
"pinia": "2.0.22",
|
||||
"postcss-px2rem": "^0.3.0",
|
||||
"v-scale-screen": "^2.2.0",
|
||||
"vue": "3.2.45",
|
||||
"vue-cropper": "1.0.3",
|
||||
"vue-json-excel": "^0.3.0",
|
||||
"vue-router": "4.1.4",
|
||||
"vue-video-player": "^6.0.0",
|
||||
"vue3-image-preview": "^0.2.6",
|
||||
"vue3-video-play": "^1.3.1-beta.6",
|
||||
"xlsx": "^0.18.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "3.1.0",
|
||||
"@vue/compiler-sfc": "3.2.45",
|
||||
"sass": "1.56.1",
|
||||
"unplugin-auto-import": "0.11.4",
|
||||
"vite": "3.2.3",
|
||||
"vite-plugin-compression": "0.5.1",
|
||||
"vite-plugin-svg-icons": "2.0.1",
|
||||
"vite-plugin-vue-setup-extend": "0.4.0"
|
||||
}
|
||||
}
|
||||
|
||||
yarn manifest:
|
||||
No manifest
|
||||
|
||||
Lockfile:
|
||||
No lockfile
|
||||
Loading…
Reference in New Issue
Block a user