| | |
| | | * @Author: shuishen 1109946754@qq.com |
| | | * @Date: 2022-08-18 17:00:30 |
| | | * @LastEditors: shuishen 1109946754@qq.com |
| | | * @LastEditTime: 2022-12-30 13:59:43 |
| | | * @LastEditTime: 2023-01-29 15:05:17 |
| | | * @FilePath: \srs-police-affairs\src\components\map\index.vue |
| | | * @Description: 公用地图组件 |
| | | * |
| | |
| | | <!-- 全屏控制按钮 --> |
| | | <div class="screen-full-btn"> |
| | | <el-tooltip v-if="isFullscreen" content="缩放" placement="bottom" effect="dark"> |
| | | <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i> |
| | | <i |
| | | class="fa fa-compress" |
| | | style="vertical-align: middle; cursor: pointer" |
| | | @click="fullscreenchange" |
| | | ></i> |
| | | </el-tooltip> |
| | | <el-tooltip v-if="!isFullscreen" content="全屏" placement="bottom" effect="dark"> |
| | | <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i> |
| | | <i |
| | | class="fa fa-expand" |
| | | style="vertical-align: middle; cursor: pointer" |
| | | @click="fullscreenchange" |
| | | ></i> |
| | | </el-tooltip> |
| | | </div> |
| | | <!-- 切换矢量图按钮 --> |
| | | <div class="image-switch-icon-btn" title="切换影像" @mouseover="showImgBtn = true" @mouseleave="showImgBtn = false"> |
| | | <div |
| | | style="display: none !important;" |
| | | class="image-switch-icon-btn" |
| | | title="切换影像" |
| | | @mouseover="showImgBtn = true" |
| | | @mouseleave="showImgBtn = false" |
| | | > |
| | | <div class="icon-box"> |
| | | <img src="/img/base_map.png" alt /> |
| | | </div> |
| | | |
| | | <div class="image-switch-img-btn" v-show="showImgBtn" @mouseover="showImgBtn = true" |
| | | @mouseleave="showImgBtn = false"> |
| | | <div |
| | | class="image-switch-img-btn" |
| | | v-show="showImgBtn" |
| | | @mouseover="showImgBtn = true" |
| | | @mouseleave="showImgBtn = false" |
| | | > |
| | | <div class="img" @click="switchImg"> |
| | | <span :class="{ on: imgtype == 0 }">影像</span> |
| | | </div> |
| | |
| | | global.viewer.addLayer(tilesetLayer) |
| | | |
| | | // 加载围栏 |
| | | let layer = new global.DC.VectorLayer('layer') |
| | | global.viewer.addLayer(layer) |
| | | // let layer = new global.DC.VectorLayer('layer') |
| | | // global.viewer.addLayer(layer) |
| | | |
| | | let wall = new global.DC.Wall( |
| | | '116.018142,28.688089,100.0; 116.017756,28.684648,100.0; 116.019507,28.677570,100.0; 116.033653,28.675634,100.0; 116.034223,28.681389,100.0; 116.033483,28.687265,100.0; 116.018142,28.688089,100.0' |
| | | ) |
| | | // let wall = new global.DC.Wall( |
| | | // '116.018142,28.688089,100.0; 116.017756,28.684648,100.0; 116.019507,28.677570,100.0; 116.033653,28.675634,100.0; 116.034223,28.681389,100.0; 116.033483,28.687265,100.0; 116.018142,28.688089,100.0' |
| | | // ) |
| | | |
| | | wall.setStyle({ |
| | | material: new global.DC.WallTrailMaterialProperty({ |
| | | color: global.DC.Namespace.Cesium.Color.fromBytes( |
| | | 33, 150, 243, |
| | | 200 |
| | | ), |
| | | speed: 8 |
| | | }) |
| | | }) |
| | | layer.addOverlay(wall) |
| | | // wall.setStyle({ |
| | | // material: new global.DC.WallTrailMaterialProperty({ |
| | | // color: global.DC.Namespace.Cesium.Color.fromBytes( |
| | | // 33, 150, 243, |
| | | // 200 |
| | | // ), |
| | | // speed: 8 |
| | | // }) |
| | | // }) |
| | | // layer.addOverlay(wall) |
| | | |
| | | |
| | | |
| | |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | 117.951478782, 28.447896798, 5000 |
| | | 117.951478782, 28.447896798, 20000 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | |
| | | let sqTileset = new global.DC.Tileset( |
| | | 'http://10.141.11.11:18080/sf3d/361102/model/wanda/tileset.json' |
| | | ) |
| | | sqTileset.setHeight(12) |
| | | sqTileset.setHeight(0) |
| | | sqTitleLayer.addOverlay(sqTileset) |
| | | |
| | | // sqTileset.on(global.DC.MouseEventType.CLICK, (e) => { |
| | |
| | | outlineColor: global.DC.Color.WHITE, // 边框颜色 |
| | | outlineWidth: 4, // 边框大小, |
| | | font: '16px sans-serif', |
| | | pixelOffset: { x: 0, y: -24 }, |
| | | pixelOffset: { x: 0, y: -30 }, |
| | | distanceDisplayCondition: distanceDisplayCondition |
| | | }) |
| | | pointElement.attrParams = params |
| | |
| | | } else if (type == 'HeatPoint') { |
| | | layersObjcect[layerName].setPositions(params.positions) |
| | | } |
| | | |
| | | |
| | | }, |
| | | |