From b093582a3cd61a19bd5a9344872ac7520dcef5af Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Mon, 13 Dec 2021 13:35:42 +0800
Subject: [PATCH] +暂存更改
---
src/components/map/indexL.vue | 240 ++++++++++++++++++++++++++++++++++++++++++++++++
src/store/modules/viewer.js | 4
2 files changed, 242 insertions(+), 2 deletions(-)
diff --git a/src/components/map/indexL.vue b/src/components/map/indexL.vue
new file mode 100644
index 0000000..cbd4153
--- /dev/null
+++ b/src/components/map/indexL.vue
@@ -0,0 +1,240 @@
+/* eslint-disable camelcase */
+<template>
+ <div id="viewer-container" style="height: 100%; width: 100%">
+ <div
+ v-show="popupFlag"
+ id="modelPopup"
+ style="
+ width: 366px;
+ height: 240px;
+ background: url(/img/bg/nav-bg.jpeg) no-repeat;
+ background-size: 100% 100%;
+ "
+ >
+ <div class="header">
+ <div class="logo">
+ <img src="/img/navicon/map.png" alt="" />
+ </div>
+ <div class="title">明德楼</div>
+ <div class="close">
+ <img src="/img/navicon/close.png" alt="" />
+ </div>
+ </div>
+ <div class="content">
+ <div class="img"></div>
+ <div class="meau"></div>
+ </div>
+ </div>
+
+ <div id="map_popup_content"></div>
+ <div ref="mapContentContent" v-show="popupWindow" id="map_content_content">
+ <div class="arc-bcg">
+ <img src="/img/job/one.jpg" alt="" @click="once" />
+ </div>
+ </div>
+ </div>
+</template>
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+ name: "mapBox",
+ data() {
+ return {
+ popupFlag: false,
+ popupWindow: false,
+ };
+ },
+ computed: {
+ ...mapGetters(["viewer"]),
+ },
+ mounted() {
+ var DC = global.DC;
+
+ var that = this;
+
+ let viewer;
+
+ function distanceSurface() {
+ viewer.measure.distanceSurface();
+ }
+
+ function calcArea() {
+ viewer.measure.area();
+ }
+
+ function areaSurface() {
+ viewer.measure.areaSurface();
+ }
+
+ function calcAngle() {
+ viewer.measure.angle();
+ }
+
+ function calcModelAngle() {
+ viewer.measure.angle({
+ clampToModel: true,
+ });
+ }
+
+ function calcHeight() {
+ viewer.measure.height();
+ }
+
+ function calcModelHeight() {
+ viewer.measure.height({
+ clampToModel: true,
+ });
+ }
+
+ function calcHeading() {
+ viewer.measure.heading();
+ }
+
+ function areaHeight() {
+ viewer.measure.areaHeight();
+ }
+
+ function calcTriangleHeight() {
+ viewer.measure.triangleHeight();
+ }
+
+ function calcModelTriangleHeight() {
+ viewer.measure.triangleHeight({
+ clampToModel: true,
+ });
+ }
+
+ function deactivate() {
+ viewer.measure.deactivate();
+ }
+
+ function gotoModel() {
+ viewer.flyTo(tileset);
+ }
+
+ function initViewer() {
+ viewer = new DC.Viewer("viewer-container", {
+ contextOptions: {
+ webgl: {
+ stencil: true,
+ preserveDrawingBuffer: true,
+ },
+ },
+ });
+
+ console.log(DC, 45678);
+
+ const popup = viewer.popup;
+
+ popup.hide();
+
+ that.$store.commit("SET_VIEWER", viewer);
+
+ const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({
+ url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
+ });
+ viewer.addBaseLayer(baselayer, {
+ iconUrl: "examples/images/icon/img.png",
+ name: "影像",
+ });
+
+ // eslint-disable-next-line camelcase
+ const baselayer_shaded = DC.ImageryLayerFactory.createArcGisImageryLayer({
+ url: "http://services.arcgisonline.com/arcgis/rest/services/World_Shaded_Relief/MapServer",
+ });
+ viewer.addBaseLayer(baselayer_shaded, {
+ iconUrl: "examples/images/icon/elec.png",
+ name: "电子",
+ });
+
+ // eslint-disable-next-line camelcase
+ const baselayer_street = DC.ImageryLayerFactory.createArcGisImageryLayer({
+ url: "http://services.arcgisonline.com/arcgis/rest/services/World_Physical_Map/MapServer",
+ });
+ viewer.addBaseLayer(baselayer_street, {
+ iconUrl: "examples/images/icon/ter.png",
+ name: "地形",
+ });
+
+ // eslint-disable-next-line camelcase
+ const baselayer_ter = DC.ImageryLayerFactory.createArcGisImageryLayer({
+ url: "http://services.arcgisonline.com/arcgis/rest/services/World_Terrain_Base/MapServer",
+ });
+ viewer.addBaseLayer(baselayer_ter, {
+ iconUrl: "examples/images/icon/ter.png",
+ name: "地形",
+ });
+
+ const layer = new DC.TilesetLayer("layer");
+ viewer.addLayer(layer);
+ const tileset = new DC.Tileset(
+ "http://resource.dvgis.cn/data/3dtiles/ljz/tileset.json"
+ );
+ const style = new DC.TilesetStyle();
+ style.color = {
+ conditions: [
+ ["${Height} >= 300", "rgba(45, 0, 75, 0.5)"],
+ ["${Height} >= 200", "rgb(102, 71, 151)"],
+ ["${Height} >= 100", "rgb(170, 162, 204)"],
+ ["${Height} >= 50", "rgb(224, 226, 238)"],
+ ["${Height} >= 25", "rgb(252, 230, 200)"],
+ ["${Height} >= 10", "rgb(248, 176, 87)"],
+ ["${Height} >= 5", "rgb(198, 106, 11)"],
+ ["true", "rgb(127, 59, 8)"],
+ ],
+ };
+
+ viewer.use(new DC.Measure());
+
+ tileset.setStyle(style);
+ layer.addOverlay(tileset);
+ viewer.flyTo(tileset);
+
+ tileset.on(DC.MouseEventType.CLICK, (e) => {
+ // that.popupFlag = true
+ that.popupWindow = true;
+
+ console.log(e);
+
+ viewer.scene.globe.depthTestAgainstTerrain = false;
+
+ console.log(document.getElementById("map_content_content"));
+
+ // 定制化窗体
+ var divForms = new DC.divForms(viewer, {
+ domId: "div1",
+ title: "成教楼 ",
+ className: "divForms-dom",
+ content: document.getElementById("map_content_content"),
+ position: [e.position],
+ });
+
+ // popup.setWrapper('<div></div>')
+
+ // popup.showAt(e.position, document.getElementById('modelPopup'))
+ });
+
+ // viewer.zoomToPosition(
+ // new DC.Position(105.565571, 31.984708, 15362816, 0, -90)
+ // )
+
+ viewer.compass.enable = true;
+ viewer.zoomController.enable = true;
+ viewer.locationBar.enable = true;
+ viewer.distanceLegend.enable = true;
+ }
+
+ DC.ready(initViewer);
+ },
+ methods: {
+ once() {
+ // console.log(123);
+ // console.log(global, 123456789);
+ },
+ },
+};
+</script>
+
+<style lang='scss' scope>
+</style>
diff --git a/src/store/modules/viewer.js b/src/store/modules/viewer.js
index dd933ee..5b67119 100644
--- a/src/store/modules/viewer.js
+++ b/src/store/modules/viewer.js
@@ -3,8 +3,8 @@
viewer: null
},
mutations: {
- SET_VIEWER (state, viewer) {
- console.log(viewer, 456)
+ SET_VIEWER(state, viewer) {
+ // console.log(viewer, 456)
state.viewer = viewer
}
},
--
Gitblit v1.9.3