fuchengshen
2022-07-09 3a25c05b5ab837714f30469cdcb1e2a77d8d7f6c
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
import * as mars3d from "mars3d"
 
export let map // mars3d.Map三维地图对象
let tileLayer
 
// 需要覆盖config.json中地图属性参数(当前示例框架中自动处理合并)
export const mapOptions = {
  scene: {
    center: { lat: 24.336939, lng: 108.949729, alt: 14990362, heading: 0, pitch: -90 }
  },
  control: {
    // baseLayerPicker: false,
    infoBox: false
  },
  layers: [
    {
      name: "瓦片测试信息",
      type: "tileinfo",
      color: "rgba(255,255,0,0.6)",
      show: true
    }
  ]
}
 
/**
 * 初始化地图业务,生命周期钩子函数(必须)
 * 框架在地图初始化完成后自动调用该函数
 * @param {mars3d.Map} mapInstance 地图对象
 * @returns {void} 无
 */
export function onMounted(mapInstance) {
  map = mapInstance // 记录首次创建的map
 
  map.basemap = "单张图片 (本地离线)"
}
 
/**
 * 释放当前地图业务的生命周期函数
 * @returns {void} 无
 */
export function onUnmounted() {
  map = null
}
 
export const eventTarget = new mars3d.BaseClass() // 事件对象,用于抛出事件到面板中
 
// 加载图层
export function createTileLayer(options) {
  const params = {
    type: options.type, // 类型
    url: options.url, // 图层url
    // subdomains: $("#txtSubdomains").val(), // url子域
    layer: options.txtLayer, // 图层名
 
    crs: options.CRS, // 坐标系信息
    chinaCRS: options.chinaCRS, // 国内坐标系
 
    minimumLevel: options.minLoadLevel, // 最低层级
    maximumLevel: options.maxLoadLevel, // 最高层级
    minimumTerrainLevel: options.minShowLevel, // 展示影像图层的最小地形细节级别
    maximumTerrainLevel: options.maxShowLevel, // 展示影像图层的最大地形细节级别
    brightness: options.brightness, // 亮度
    opacity: options.opacity // 透明度
  }
  // 新增图层
  if (params.error) {
    globalMsg(params.msg)
    return
  }
  if (params.minimumLevel > params.maximumLevel) {
    return { error: true, msg: "最低层级的值不得高于最高层级" }
  }
  if (params.minimumTerrainLevel > params.maximumTerrainLevel) {
    return { error: true, msg: "最小细节的值不得高于最大细节" }
  }
 
  // 移除原有图层
  removeLayer()
 
  // 绘制区域
  const rectangle = options.rectangle
  if (rectangle) {
    params.rectangle = rectangle
  }
 
  // 代理被选中
  if (params.chkProxy) {
    params.proxy = "//server.mars3d.cn/proxy/"
  } else {
    params.proxy = null
  }
 
  console.log("图层参数为", params)
 
  tileLayer = mars3d.LayerUtil.create({
    ...params,
    highlight: {
      clampToGround: true,
      fill: true,
      color: "#2deaf7",
      opacity: 0.6,
      outline: true,
      outlineWidth: 3,
      outlineColor: "#e000d9",
      outlineOpacity: 1.0
    },
    popup: "all",
    flyTo: true
  })
  map.addLayer(tileLayer)
}
 
// 移除并销毁图层
export function removeLayer() {
  if (tileLayer) {
    map.removeLayer(tileLayer, true)
    tileLayer = null
  }
}
 
// 数据更新
export function dataUpdate(params) {
  if (tileLayer) {
    params.flyTo = false
    createTileLayer(params)
  }
}
 
// 绘制和清除区域
export function btnDrawExtent(options) {
  if (tileLayer) {
    tileLayer.rectangle = null
  }
  map.graphicLayer.clear()
  map.graphicLayer.startDraw({
    type: "rectangle",
    style: {
      fill: false,
      outline: true,
      outlineWidth: 3,
      outlineColor: "#ff0000"
    },
    success: function (graphic) {
      const rectangle = mars3d.PolyUtil.formatRectangle(graphic._rectangle_draw)
      options.rectangle = rectangle
      eventTarget.fire("rectangle", { rectangle })
      createTileLayer(options)
    }
  })
}
export function btnClearExtent() {
  map.graphicLayer.clear()
  if (tileLayer) {
    tileLayer.rectangle = null
    tileLayer.options.flyTo = false
    // tileLayer.reload()
  }
}
 
// 修改图层的部分值
export function changeOpacity(val) {
  if (tileLayer) {
    tileLayer.opacity = val
  }
}
export function changeBrightness(val) {
  if (tileLayer) {
    tileLayer.brightness = val
  }
}
 
export function creatHRectangleEntity(item) {
  map.graphicLayer.clear()
  const graphic = new mars3d.graphic.RectangleEntity({
    rectangle: Cesium.Rectangle.fromDegrees(item.xmin, item.ymin, item.xmax, item.ymax),
    style: {
      fill: false,
      outline: true,
      outlineWidth: 3,
      outlineColor: "#ff0000"
    }
  })
  map.graphicLayer.addGraphic(graphic)
 
  graphic.flyTo({ scale: 1.5 })
}