From 3f01dc7da4c12311ecb31ad8d5d7224dd27e52e3 Mon Sep 17 00:00:00 2001
From: master <master@163.com>
Date: 星期四, 28 四月 2022 20:26:33 +0800
Subject: [PATCH] 添加站点
---
src/views/map/map.vue | 144 ++++++++++++++++++-----------------------------
1 files changed, 56 insertions(+), 88 deletions(-)
diff --git a/src/views/map/map.vue b/src/views/map/map.vue
index d39aa4d..f2464fc 100644
--- a/src/views/map/map.vue
+++ b/src/views/map/map.vue
@@ -92,6 +92,7 @@
</div>
</template>
<script>
+import MarsMap from '../../components/mars/map.vue'
import * as maptalks from "maptalks";
import mapboxgl from "mapbox-gl";
import "maptalks/dist/maptalks.css";
@@ -106,7 +107,7 @@
import maptool from "./maptool.vue";
import seltool from "./seltool.vue";
import seltoolcl from "./seltoolcl.vue";
-import utils from "../../unit/map";
+
import img_fengongsi_n_url from "../../assets/mapv2/icon_fengongsi.png";
import img_changzhan_n_url from "../../assets/mapv2/icon_changzhan.png";
import img_xianlu_n_url from "../../assets/mapv2/icon_xianlu.png";
@@ -129,7 +130,7 @@
import clmarkers from '../../assets/json/clmarkers.json';
import xianlumap from '../../assets/json/xianlumap.json';
-import MarsMap from '../../components/mars/map.vue'
+
export default {
name: "maptalk",
@@ -196,37 +197,7 @@
console.log(event.graphic.attr)
that.hoverDiv(0, event.graphic.attr.companyId)
})
- /*
- graphicLayer.on(this.mars3d.EventType.mouseOver, function (event) {
- console.log('鐩戝惉layer锛岄紶鏍囩Щ鍏ヤ簡鐭㈤噺瀵硅薄', event)
- })
- graphicLayer.on(this.mars3d.EventType.mouseOut, function (event) {
- console.log('鐩戝惉layer锛岄紶鏍囩Щ鍑轰簡鐭㈤噺瀵硅薄', event)
- })
- */
-
- // 鍙湪鍥惧眰涓婄粦瀹歱opup,瀵规墍鏈夊姞鍒拌繖涓浘灞傜殑鐭㈤噺鏁版嵁閮界敓鏁�
- /*
- graphicLayer.bindPopup('鎴戞槸layer涓婄粦瀹氱殑Popup', {
- anchor: [0, -10]
- })
- */
-
- // 鍙湪鍥惧眰缁戝畾鍙抽敭鑿滃崟,瀵规墍鏈夊姞鍒拌繖涓浘灞傜殑鐭㈤噺鏁版嵁閮界敓鏁�
- /*
- graphicLayer.bindContextMenu([
- {
- text: '鍒犻櫎瀵硅薄',
- iconCls: 'fa fa-trash-o',
- callback: function (e) {
- const graphic = e.graphic
- if (graphic) {
- graphicLayer.removeGraphic(graphic)
- }
- }
- }
- ])
- */
+ // 鑱婂煄杈圭晫
const maskLayer = new this.mars3d.layer.GeoJsonLayer({
id: 300,
url: "/data/liaocheng.geojson",
@@ -247,7 +218,7 @@
show: true,
flyTo: false
});
-
+ // 杈圭晫澧�
const graphic = new this.mars3d.graphic.WallEntity({
positions: this.liaocheng_boundary,
style: {
@@ -270,30 +241,6 @@
/*
this.addFenggongsi(graphicLayer)
- this.addGraphic_e02(graphicLayer)
- this.addGraphic_e03(graphicLayer)
- this.addGraphic_e04(graphicLayer)
- this.addGraphic_e05(graphicLayer)
- this.addGraphic_e06(graphicLayer)
- this.addGraphic_e07(graphicLayer)
- this.addGraphic_e08(graphicLayer)
- this.addGraphic_e09(graphicLayer)
- this.addGraphic_e10(graphicLayer)
- this.addGraphic_e11(graphicLayer)
- this.addGraphic_e12(graphicLayer)
- this.addGraphic_e13(graphicLayer)
- this.addGraphic_e14(graphicLayer)
- this.addGraphic_e15(graphicLayer)
- */
-
- /*
- let rotateOut = new this.mars3d.thing.RotateOut({
- direction: false, // 鏂瑰悜 true閫嗘椂閽堬紝false椤烘椂閽�
- time: 60 // 缁欏畾椋炶涓�鍛ㄦ墍闇�鏃堕棿(鍗曚綅 绉�)锛屾帶鍒堕�熷害
- })
- map.addThing(rotateOut)
- 寮�鍚棆杞�
- rotateOut.start()
*/
this.selectImg(0, "click");
},
@@ -590,47 +537,68 @@
attr: res.data[i]
})
fengongsi_layer.addGraphic(graphic)
-
- if (res.data[i].shape != null) {
- const graphic = new this.mars3d.graphic.PolygonEntity({
- positions: res.data[i].shape,
- style: {
- height: 500 + Math.random() * 1000,
- diffHeight: 2000.0,
- color: this.fillBoderColors[i],
- alphaPower: 1.5,
- opacity: 0.5,
- highlight: {
- type: this.mars3d.EventType.click,
- diffHeight: 3000,
- material: this.mars3d.MaterialUtil.createMaterialProperty(this.mars3d.MaterialType.LineFlow, {
- image: "img/textures/fence.png",
- color: "#bdf700",
- repeat: new Cesium.Cartesian2(10, 1),
- axisY: true, // 鏂瑰悜锛宼rue鏃朵笂涓嬶紝false宸﹀彸
- speed: 10
- })
- },
- attr: res.data[i]
- },
- })
- fengongsi_area_layer.addGraphic(graphic)
- }
}
}
});
},
initzdLayer () {
- utils.initzhandianLayer();
+ // let datas = []
+ // this.$axios.get(this.$Interface.mapResource.getZhandianDataAll, {}).then((res) => {
+ // console.log(res, "绔欑偣鎺ュ彛")
+ // })
+ let that = this
+ //utils.initfgsLayer();
+ const zhandian_layer = new this.mars3d.layer.GraphicLayer({ id: 'zhandian_layer' })
+ // 2.鍦╨ayer涓婄粦瀹氱洃鍚簨浠�
+ zhandian_layer.on(this.mars3d.EventType.click, function (event) {
+ console.log('鐩戝惉layer锛屽崟鍑讳簡鐭㈤噺瀵硅薄', event)
+ console.log(event.graphic.attr)
+ store.commit("SET_SelAttr", { visa: true, type: "zhandian", id: event.graphic.attr.id, value: event.graphic.attr.name })
+ event.graphic.flyTo({ radius: 2000, duration: 1 })
+
+ })
+ const zhandian_area_layer = new this.mars3d.layer.GraphicLayer({ id: 'zhandian_area_layer' })
+ window.marsmap.addLayer(zhandian_layer)
+ window.marsmap.addLayer(zhandian_area_layer)
+
+ this.$axios.get(this.$Interface.mapResource.getZhandianDataAll, {}).then((res) => {
+ if (res.code === 0) {
+ console.log(res.data);
+ for (let i = 0; i < res.data.length; i++) {
+ const graphic = new this.mars3d.graphic.DivGraphic({
+ position: [res.data[i].longitude, res.data[i].latitude, 1000],
+ style: {
+ html: `<div class="marsBlueGradientPnl"><div>` + res.data[i].companyName + `</div></div>`,
+ offsetY: -60,
+ horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
+ verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+ distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 400000), // 鎸夎璺濊窛绂绘樉绀�
+ // 楂樹寒鏃剁殑鏍峰紡
+ highlight: {
+ type: this.mars3d.EventType.click,
+ className: "marsBlueGradientPnl-highlight"
+ }
+ },
+ attr: res.data[i]
+ })
+ zhandian_layer.addGraphic(graphic)
+ }
+ }
+ });
},
initczLayer () {
- utils.initchangzhanLayer();
+ let datas = []
+ this.$axios.get(this.$Interface.mapResource.getChangZhanAllData, {}).then((res) => {
+ console.log(res, "鍦虹珯鎺ュ彛")
+ })
},
initxlLayer () {
- utils.loadGeometryById("411", "1");
+ // utils.loadGeometryById("411", "1");
+ console.log("eee")
},
initclLayer () {
- utils.initcheliangLayer();
+ // utils.initcheliangLayer();
+ console.log("eeeeeeee")
},
closediv (str) {
if (str === "zhandian") {
--
Gitblit v1.9.1