|
@@ -6,24 +6,26 @@
|
|
label="图斑编号"
|
|
label="图斑编号"
|
|
label-class-name="my-label"
|
|
label-class-name="my-label"
|
|
content-class-name="my-content"
|
|
content-class-name="my-content"
|
|
- >{{ "6401812024070108270002" }}</el-descriptions-item
|
|
|
|
|
|
+ >{{ hcObj.jcbh }}</el-descriptions-item
|
|
>
|
|
>
|
|
<el-descriptions-item
|
|
<el-descriptions-item
|
|
label="外业核实情况"
|
|
label="外业核实情况"
|
|
content-class-name="my-content"
|
|
content-class-name="my-content"
|
|
:span="3"
|
|
:span="3"
|
|
- >{{ "已核实" }}</el-descriptions-item
|
|
|
|
|
|
+ >{{ hcObj.wyhsqk }}</el-descriptions-item
|
|
>
|
|
>
|
|
<el-descriptions-item label="实际地类代码">{{
|
|
<el-descriptions-item label="实际地类代码">{{
|
|
- "4601"
|
|
|
|
|
|
+ hcObj.sjdldm
|
|
}}</el-descriptions-item>
|
|
}}</el-descriptions-item>
|
|
<el-descriptions-item label="调查人员">{{
|
|
<el-descriptions-item label="调查人员">{{
|
|
- "刘子规"
|
|
|
|
|
|
+ hcObj.dcry
|
|
}}</el-descriptions-item>
|
|
}}</el-descriptions-item>
|
|
<el-descriptions-item label="调查时间">{{
|
|
<el-descriptions-item label="调查时间">{{
|
|
- "20240116"
|
|
|
|
|
|
+ hcObj.dcsj
|
|
|
|
+ }}</el-descriptions-item>
|
|
|
|
+ <el-descriptions-item label="扩展信息1">{{
|
|
|
|
+ "无"
|
|
}}</el-descriptions-item>
|
|
}}</el-descriptions-item>
|
|
- <el-descriptions-item label="扩展信息1">{{ "1" }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="扩展信息2">{{
|
|
<el-descriptions-item label="扩展信息2">{{
|
|
"无"
|
|
"无"
|
|
}}</el-descriptions-item>
|
|
}}</el-descriptions-item>
|
|
@@ -34,9 +36,7 @@
|
|
</div>
|
|
</div>
|
|
<div class="imgCon">
|
|
<div class="imgCon">
|
|
<div class="echartTitle">
|
|
<div class="echartTitle">
|
|
- <div class="block-title">
|
|
|
|
- 监测类型情况 <span @click="ceshi">测试</span>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div class="block-title">监测类型情况</div>
|
|
</div>
|
|
</div>
|
|
<div class="imgList">
|
|
<div class="imgList">
|
|
<div
|
|
<div
|
|
@@ -48,8 +48,10 @@
|
|
@mouseleave="handleMouseLeave(item, i)"
|
|
@mouseleave="handleMouseLeave(item, i)"
|
|
>
|
|
>
|
|
<span>{{ i + 1 }}</span>
|
|
<span>{{ i + 1 }}</span>
|
|
- <img :src="item.imgUrl" />
|
|
|
|
- <p>{{ item.info }}</p>
|
|
|
|
|
|
+ <!-- <img :src="imgUrl" /> -->
|
|
|
|
+ <img :src="item.imagerPath" />
|
|
|
|
+ <!-- <img :src="imgUrl + item.imagerPath" /> -->
|
|
|
|
+ <p>{{ item.imagerSj }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -57,90 +59,68 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
+import { getJctbhcInfo } from "@/api/ghss/jctb.js";
|
|
export default {
|
|
export default {
|
|
props: {
|
|
props: {
|
|
detailObj: {
|
|
detailObj: {
|
|
type: Object,
|
|
type: Object,
|
|
},
|
|
},
|
|
|
|
+ jcbh: {
|
|
|
|
+ type: String,
|
|
|
|
+ },
|
|
},
|
|
},
|
|
components: {},
|
|
components: {},
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- monitorList: [
|
|
|
|
|
|
+ imgUrl: "",
|
|
|
|
+ monitorList:[],
|
|
|
|
+ monitorImg: [
|
|
{
|
|
{
|
|
- id: "s1",
|
|
|
|
imgUrl:
|
|
imgUrl:
|
|
"https://b0.bdstatic.com/ugc/Gr0RkpztmAdvrxnS4n54Iw49d04e3484c9bb1a11f03b38a819d893.jpg@h_1280",
|
|
"https://b0.bdstatic.com/ugc/Gr0RkpztmAdvrxnS4n54Iw49d04e3484c9bb1a11f03b38a819d893.jpg@h_1280",
|
|
- info: "2024-09-27 15:04",
|
|
|
|
- name: "钱复式",
|
|
|
|
- lat: "168.18",
|
|
|
|
- lon: "46.33",
|
|
|
|
- psfw: "45°",
|
|
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- id: "s2",
|
|
|
|
imgUrl:
|
|
imgUrl:
|
|
"https://img2.baidu.com/it/u=3692233586,2896402884&fm=253&fmt=auto&app=120&f=JPEG?w=759&h=427",
|
|
"https://img2.baidu.com/it/u=3692233586,2896402884&fm=253&fmt=auto&app=120&f=JPEG?w=759&h=427",
|
|
- info: "2024-09-27 15:04",
|
|
|
|
- name: "梅执礼",
|
|
|
|
- lat: "168.18",
|
|
|
|
- lon: "46.33",
|
|
|
|
- psfw: "45°",
|
|
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- id: "s3",
|
|
|
|
imgUrl:
|
|
imgUrl:
|
|
"https://img2.baidu.com/it/u=882190421,2711411099&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1067",
|
|
"https://img2.baidu.com/it/u=882190421,2711411099&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1067",
|
|
- info: "2024-09-27 15:04",
|
|
|
|
- name: "陈贵志",
|
|
|
|
- lat: "168.18",
|
|
|
|
- lon: "46.33",
|
|
|
|
- psfw: "45°",
|
|
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- id: "s4",
|
|
|
|
imgUrl:
|
|
imgUrl:
|
|
"http://img2.baidu.com/it/u=516755055,1384417278&fm=253&app=138&f=JPEG?w=800&h=1067",
|
|
"http://img2.baidu.com/it/u=516755055,1384417278&fm=253&app=138&f=JPEG?w=800&h=1067",
|
|
- info: "2024-09-27 15:04",
|
|
|
|
- name: "权超英",
|
|
|
|
- lat: "168.18",
|
|
|
|
- lon: "46.33",
|
|
|
|
- psfw: "45°",
|
|
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- id: "s5",
|
|
|
|
imgUrl:
|
|
imgUrl:
|
|
"http://img0.baidu.com/it/u=1366170349,307387023&fm=253&app=138&f=JPEG?w=800&h=1067",
|
|
"http://img0.baidu.com/it/u=1366170349,307387023&fm=253&app=138&f=JPEG?w=800&h=1067",
|
|
- info: "2024-09-27 15:04",
|
|
|
|
- name: "王XX",
|
|
|
|
- lat: "168.18",
|
|
|
|
- lon: "46.33",
|
|
|
|
- psfw: "45°",
|
|
|
|
},
|
|
},
|
|
],
|
|
],
|
|
primitive: null,
|
|
primitive: null,
|
|
selectId: null,
|
|
selectId: null,
|
|
primitivesArray: [],
|
|
primitivesArray: [],
|
|
|
|
+ hcObj: null,
|
|
|
|
+ // jtArr:[],//箭头id数组
|
|
|
|
+ // dwArr:[],//
|
|
|
|
+ idArr:[],//id数组
|
|
};
|
|
};
|
|
},
|
|
},
|
|
computed: {},
|
|
computed: {},
|
|
mounted() {
|
|
mounted() {
|
|
this.$nextTick(() => {
|
|
this.$nextTick(() => {
|
|
// this.aaa();
|
|
// this.aaa();
|
|
- // this.colorChange();
|
|
|
|
- // this.ccc();
|
|
|
|
- // this.onClickButton();
|
|
|
|
- this.ddd();
|
|
|
|
|
|
+ // this.ddd();
|
|
|
|
+ // this.imgUrl =
|
|
|
|
+ // "https://b0.bdstatic.com/ugc/Gr0RkpztmAdvrxnS4n54Iw49d04e3484c9bb1a11f03b38a819d893.jpg@h_1280";
|
|
});
|
|
});
|
|
|
|
+ this.imgUrl = window.axiosURI + "/analyse/fzss/DownloadReport?filePath=";
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
handleMouseEnter(a, b) {
|
|
handleMouseEnter(a, b) {
|
|
- console.log("鼠标移入", a, b);
|
|
|
|
- this.ceshi('111')
|
|
|
|
|
|
+ this.ceshi(a.id,'yr');
|
|
},
|
|
},
|
|
handleMouseLeave(a, b) {
|
|
handleMouseLeave(a, b) {
|
|
- console.log("鼠标移出");
|
|
|
|
- this.ceshi()
|
|
|
|
|
|
+ this.ceshi(a.id,'yc');
|
|
},
|
|
},
|
|
changeData(name, updata) {
|
|
changeData(name, updata) {
|
|
this[name] = updata;
|
|
this[name] = updata;
|
|
@@ -149,178 +129,48 @@ export default {
|
|
this.$emit("updateParent", "emitImgList", this.monitorList);
|
|
this.$emit("updateParent", "emitImgList", this.monitorList);
|
|
this.$emit("updateParent", "emitImgIndex", val);
|
|
this.$emit("updateParent", "emitImgIndex", val);
|
|
},
|
|
},
|
|
- aaa() {
|
|
|
|
- var redLine = viewer.entities.add({
|
|
|
|
- // 贴在地面上 两点之间的直线距离
|
|
|
|
- name: "line",
|
|
|
|
- // polyline: {
|
|
|
|
- // positions: Cesium.Cartesian3.fromDegreesArray([
|
|
|
|
- // // o.inx,
|
|
|
|
- // // o.iny,
|
|
|
|
- // // o.outx,
|
|
|
|
- // // o.outy,
|
|
|
|
- // 109.5077, 18.309, 109.5111, 18.3093,
|
|
|
|
- // ]),
|
|
|
|
- // width: 20,
|
|
|
|
- // // 不带箭头的线
|
|
|
|
- // // material: Cesium.Color.RED,
|
|
|
|
- // // 是否紧贴地面
|
|
|
|
- // clampToGround: true,
|
|
|
|
- // // 带箭头的线
|
|
|
|
- // material: new Cesium.PolylineArrowMaterialProperty(Cesium.Color.RED),
|
|
|
|
- // },
|
|
|
|
-
|
|
|
|
- polygon: {
|
|
|
|
- hierarchy: Cesium.Cartesian3.fromDegreesArray([
|
|
|
|
- // o.inx,
|
|
|
|
- // o.iny,
|
|
|
|
- // o.outx,
|
|
|
|
- // o.outy,
|
|
|
|
- 109.5077, 18.309, 109.5111, 18.3093,
|
|
|
|
- ]),
|
|
|
|
- material: new Cesium.ColorMaterialProperty(
|
|
|
|
- Cesium.Color.fromCssColorString("rgba(255, 255, 255, 1)")
|
|
|
|
- ),
|
|
|
|
- width: 15,
|
|
|
|
- },
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
- ccc() {
|
|
|
|
- // // var viewer = new Cesium.Viewer("cesiumContainer");
|
|
|
|
- // // var scene = viewer.scene;
|
|
|
|
- // // 创建BillboardCollection来存储图片或图标
|
|
|
|
- // var billboards = viewer.scene.primitives.add(
|
|
|
|
- // new Cesium.BillboardCollection()
|
|
|
|
- // );
|
|
|
|
- // // 添加一个带偏移量和旋转的图标
|
|
|
|
- // var billboard = billboards.add({
|
|
|
|
- // image:
|
|
|
|
- // "https://img2.baidu.com/it/u=2726480512,4270878021&fm=253&fmt=auto&app=120&f=JPEG?w=193&h=193", // 替换为图片的路径
|
|
|
|
- // position: Cesium.Cartesian3.fromDegrees(109.5077, 18.309), // 设置图片的位置,采用经纬度
|
|
|
|
- // width: 64, // 设置图片的宽度
|
|
|
|
- // height: 64, // 设置图片的高度
|
|
|
|
- // rotation: Cesium.Math.toRadians(45), // 设置初始旋转角度(单位弧度)
|
|
|
|
- // // clampToGround: true,
|
|
|
|
- // pixelOffset: new Cesium.Cartesian2(30, -40), // 设置偏移量,X轴偏移30像素,Y轴偏移-40像素
|
|
|
|
- // heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
|
|
|
- // horizontalOrigin: Cesium.HorizontalOrigin.CENTER, // 水平锚点
|
|
|
|
- // verticalOrigin: Cesium.VerticalOrigin.BOTTOM, // 垂直锚点
|
|
|
|
- // });
|
|
|
|
-
|
|
|
|
- // 创建一个Cesium视图
|
|
|
|
- // var viewer = new Cesium.Viewer("cesiumContainer");
|
|
|
|
-
|
|
|
|
- // 获取场景对象
|
|
|
|
- var scene = viewer.scene;
|
|
|
|
-
|
|
|
|
- // 创建一个BillboardCollection,用于存放所有Billboard对象
|
|
|
|
- var billboards = scene.primitives.add(new Cesium.BillboardCollection());
|
|
|
|
-
|
|
|
|
- // 定义图片的URL
|
|
|
|
- var imageUrl = "https://example.com/your-image.png";
|
|
|
|
-
|
|
|
|
- // 设置图片的初始位置(经纬度)
|
|
|
|
- var longitude = -75.0;
|
|
|
|
- var latitude = 40.0;
|
|
|
|
- var height = 1000; // 距离地面1000米
|
|
|
|
-
|
|
|
|
- // 创建Billboard对象
|
|
|
|
- var billboard = billboards.add({
|
|
|
|
- image: imageUrl, // 设置图片
|
|
|
|
- position: Cesium.Cartesian3.fromDegrees(longitude, latitude, height), // 设置位置
|
|
|
|
- heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 贴地
|
|
|
|
- scale: 1.0, // 图片的缩放比例
|
|
|
|
- rotation: Cesium.Math.toRadians(45), // 旋转角度,单位是弧度
|
|
|
|
- pixelOffset: new Cesium.Cartesian2(50, 0), // 图片的偏移量,单位是像素(x, y)
|
|
|
|
- alignedAxis: Cesium.Cartesian3.ZERO, // 不需要对齐轴
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
- //点击事件
|
|
|
|
- onClickButton(e, val) {
|
|
|
|
- // 每次进来清空,然后再重新加载图片
|
|
|
|
- this.primitivesArray.forEach((primitive) => {
|
|
|
|
- viewer.scene.primitives.remove(primitive);
|
|
|
|
- });
|
|
|
|
- this.primitivesArray = []; // 清空数组,
|
|
|
|
-
|
|
|
|
- //传的图片
|
|
|
|
- let image =
|
|
|
|
- "https://img2.baidu.com/it/u=2726480512,4270878021&fm=253&fmt=auto&app=120&f=JPEG?w=193&h=193";
|
|
|
|
- //传的图片 、经纬度、范围
|
|
|
|
- this.PosButtonClick(image, 109.5077, 18.309, 24);
|
|
|
|
- },
|
|
|
|
|
|
+ // aaa() {
|
|
|
|
+ // var redLine = viewer.entities.add({
|
|
|
|
+ // // 贴在地面上 两点之间的直线距离
|
|
|
|
+ // name: "line",
|
|
|
|
+ // polyline: {
|
|
|
|
+ // positions: Cesium.Cartesian3.fromDegreesArray([
|
|
|
|
+ // // o.inx,
|
|
|
|
+ // // o.iny,
|
|
|
|
+ // // o.outx,
|
|
|
|
+ // // o.outy,
|
|
|
|
+ // 109.5077, 18.309, 109.5111, 18.3093,
|
|
|
|
+ // ]),
|
|
|
|
+ // width: 20,
|
|
|
|
+ // // 不带箭头的线
|
|
|
|
+ // // material: Cesium.Color.RED,
|
|
|
|
+ // // 是否紧贴地面
|
|
|
|
+ // clampToGround: true,
|
|
|
|
+ // // 带箭头的线
|
|
|
|
+ // material: new Cesium.PolylineArrowMaterialProperty(Cesium.Color.RED),
|
|
|
|
+ // },
|
|
|
|
+ // });
|
|
|
|
+ // },
|
|
|
|
|
|
//加载图片
|
|
//加载图片
|
|
- PosButtonClick(imageurl, lon, lat, round) {
|
|
|
|
- var point = {
|
|
|
|
- longitude: lon,
|
|
|
|
- latitude: lat,
|
|
|
|
- height: -0.7728200032702337,
|
|
|
|
- };
|
|
|
|
- var rvalue = round; //范围半径
|
|
|
|
-
|
|
|
|
- // 计算边界
|
|
|
|
- var west =
|
|
|
|
- point.longitude -
|
|
|
|
- Cesium.Math.toDegrees(rvalue / Cesium.Ellipsoid.WGS84.maximumRadius);
|
|
|
|
- var south =
|
|
|
|
- point.latitude -
|
|
|
|
- Cesium.Math.toDegrees(rvalue / Cesium.Ellipsoid.WGS84.maximumRadius);
|
|
|
|
- var east =
|
|
|
|
- point.longitude +
|
|
|
|
- Cesium.Math.toDegrees(rvalue / Cesium.Ellipsoid.WGS84.maximumRadius);
|
|
|
|
- var north =
|
|
|
|
- point.latitude +
|
|
|
|
- Cesium.Math.toDegrees(rvalue / Cesium.Ellipsoid.WGS84.maximumRadius);
|
|
|
|
-
|
|
|
|
- var bounds = Cesium.Rectangle.fromDegrees(west, south, east, north);
|
|
|
|
-
|
|
|
|
- var bound = new Cesium.Rectangle(west, south, east, north);
|
|
|
|
-
|
|
|
|
- var heatPrimitive = viewer.scene.primitives.add(
|
|
|
|
- new Cesium.GroundPrimitive({
|
|
|
|
- geometryInstances: new Cesium.GeometryInstance({
|
|
|
|
- geometry: new Cesium.RectangleGeometry({
|
|
|
|
- rectangle: Cesium.Rectangle.fromDegrees(
|
|
|
|
- bound.west,
|
|
|
|
- bound.south,
|
|
|
|
- bound.east,
|
|
|
|
- bound.north
|
|
|
|
- ),
|
|
|
|
- vertexFormat: Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT,
|
|
|
|
- width: 24, // 设置图片的宽度
|
|
|
|
- height: 24, // 设置图片的高度
|
|
|
|
- rotation: Cesium.Math.toRadians(45), // 设置初始旋转角度(单位弧度)
|
|
|
|
- // clampToGround: true,
|
|
|
|
- pixelOffset: new Cesium.Cartesian2(30, -400), // 设置偏移量,X轴偏移30像素,Y轴偏移-40像素
|
|
|
|
- }),
|
|
|
|
- }),
|
|
|
|
- appearance: new Cesium.EllipsoidSurfaceAppearance({
|
|
|
|
- aboveGround: true,
|
|
|
|
- material: new Cesium.Material({
|
|
|
|
- fabric: {
|
|
|
|
- type: "Image",
|
|
|
|
- uniforms: {
|
|
|
|
- image: imageurl,
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- }),
|
|
|
|
- }),
|
|
|
|
- })
|
|
|
|
- );
|
|
|
|
- // 将新创建的GroundPrimitive添加到数组中
|
|
|
|
- this.primitivesArray.push(heatPrimitive);
|
|
|
|
- },
|
|
|
|
- ddd() {
|
|
|
|
|
|
+ ddd(obj) {
|
|
// 将经纬度转换为 Cartesian3 坐标,起始点
|
|
// 将经纬度转换为 Cartesian3 坐标,起始点
|
|
- var startPosition = Cesium.Cartesian3.fromDegrees(109.5077, 18.309);
|
|
|
|
- console.log(this.getLonAndLat(109.5077, 18.309, 78, 20), "======");
|
|
|
|
|
|
+ //起始点
|
|
|
|
+ var startPosition = Cesium.Cartesian3.fromDegrees(
|
|
|
|
+ Number(obj.imagerLzb),
|
|
|
|
+ Number(obj.imagerBzb)
|
|
|
|
+ );
|
|
|
|
+ let poi = this.getLonAndLat(
|
|
|
|
+ Number(obj.imagerLzb),
|
|
|
|
+ Number(obj.imagerBzb),
|
|
|
|
+ Number(obj.imagerAngle),
|
|
|
|
+ 20
|
|
|
|
+ );
|
|
//结束点
|
|
//结束点
|
|
- var targetPosition = Cesium.Cartesian3.fromDegrees(109.5111, 18.3093);
|
|
|
|
-
|
|
|
|
|
|
+ var targetPosition = Cesium.Cartesian3.fromDegrees(poi.lng, poi.lat);
|
|
// 创建一个实体来表示点
|
|
// 创建一个实体来表示点
|
|
var pointEntity = viewer.entities.add({
|
|
var pointEntity = viewer.entities.add({
|
|
- id: "dw" + 1,
|
|
|
|
|
|
+ id: "dw" + obj.id,
|
|
position: startPosition, // 点的位置
|
|
position: startPosition, // 点的位置
|
|
point: {
|
|
point: {
|
|
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 设置为贴地
|
|
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 设置为贴地
|
|
@@ -330,10 +180,9 @@ export default {
|
|
outlineWidth: 2, // 点的轮廓宽度
|
|
outlineWidth: 2, // 点的轮廓宽度
|
|
},
|
|
},
|
|
});
|
|
});
|
|
-
|
|
|
|
// 创建一个实体来放置箭头
|
|
// 创建一个实体来放置箭头
|
|
var arrowEntity = viewer.entities.add({
|
|
var arrowEntity = viewer.entities.add({
|
|
- id: "jt" + 1,
|
|
|
|
|
|
+ id: "jt" + obj.id,
|
|
position: startPosition, // 设置箭头位置
|
|
position: startPosition, // 设置箭头位置
|
|
billboard: {
|
|
billboard: {
|
|
// image: "http://192.168.176.1:8001/长箭头.png", // 设置箭头图标
|
|
// image: "http://192.168.176.1:8001/长箭头.png", // 设置箭头图标
|
|
@@ -341,44 +190,44 @@ export default {
|
|
width: 37, // 设置图标宽度
|
|
width: 37, // 设置图标宽度
|
|
height: 69, // 设置图标高度
|
|
height: 69, // 设置图标高度
|
|
scale: 0.7, // 设置图标缩放
|
|
scale: 0.7, // 设置图标缩放
|
|
|
|
+ rotation: Cesium.Math.toRadians(360 - Number(obj.imagerAngle)), // 可选,默认为0
|
|
|
|
+ // rotation: Number(obj.imagerAngle), // 可选,默认为0
|
|
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 设置贴地
|
|
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 设置贴地
|
|
},
|
|
},
|
|
});
|
|
});
|
|
|
|
|
|
- // 计算箭头的方向并更新
|
|
|
|
- function updateArrowOrientation() {
|
|
|
|
- // 计算起点到目标点的方向向量
|
|
|
|
- var direction = Cesium.Cartesian3.subtract(
|
|
|
|
- targetPosition,
|
|
|
|
- startPosition,
|
|
|
|
- new Cesium.Cartesian3()
|
|
|
|
- );
|
|
|
|
|
|
+ // // 计算箭头的方向并更新
|
|
|
|
+ // function updateArrowOrientation() {
|
|
|
|
+ // // 计算起点到目标点的方向向量
|
|
|
|
+ // var direction = Cesium.Cartesian3.subtract(
|
|
|
|
+ // targetPosition,
|
|
|
|
+ // startPosition,
|
|
|
|
+ // new Cesium.Cartesian3()
|
|
|
|
+ // );
|
|
|
|
|
|
- // 确保方向向量有效
|
|
|
|
- if (Cesium.Cartesian3.magnitude(direction) > 0) {
|
|
|
|
- // 计算箭头朝向目标的方向角(使用 JavaScript 原生 Math.atan2)
|
|
|
|
- var heading = Cesium.Math.toDegrees(
|
|
|
|
- Math.atan2(direction.y, direction.x)
|
|
|
|
- );
|
|
|
|
|
|
+ // // 确保方向向量有效
|
|
|
|
+ // if (Cesium.Cartesian3.magnitude(direction) > 0) {
|
|
|
|
+ // // 计算箭头朝向目标的方向角(使用 JavaScript 原生 Math.atan2)
|
|
|
|
+ // var heading = Cesium.Math.toDegrees(
|
|
|
|
+ // Math.atan2(direction.y, direction.x)
|
|
|
|
+ // );
|
|
|
|
|
|
- // 固定方向,使用 rotation 设置固定旋转
|
|
|
|
- arrowEntity.billboard.rotation = Cesium.Math.toRadians(heading); // 固定旋转角度,不随地图旋转
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
|
|
+ // // 固定方向,使用 rotation 设置固定旋转
|
|
|
|
+ // arrowEntity.billboard.rotation = Cesium.Math.toRadians(heading); // 固定旋转角度,不随地图旋转
|
|
|
|
+ // }
|
|
|
|
+ // }
|
|
|
|
|
|
- // 每次视图更新时,重新计算箭头方向
|
|
|
|
- viewer.scene.preRender.addEventListener(function () {
|
|
|
|
- updateArrowOrientation();
|
|
|
|
- });
|
|
|
|
|
|
+ // // 每次视图更新时,重新计算箭头方向
|
|
|
|
+ // viewer.scene.preRender.addEventListener(function () {
|
|
|
|
+ // updateArrowOrientation();
|
|
|
|
+ // });
|
|
|
|
|
|
// 聚焦视角到箭头位置
|
|
// 聚焦视角到箭头位置
|
|
viewer.zoomTo(arrowEntity);
|
|
viewer.zoomTo(arrowEntity);
|
|
},
|
|
},
|
|
- ceshi(item) {
|
|
|
|
- // console.log(item,"?????");
|
|
|
|
- let aaa = viewer.entities.getById("jt1");
|
|
|
|
-
|
|
|
|
- if (item) {
|
|
|
|
|
|
+ ceshi(id,evtName) {
|
|
|
|
+ let aaa = viewer.entities.getById("jt" + id);
|
|
|
|
+ if (evtName == 'yr') {
|
|
aaa.billboard.image = "/static/images/路径@3x.png";
|
|
aaa.billboard.image = "/static/images/路径@3x.png";
|
|
} else {
|
|
} else {
|
|
aaa.billboard.image = "/static/images/路径@3x-2.png";
|
|
aaa.billboard.image = "/static/images/路径@3x-2.png";
|
|
@@ -468,20 +317,39 @@ export default {
|
|
return lngLatObj;
|
|
return lngLatObj;
|
|
},
|
|
},
|
|
|
|
|
|
- delatePoi(item) {
|
|
|
|
- // if (this.arrww.length != 0) {
|
|
|
|
- // this.arrww.forEach((item) => {
|
|
|
|
- viewer.entities.removeById(item);
|
|
|
|
- // });
|
|
|
|
- // this.arrww = [];
|
|
|
|
- // }
|
|
|
|
|
|
+ delatePoi(type) {
|
|
|
|
+ if (this.idArr.length != 0) {
|
|
|
|
+ this.idArr.forEach((item) => {
|
|
|
|
+ viewer.entities.removeById(type + item);
|
|
|
|
+ });
|
|
|
|
+ // this.idArr = [];
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ watch: {
|
|
|
|
+ jcbh: {
|
|
|
|
+ handler(newVal, oldVal) {
|
|
|
|
+ getJctbhcInfo(newVal).then((res) => {
|
|
|
|
+ this.idArr= []
|
|
|
|
+ if (res.code == 200) {
|
|
|
|
+ this.monitorList = res.data.images;
|
|
|
|
+ this.hcObj = res.data;
|
|
|
|
+ this.monitorList.forEach((item, i) => {
|
|
|
|
+ item.name = res.data.dcry;
|
|
|
|
+ item.imagerPath = this.monitorImg[i].imgUrl
|
|
|
|
+ this.ddd(item);
|
|
|
|
+ this.idArr.push(item.id)
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ deep: true,
|
|
|
|
+ immediate: true,
|
|
},
|
|
},
|
|
},
|
|
},
|
|
- watch: {},
|
|
|
|
- watch: {},
|
|
|
|
beforeDestroy() {
|
|
beforeDestroy() {
|
|
- this.delatePoi("jt1");
|
|
|
|
- this.delatePoi("dw1");
|
|
|
|
|
|
+ this.delatePoi("jt");
|
|
|
|
+ this.delatePoi("dw");
|
|
},
|
|
},
|
|
};
|
|
};
|
|
</script>
|
|
</script>
|