Skip to content

M
mars3d
Commit 579e261d by wanghao
Options

同步代码

parent 13f953d1
正在显示 包含 339 行增加 和 64 行删除
public/lib/mars3d/mars3d.css
/** /**
* Mars3D三维可视化平台 mars3d * Mars3D三维可视化平台 mars3d
* *
* 版本信息：v3.6.13 * 版本信息：v3.6.14
* 编译日期：2023-11-20 21:13:17 * 编译日期：2023-11-28 09:42:10
* 版权所有：Copyright by 火星科技 http://mars3d.cn * 版权所有：Copyright by 火星科技 http://mars3d.cn
* 使用单位：免费公开版 ，2023-03-17 * 使用单位：免费公开版 ，2023-03-17
*/ */
......
public/lib/mars3d/mars3d.d.ts
...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
/** /**
* Mars3D三维可视化平台 mars3d * Mars3D三维可视化平台 mars3d
* *
* 版本信息：v3.6.13 * 版本信息：v3.6.14
* 编译日期：2023-11-20 21:13:16 * 编译日期：2023-11-28 09:42:10
* 版权所有：Copyright by 火星科技 http://mars3d.cn * 版权所有：Copyright by 火星科技 http://mars3d.cn
* 使用单位：免费公开版 ，2023-03-17 * 使用单位：免费公开版 ，2023-03-17
*/ */
...@@ -121,6 +121,36 @@ declare enum CRS { ...@@ -121,6 +121,36 @@ declare enum CRS {
} }
/** /**
* 矢量对象编辑时 拖拽点类型
*/
declare enum EditPointType {
/**
* 位置控制
*/
Control = 1,
/**
* 整体平移(如线面)
*/
MoveAll = 2,
/**
* 辅助增加新点
*/
AddMidPoint = 3,
/**
* 上下移动高度
*/
MoveHeight = 4,
/**
* 辅助修改属性（如半径）
*/
EditAttr = 5,
/**
* 旋转角度修改
*/
EditRotation = 6
}
/**
* 特效类型 * 特效类型
*/ */
declare enum EffectType { declare enum EffectType {
...@@ -31118,7 +31148,7 @@ declare namespace SatelliteSensor { ...@@ -31118,7 +31148,7 @@ declare namespace SatelliteSensor {
* @property [heading = 0] - 方向角 （角度值 0-360） * @property [heading = 0] - 方向角 （角度值 0-360）
* @property [pitch = 0] - 俯仰角（角度值 0-360） * @property [pitch = 0] - 俯仰角（角度值 0-360）
* @property [roll = 0] - 翻滚角（角度值 0-360） * @property [roll = 0] - 翻滚角（角度值 0-360）
* @property [color = Cesium.Color.YELLOW] - 颜色 * @property [color = "rgba(255,255,0,0.4)"] - 颜色
* @property [opacity = 1.0] - 透明度, 取值范围：0.0-1.0 * @property [opacity = 1.0] - 透明度, 取值范围：0.0-1.0
* @property [outline = false] - 是否显示边线 * @property [outline = false] - 是否显示边线
* @property [outlineColor = color] - 边线颜色 * @property [outlineColor = color] - 边线颜色
...@@ -34300,7 +34330,7 @@ declare class TilesetBoxClip extends BaseThing { ...@@ -34300,7 +34330,7 @@ declare class TilesetBoxClip extends BaseThing {
* @param options.layer - 需要裁剪的对象（3dtiles图层） * @param options.layer - 需要裁剪的对象（3dtiles图层）
* @param [options.area] - 多区域数组对象, 示例： [{ positions: [[108.959062, 34.220134, 397], [108.959802, 34.220147, 397], [108.959106, 34.21953, 398]] }] * @param [options.area] - 多区域数组对象, 示例： [{ positions: [[108.959062, 34.220134, 397], [108.959802, 34.220147, 397], [108.959106, 34.21953, 398]] }]
* @param [options.clipOutSide = false] - 是否外裁剪 * @param [options.clipOutSide = false] - 是否外裁剪
* @param [options.precise = false] - true:精确模式, 直接存储范围,但传入的范围顶点数量多时，就会造成一定程度的卡顿； false: 掩膜模式，栅格化范围,效率与范围顶点数量无关,但放大后锯齿化严重 * @param [options.precise = true] - true:精确模式, 直接存储范围,但传入的范围顶点数量多时，就会造成一定程度的卡顿； false: 掩膜模式，栅格化范围,效率与范围顶点数量无关,但放大后锯齿化严重
* @param [options.id = createGuid()] - 对象的id标识 * @param [options.id = createGuid()] - 对象的id标识
* @param [options.enabled = true] - 对象的启用状态 * @param [options.enabled = true] - 对象的启用状态
* @param [options.eventParent] - 指定的事件冒泡对象，默认为所加入的map对象，false时不冒泡事件 * @param [options.eventParent] - 指定的事件冒泡对象，默认为所加入的map对象，false时不冒泡事件
...@@ -34322,7 +34352,7 @@ declare class TilesetClip extends TilesetEditBase { ...@@ -34322,7 +34352,7 @@ declare class TilesetClip extends TilesetEditBase {
* @param [options] - 参数对象，包括以下： * @param [options] - 参数对象，包括以下：
* @param options.layer - 需要模型分析的对象（3dtiles图层） * @param options.layer - 需要模型分析的对象（3dtiles图层）
* @param [options.area] - 多区域数组对象, 示例： [{ positions: [[108.959062, 34.220134, 397], [108.959802, 34.220147, 397], [108.959106, 34.21953, 398]] }] * @param [options.area] - 多区域数组对象, 示例： [{ positions: [[108.959062, 34.220134, 397], [108.959802, 34.220147, 397], [108.959106, 34.21953, 398]] }]
* @param [options.precise = false] - true:精确模式, 直接存储范围,但传入的范围顶点数量多时，就会造成一定程度的卡顿； false: 掩膜模式，栅格化范围,效率与范围顶点数量无关,但放大后锯齿化严重 * @param [options.precise = true] - true:精确模式, 直接存储范围,但传入的范围顶点数量多时，就会造成一定程度的卡顿； false: 掩膜模式，栅格化范围,效率与范围顶点数量无关,但放大后锯齿化严重
* @param [options.id = createGuid()] - 对象的id标识 * @param [options.id = createGuid()] - 对象的id标识
* @param [options.enabled = true] - 对象的启用状态 * @param [options.enabled = true] - 对象的启用状态
* @param [options.eventParent] - 指定的事件冒泡对象，默认为所加入的map对象，false时不冒泡事件 * @param [options.eventParent] - 指定的事件冒泡对象，默认为所加入的map对象，false时不冒泡事件
...@@ -34418,7 +34448,7 @@ declare class TilesetEditBase extends BaseThing { ...@@ -34418,7 +34448,7 @@ declare class TilesetEditBase extends BaseThing {
* @param [options.area] - 多区域数组对象, 示例： [{ positions: [[108.959062, 34.220134, 397], [108.959802, 34.220147, 397], [108.959106, 34.21953, 398]] }] * @param [options.area] - 多区域数组对象, 示例： [{ positions: [[108.959062, 34.220134, 397], [108.959802, 34.220147, 397], [108.959106, 34.21953, 398]] }]
* @param [options.editHeight] - 模型基准高度(单位：米)，基于压平/淹没区域最低点高度的纠偏，也支持定义在模型图层中 * @param [options.editHeight] - 模型基准高度(单位：米)，基于压平/淹没区域最低点高度的纠偏，也支持定义在模型图层中
* @param [options.raise = true] - 是否开启区域抬高 * @param [options.raise = true] - 是否开启区域抬高
* @param [options.precise = false] - true:精确模式, 直接存储范围,但传入的范围顶点数量多时，就会造成一定程度的卡顿； false: 掩膜模式，栅格化范围,效率与范围顶点数量无关,但放大后锯齿化严重 * @param [options.precise = true] - true:精确模式, 直接存储范围,但传入的范围顶点数量多时，就会造成一定程度的卡顿； false: 掩膜模式，栅格化范围,效率与范围顶点数量无关,但放大后锯齿化严重
* @param [options.id = createGuid()] - 对象的id标识 * @param [options.id = createGuid()] - 对象的id标识
* @param [options.enabled = true] - 对象的启用状态 * @param [options.enabled = true] - 对象的启用状态
* @param [options.eventParent] - 指定的事件冒泡对象，默认为所加入的map对象，false时不冒泡事件 * @param [options.eventParent] - 指定的事件冒泡对象，默认为所加入的map对象，false时不冒泡事件
...@@ -34491,7 +34521,7 @@ declare namespace TilesetFlood { ...@@ -34491,7 +34521,7 @@ declare namespace TilesetFlood {
* @param [options.color = new Cesium.Color(0.15, 0.7, 0.95, 0.5)] - 淹没颜色 * @param [options.color = new Cesium.Color(0.15, 0.7, 0.95, 0.5)] - 淹没颜色
* @param [options.floodAll] - 是否对整个模型进行分析 * @param [options.floodAll] - 是否对整个模型进行分析
* @param [options.limitMin = false] - 显示效果中是否不显示最低高度以下的部分颜色 * @param [options.limitMin = false] - 显示效果中是否不显示最低高度以下的部分颜色
* @param [options.precise = false] - true:精确模式, 直接存储范围,但传入的范围顶点数量多时，就会造成一定程度的卡顿； false: 掩膜模式，栅格化范围,效率与范围顶点数量无关,但放大后锯齿化严重 * @param [options.precise = true] - true:精确模式, 直接存储范围,但传入的范围顶点数量多时，就会造成一定程度的卡顿； false: 掩膜模式，栅格化范围,效率与范围顶点数量无关,但放大后锯齿化严重
* @param [options.id = createGuid()] - 对象的id标识 * @param [options.id = createGuid()] - 对象的id标识
* @param [options.enabled = true] - 对象的启用状态 * @param [options.enabled = true] - 对象的启用状态
* @param [options.eventParent] - 指定的事件冒泡对象，默认为所加入的map对象，false时不冒泡事件 * @param [options.eventParent] - 指定的事件冒泡对象，默认为所加入的map对象，false时不冒泡事件
...@@ -35360,25 +35390,31 @@ declare namespace DomUtil { ...@@ -35360,25 +35390,31 @@ declare namespace DomUtil {
*/ */
declare namespace DrawUtil { declare namespace DrawUtil {
/** /**
* 拖拽点分类 * 根据类型设置编辑点的样式
*/
const PointType: number;
/**
* 拖拽点颜色
* @example * @example
* mars3d.DrawUtil.PointColor.Control = '#1c197d' //位置控制拖拽点 * mars3d.DrawUtil.setEditPointStyle(mars3d.EditPointType.Control, {
* mars3d.DrawUtil.PointColor.MoveAll = '#8c003a' //整体平移(如线面)拖拽点 * type: mars3d.GraphicType.billboardP, // 支持设置type指定编辑点类型
* mars3d.DrawUtil.PointColor.MoveHeight = '#9500eb' //上下移动高度的拖拽点 * image: "img/icon/move.png",
* mars3d.DrawUtil.PointColor.EditAttr = '#f73163' //辅助修改属性（如半径）的拖拽点 * horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
* mars3d.DrawUtil.PointColor.AddMidPoint = 'rgba(4,194,201,0.3)' //增加新点，辅助拖拽点 * verticalOrigin: Cesium.VerticalOrigin.CENTER
* })
* @param type - 类型
* @param newStyle - 样式
* @returns 无
*/ */
const PointColor: Cesium.Color; function setEditPointStyle(type: EditPointType | number, newStyle: PointPrimitive.StyleOptions | any | any): void;
/** /**
* 设置编辑点的样式（color颜色除外） * 更新所有编辑点的样式
* @param value - 像素 * @param style - 样式
* @returns 无 * @returns 无
*/ */
function setPointStyle(value: PointPrimitive.StyleOptions | any): void; function setAllEditPointStyle(style: PointPrimitive.StyleOptions | any | any): void;
/**
* 根据类型获取编辑点样式
* @param [type = mars3d.EditPointType.Control] - 类型
* @returns 样式对象
*/
function getEditPointStyle(type?: EditPointType | number): PointPrimitive.StyleOptions | any | any;
} }
/** /**
...@@ -37701,7 +37737,7 @@ declare namespace thing { ...@@ -37701,7 +37737,7 @@ declare namespace thing {
export { export {
name, update, version, proj4, Tle, name, update, version, proj4, Tle,
BaseClass, BaseThing, LngLatPoint, LngLatArray, GroundSkyBox, MultipleSkyBox, LocalWorldTransform, CRS, ChinaCRS, EventType, State, Token, ColorRamp, MaterialType, GraphicType, LayerType, ControlType, EffectType, Lang, MoveType, ClipType, Icon, BaseClass, BaseThing, LngLatPoint, LngLatArray, GroundSkyBox, MultipleSkyBox, LocalWorldTransform, CRS, ChinaCRS, EventType, State, Token, ColorRamp, MaterialType, GraphicType, LayerType, ControlType, EffectType, Lang, MoveType, ClipType, Icon, EditPointType,
DomUtil, MeasureUtil, PointUtil, PolyUtil, PointTrans, Util, Log, MaterialUtil, GraphicUtil, DrawUtil, LayerUtil, ControlUtil, EffectUtil, DomUtil, MeasureUtil, PointUtil, PolyUtil, PointTrans, Util, Log, MaterialUtil, GraphicUtil, DrawUtil, LayerUtil, ControlUtil, EffectUtil,
BaseMaterialConver, BaseStyleConver, BillboardStyleConver, CloudStyleConver, BoxStyleConver, CircleStyleConver, CorridorStyleConver, CylinderStyleConver, DivGraphicStyleConver, EllipsoidStyleConver, LabelStyleConver, ModelStyleConver, PathStyleConver, PlaneStyleConver, PointStyleConver, PolygonStyleConver, PolylineStyleConver, PolylineVolumeStyleConver, RectangleStyleConver, RectangularSensorStyleConver, WallStyleConver, BaseMaterialConver, BaseStyleConver, BillboardStyleConver, CloudStyleConver, BoxStyleConver, CircleStyleConver, CorridorStyleConver, CylinderStyleConver, DivGraphicStyleConver, EllipsoidStyleConver, LabelStyleConver, ModelStyleConver, PathStyleConver, PlaneStyleConver, PointStyleConver, PolygonStyleConver, PolylineStyleConver, PolylineVolumeStyleConver, RectangleStyleConver, RectangularSensorStyleConver, WallStyleConver,
material, graphic, edit, provider, layer, thing, effect, control, query, material, graphic, edit, provider, layer, thing, effect, control, query,
public/lib/mars3d/mars3d.js
This source diff could not be displayed because it is too large. You can view the blob instead.
public/lib/mars3d/plugins/space/mars3d-space.js
This source diff could not be displayed because it is too large. You can view the blob instead.
public/lib/mars3d/plugins/tdt/mars3d-tdt.js
This source diff could not be displayed because it is too large. You can view the blob instead.
public/lib/mars3d/plugins/wind/mars3d-wind.js
This source diff could not be displayed because it is too large. You can view the blob instead.
src/example/graphic/entity/arrow/EditCurve.js
...@@ -40,7 +40,7 @@ class EditCurve extends mars3d.edit.EditBase { ...@@ -40,7 +40,7 @@ class EditCurve extends mars3d.edit.EditBase {
const draggerMid = this.createDragger({ const draggerMid = this.createDragger({
position: midpoint, position: midpoint,
type: mars3d.DrawUtil.PointType.AddMidPoint, type: mars3d.EditPointType.AddMidPoint,
tooltip: this._map.getLangText("_增加点"), tooltip: this._map.getLangText("_增加点"),
onDragStart: (dragger, position) => { onDragStart: (dragger, position) => {
this.positions.splice(dragger.index, 0, position) // 插入点 this.positions.splice(dragger.index, 0, position) // 插入点
...@@ -62,7 +62,7 @@ class EditCurve extends mars3d.edit.EditBase { ...@@ -62,7 +62,7 @@ class EditCurve extends mars3d.edit.EditBase {
const draggerMid2 = this.createDragger({ const draggerMid2 = this.createDragger({
position: midpoint2, position: midpoint2,
type: mars3d.DrawUtil.PointType.AddMidPoint, type: mars3d.EditPointType.AddMidPoint,
tooltip: this._map.getLangText("_增加点"), tooltip: this._map.getLangText("_增加点"),
onDragStart: (dragger, position) => { onDragStart: (dragger, position) => {
this.positions.splice(dragger.index, 0, position) // 插入点 this.positions.splice(dragger.index, 0, position) // 插入点
...@@ -99,7 +99,7 @@ class EditCurve extends mars3d.edit.EditBase { ...@@ -99,7 +99,7 @@ class EditCurve extends mars3d.edit.EditBase {
const draggerMove = this.createDragger({ const draggerMove = this.createDragger({
position: positionMove, position: positionMove,
type: mars3d.DrawUtil.PointType.MoveAll, type: mars3d.EditPointType.MoveAll,
tooltip: this._map.getLangText("_整体平移"), tooltip: this._map.getLangText("_整体平移"),
onDragStart: (dragger, position) => { onDragStart: (dragger, position) => {
positionMove = position positionMove = position
......
src/example/graphic/entity/circle/map.js
...@@ -41,7 +41,7 @@ export function onMounted(mapInstance) { ...@@ -41,7 +41,7 @@ export function onMounted(mapInstance) {
addDemoGraphic6(graphicLayer) addDemoGraphic6(graphicLayer)
addDemoGraphic7(graphicLayer) addDemoGraphic7(graphicLayer)
addDemoGraphic8(graphicLayer) addDemoGraphic8(graphicLayer)
// addDemoGraphic9(graphicLayer) addDemoGraphic9(graphicLayer)
addDemoGraphic10(graphicLayer) addDemoGraphic10(graphicLayer)
addDemoGraphic11(graphicLayer) addDemoGraphic11(graphicLayer)
addDemoGraphic12(graphicLayer) addDemoGraphic12(graphicLayer)
...@@ -345,29 +345,138 @@ function addDemoGraphic8(graphicLayer) { ...@@ -345,29 +345,138 @@ function addDemoGraphic8(graphicLayer) {
function addDemoGraphic9(graphicLayer) { function addDemoGraphic9(graphicLayer) {
let lastPosition let lastPosition
let lastHeight = 0
const circleEntity = new mars3d.graphic.CircleEntity({ const circleEntity = new mars3d.graphic.CircleEntity({
position: new Cesium.CallbackProperty(function (time) { position: new Cesium.CallbackProperty(function (time) {
const center = map.getCenter()
if (center) {
lastHeight = center.alt + 10
lastPosition = center.toCartesian()
}
return lastPosition return lastPosition
}, false), }, false),
style: { style: {
material: "img/tietu/bagua.png", material: getMarsCanves(),
radius: 500, radius: 500,
// height: new Cesium.CallbackProperty(function (time) {
// return lastHeight
// }, false)
clampToGround: true clampToGround: true
}, },
attr: { remark: "示例9" }, attr: { remark: "示例9" },
hasEdit: false hasEdit: false
}) })
graphicLayer.addGraphic(circleEntity) graphicLayer.addGraphic(circleEntity)
map.on(mars3d.EventType.mouseMove, function (event) {
lastPosition = event.cartesian
})
}
function getMarsCanves() {
// 获取画布元素
const canvas = document.createElement("canvas")
canvas.width = 400
canvas.height = 400
canvas.style = "border: 1px solid red;background:orange"
const ctx = canvas.getContext("2d")
// 设置圆的半径和中心点坐标
const centerX = canvas.width / 2
const centerY = canvas.height / 2
const radius = Math.min(centerX, centerY) - 20
// 绘制空心圆
ctx.translate(centerX, centerY) // 平移到圆心
ctx.rotate(Math.PI) // 旋转180度
ctx.beginPath()
ctx.arc(0, 0, radius, 0, 2 * Math.PI)
ctx.strokeStyle = "transparent"
ctx.lineWidth = 2
ctx.stroke()
// 绘制刻度
const numTicks = 360 // 总刻度数
let tickLength = 10 // 刻度长度
for (let i = 0; i < numTicks; i++) {
ctx.save()
const angle = ((i - numTicks / 2) * (Math.PI * 2)) / numTicks - Math.PI / 2
// let angle = ((2 * Math.PI) / numTicks) * i - Math.PI / 2; // 计算刻度线的角度
// 计算文本的角度
let textAngle = angle + Math.PI * 1.75
ctx.rotate(angle) // 计算旋转角度
// ctx.rotate((Math.PI * 2 * i) / numTicks); // 计算旋转角度
ctx.beginPath()
// 绘制刻度线、标注刻度文本
if (i % 5 === 0 && (i / 5) % 2 !== 0) {
tickLength = 15 // 修改刻度长度
} else if (i % 5 === 0 && (i / 5) % 2 === 0) {
tickLength = 20
} else {
tickLength = 10
}
ctx.moveTo(radius, 0) // 刻度线起点
ctx.lineTo(radius - tickLength, 0) // 刻度线终点
ctx.translate(radius - tickLength - 10, 0)
let magnification = 2
// 判断各个刻度的角度
switch (i) {
case 0:
textAngle = angle + Math.PI * magnification
break
case 45:
magnification = 1.75
textAngle = angle + Math.PI * magnification
break
case 90:
magnification = 1.5
textAngle = angle + Math.PI * magnification
break
case 135:
magnification = 1.25
textAngle = angle + Math.PI * magnification
break
case 180:
magnification = 1
textAngle = angle + Math.PI * magnification
break
case 225:
magnification = 0.75
textAngle = angle + Math.PI * magnification
break
case 270:
magnification = 0.5
textAngle = angle + Math.PI * magnification
break
case 315:
magnification = 0.25
textAngle = angle + Math.PI * magnification
break
case 360:
magnification = 0
textAngle = angle + Math.PI * magnification
break
default:
break
}
ctx.rotate(textAngle)
ctx.textAlign = "center"
ctx.font = "14px Arial"
ctx.fillStyle = "#ffffff"
if (i > -1 && i <= 180) {
ctx.strokeStyle = "red"
} else {
ctx.strokeStyle = "blue"
}
ctx.stroke()
// // 修改刻度文本的位置
if (i % 45 === 0 && i <= 180) {
ctx.fillText(i, 0, 5) // 顺时针角度刻度数
} else if (i % 45 === 0 && i > 180) {
if (i < 270) {
ctx.fillText(i - 90, 0, 5)
} else if (i === 270) {
ctx.fillText(i - 180, 0, 5)
} else if (i > 270) {
ctx.fillText(360 - i, 0, 5)
}
}
ctx.restore()
}
return canvas
} }
function addDemoGraphic10(graphicLayer) { function addDemoGraphic10(graphicLayer) {
......
src/example/layer-graphic/draw/draw/map.js
...@@ -50,6 +50,14 @@ export const eventTarget = new mars3d.BaseClass() ...@@ -50,6 +50,14 @@ export const eventTarget = new mars3d.BaseClass()
export function onMounted(mapInstance) { export function onMounted(mapInstance) {
map = mapInstance // 记录map map = mapInstance // 记录map
// 设置编辑点样式
// mars3d.DrawUtil.setEditPointStyle(mars3d.EditPointType.Control, {
// type: mars3d.GraphicType.billboardP, // 支持设置type指定编辑点类型
// image: "img/icon/move.png",
// horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
// verticalOrigin: Cesium.VerticalOrigin.CENTER
// })
graphicLayer = new mars3d.layer.GraphicLayer({ graphicLayer = new mars3d.layer.GraphicLayer({
// isRestorePositions: true, // isRestorePositions: true,
hasEdit: true, hasEdit: true,
...@@ -397,6 +405,29 @@ export function drawExtrudedCircle() { ...@@ -397,6 +405,29 @@ export function drawExtrudedCircle() {
}) })
} }
export function drawSatellite() {
graphicLayer
.startDraw({
type: "satellite",
style: {
tle1: "1 39150U 13018A 21180.50843864 .00000088 00000-0 19781-4 0 9997",
tle2: "2 39150 97.8300 252.9072 0018449 344.7422 15.3253 14.76581022440650",
path_show: true,
path_color: "#00ff00",
path_width: 1,
model_show: true,
model_url: "//data.mars3d.cn/gltf/mars/weixin.gltf",
model_scale: 1,
model_minimumPixelSize: 90
}
})
.then((graphic) => {
setTimeout(() => {
graphic.flyToPoint()
}, 100)
})
}
// 在图层绑定Popup弹窗 // 在图层绑定Popup弹窗
export function bindLayerPopup() { export function bindLayerPopup() {
graphicLayer.bindPopup(function (event) { graphicLayer.bindPopup(function (event) {
......
src/example/layer-tileset/manager/edit/map.js
...@@ -3,6 +3,32 @@ import * as mars3d from "mars3d" ...@@ -3,6 +3,32 @@ import * as mars3d from "mars3d"
export let map // mars3d.Map三维地图对象 export let map // mars3d.Map三维地图对象
export let tiles3dLayer export let tiles3dLayer
// 需要覆盖config.json中地图属性参数（当前示例框架中自动处理合并）
export const mapOptions = {
scene: {
showSun: false,
showMoon: false,
showSkyBox: false,
showSkyAtmosphere: false,
fog: false,
backgroundColor: "#363635", // 天空背景色
globe: {
baseColor: "#363635", // 地球地面背景色
showGroundAtmosphere: false,
enableLighting: false
},
clock: {
currentTime: "2023-11-01 12:00:00" // 固定光照时间
},
cameraController: {
zoomFactor: 1.5,
minimumZoomDistance: 0.1,
maximumZoomDistance: 200000,
enableCollisionDetection: false // 允许进入地下
}
}
}
// 自定义事件 // 自定义事件
export const eventTarget = new mars3d.BaseClass() // 事件对象，用于抛出事件到面板中 export const eventTarget = new mars3d.BaseClass() // 事件对象，用于抛出事件到面板中
...@@ -16,10 +42,6 @@ export function onMounted(mapInstance) { ...@@ -16,10 +42,6 @@ export function onMounted(mapInstance) {
map = mapInstance // 记录map map = mapInstance // 记录map
map.fixedLight = true // 固定光照，避免gltf模型随时间存在亮度不一致。 map.fixedLight = true // 固定光照，避免gltf模型随时间存在亮度不一致。
// 固定光照时间
map.clock.currentTime = Cesium.JulianDate.fromDate(new Date("2022-11-01 12:00:00"))
// map.clock.shouldAnimate = false
// 固定光照方向 // 固定光照方向
map.scene.light = new Cesium.DirectionalLight({ map.scene.light = new Cesium.DirectionalLight({
direction: map.scene.camera.direction direction: map.scene.camera.direction
......
src/example/layer-tileset/manager/oneself/map.js
...@@ -16,16 +16,20 @@ export const mapOptions = function (option) { ...@@ -16,16 +16,20 @@ export const mapOptions = function (option) {
showSkyAtmosphere: false, showSkyAtmosphere: false,
fog: false, fog: false,
backgroundColor: "#363635", // 天空背景色 backgroundColor: "#363635", // 天空背景色
contextOptions: { webgl: { antialias: !mobilecheck() } },
globe: { globe: {
baseColor: "#363635", // 地球地面背景色 baseColor: "#363635", // 地球地面背景色
showGroundAtmosphere: false, showGroundAtmosphere: false,
enableLighting: false enableLighting: false
}, },
clock: {
currentTime: "2023-11-01 12:00:00" // 固定光照时间
},
cameraController: { cameraController: {
zoomFactor: 1.5, zoomFactor: 1.5,
minimumZoomDistance: 0.1, minimumZoomDistance: 0.1,
maximumZoomDistance: 200000, maximumZoomDistance: 200000,
enableCollisionDetection: false enableCollisionDetection: false // 允许进入地下
} }
}, },
control: { control: {
...@@ -53,6 +57,8 @@ export const mapOptions = function (option) { ...@@ -53,6 +57,8 @@ export const mapOptions = function (option) {
return option return option
} }
const storageName = "layer-tileset-manager-oneself"
/** /**
* 初始化地图业务，生命周期钩子函数（必须） * 初始化地图业务，生命周期钩子函数（必须）
* 框架在地图初始化完成后自动调用该函数 * 框架在地图初始化完成后自动调用该函数
...@@ -61,6 +67,30 @@ export const mapOptions = function (option) { ...@@ -61,6 +67,30 @@ export const mapOptions = function (option) {
*/ */
export function onMounted(mapInstance) { export function onMounted(mapInstance) {
map = mapInstance // 记录map map = mapInstance // 记录map
map.fixedLight = true // 固定光照，避免gltf模型随时间存在亮度不一致。
// 固定光照方向
map.scene.light = new Cesium.DirectionalLight({
direction: map.scene.camera.direction
})
map.camera.percentageChanged = 0.001
map.on(mars3d.EventType.cameraChanged, function (event) {
map.scene.light.direction = map.scene.camera.direction
})
// 如果模型地址内有“+”符号，可以加下面方法进行自定义处理
Cesium.Resource.ReplaceUrl = function (url) {
if (url.endsWith(".json") || url.endsWith(".b3dm")) {
return url.replace(/\+/gm, "%2B") // 将3dtiles中的“+”符号转义下
} else {
return url
}
}
// 读取localStorage值
localforage.getItem(storageName).then(function (lastUrl) {
eventTarget.fire("historyUrl", { url: lastUrl })
})
} }
/** /**
...@@ -87,14 +117,14 @@ function removeLayer() { ...@@ -87,14 +117,14 @@ function removeLayer() {
} }
// 当前页面业务相关 // 当前页面业务相关
export function showModel(_url) { export function showModel(url) {
removeLayer() removeLayer()
if (!_url) { if (!url) {
return return
} }
tiles3dLayer = new mars3d.layer.TilesetLayer({ tiles3dLayer = new mars3d.layer.TilesetLayer({
url: _url, url,
maximumScreenSpaceError: 1, maximumScreenSpaceError: 1,
flyTo: true flyTo: true
}) })
...@@ -103,6 +133,7 @@ export function showModel(_url) { ...@@ -103,6 +133,7 @@ export function showModel(_url) {
// 单击事件 // 单击事件
tiles3dLayer.on(mars3d.EventType.load, function (event) { tiles3dLayer.on(mars3d.EventType.load, function (event) {
console.log("模型加载完成", event) console.log("模型加载完成", event)
localforage.setItem(storageName, url) // 记录历史值
// 限定缩放级别 // 限定缩放级别
map.scene.screenSpaceCameraController.maximumZoomDistance = tiles3dLayer.boundingSphere.radius * 5 map.scene.screenSpaceCameraController.maximumZoomDistance = tiles3dLayer.boundingSphere.radius * 5
...@@ -120,3 +151,20 @@ export function showModel(_url) { ...@@ -120,3 +151,20 @@ export function showModel(_url) {
export function flyTo() { export function flyTo() {
tiles3dLayer.flyTo() tiles3dLayer.flyTo()
} }
function mobilecheck() {
let check = false
;(function (a) {
if (
/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(
a
) ||
/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(
a.substr(0, 4)
)
) {
check = true
}
})(navigator.userAgent || navigator.vendor || window.opera)
return check
}
src/example/layer-tileset/manager/oneself2/map.js
...@@ -22,11 +22,14 @@ export const mapOptions = function (option) { ...@@ -22,11 +22,14 @@ export const mapOptions = function (option) {
showGroundAtmosphere: false, showGroundAtmosphere: false,
enableLighting: false enableLighting: false
}, },
clock: {
currentTime: "2023-11-01 12:00:00" // 固定光照时间
},
cameraController: { cameraController: {
zoomFactor: 1.5, zoomFactor: 1.5,
minimumZoomDistance: 0.1, minimumZoomDistance: 0.1,
maximumZoomDistance: 200000, maximumZoomDistance: 200000,
enableCollisionDetection: false enableCollisionDetection: false // 允许进入地下
} }
}, },
control: { control: {
...@@ -45,6 +48,8 @@ export const mapOptions = function (option) { ...@@ -45,6 +48,8 @@ export const mapOptions = function (option) {
return option return option
} }
const storageName = "layer-tileset-manager-oneself"
/** /**
* 初始化地图业务，生命周期钩子函数（必须） * 初始化地图业务，生命周期钩子函数（必须）
* 框架在地图初始化完成后自动调用该函数 * 框架在地图初始化完成后自动调用该函数
...@@ -53,10 +58,25 @@ export const mapOptions = function (option) { ...@@ -53,10 +58,25 @@ export const mapOptions = function (option) {
*/ */
export function onMounted(mapInstance) { export function onMounted(mapInstance) {
map = mapInstance // 记录map map = mapInstance // 记录map
map.fixedLight = true // 固定光照，避免gltf模型随时间存在亮度不一致。
map.container.style.backgroundImage = "url(/img/tietu/backGroundImg.jpg)" map.container.style.backgroundImage = "url(/img/tietu/backGroundImg.jpg)"
map.container.style.backgroundRepeat = "no-repeat" map.container.style.backgroundRepeat = "no-repeat"
map.container.style.backgroundSize = "100% 100%" map.container.style.backgroundSize = "100% 100%"
// 如果模型地址内有“+”符号，可以加下面方法进行自定义处理
Cesium.Resource.ReplaceUrl = function (url) {
if (url.endsWith(".json") || url.endsWith(".b3dm")) {
return url.replace(/\+/gm, "%2B") // 将3dtiles中的“+”符号转义下
} else {
return url
}
}
// 读取localStorage值
localforage.getItem(storageName).then(function (lastUrl) {
eventTarget.fire("historyUrl", { url: lastUrl })
})
} }
/** /**
...@@ -75,14 +95,14 @@ function removeLayer() { ...@@ -75,14 +95,14 @@ function removeLayer() {
} }
// 当前页面业务相关 // 当前页面业务相关
export function showModel(_url) { export function showModel(url) {
removeLayer() removeLayer()
if (!_url) { if (!url) {
return return
} }
tiles3dLayer = new mars3d.layer.TilesetLayer({ tiles3dLayer = new mars3d.layer.TilesetLayer({
url: _url, url,
maximumScreenSpaceError: 1, maximumScreenSpaceError: 1,
flyTo: true flyTo: true
}) })
...@@ -91,6 +111,7 @@ export function showModel(_url) { ...@@ -91,6 +111,7 @@ export function showModel(_url) {
// 单击事件 // 单击事件
tiles3dLayer.on(mars3d.EventType.load, function (event) { tiles3dLayer.on(mars3d.EventType.load, function (event) {
console.log("模型加载完成", event) console.log("模型加载完成", event)
localforage.setItem(storageName, url) // 记录历史值
// 限定缩放级别 // 限定缩放级别
map.scene.screenSpaceCameraController.maximumZoomDistance = tiles3dLayer.boundingSphere.radius * 5 map.scene.screenSpaceCameraController.maximumZoomDistance = tiles3dLayer.boundingSphere.radius * 5
......
src/example/layer-tileset/monomer/building-edit/map.js
...@@ -62,7 +62,7 @@ export function onMounted(mapInstance) { ...@@ -62,7 +62,7 @@ export function onMounted(mapInstance) {
}) })
map.addLayer(geoJsonLayerDTH) map.addLayer(geoJsonLayerDTH)
mars3d.DrawUtil.setPointStyle({ has3dtiles: true })// 编辑点贴模型 mars3d.DrawUtil.setEditPointStyle(mars3d.EditPointType.Control, { has3dtiles: true })// 编辑点贴模型
graphicLayer = new mars3d.layer.GraphicLayer({ graphicLayer = new mars3d.layer.GraphicLayer({
hasEdit: true, hasEdit: true,
......
src/example/layer-tileset/type/osmBuildings/map.js
...@@ -7,6 +7,10 @@ let tiles3dLayer ...@@ -7,6 +7,10 @@ let tiles3dLayer
export const mapOptions = { export const mapOptions = {
scene: { scene: {
center: { lat: 31.2322, lng: 121.44363, alt: 1989, heading: 87, pitch: -25 } center: { lat: 31.2322, lng: 121.44363, alt: 1989, heading: 87, pitch: -25 }
},
control: {
baseLayerPicker: true,
terrainProviderViewModels: mars3d.LayerUtil.getTerrainProviderViewModels()
} }
} }
......
src/example/map/double/compare/map.js
...@@ -33,12 +33,20 @@ export const mapOptions = { ...@@ -33,12 +33,20 @@ export const mapOptions = {
export function onMounted(mapInstance) { export function onMounted(mapInstance) {
map = mapInstance // 记录map map = mapInstance // 记录map
// addTestData()
createControl() createControl()
// 双击销毁 map.on(mars3d.EventType.addLayer, function (event) {
map.on(mars3d.EventType.dblClick, () => {}) const mapEx = mapSplit.mapEx
if (mapEx) {
const layerOptions = event.layer.toJSON() // 转为参数
const newLayer = mars3d.LayerUtil.create(layerOptions) // 创建图层
mapEx.addLayer(newLayer)
}
})
setTimeout(() => {
addTestData()
}, 10000)
} }
/** /**
...@@ -53,6 +61,7 @@ export function createControl() { ...@@ -53,6 +61,7 @@ export function createControl() {
if (mapSplit) { if (mapSplit) {
return return
} }
// 修改已有地图为50% // 修改已有地图为50%
const mapOld = document.getElementById("centerDiv3D") const mapOld = document.getElementById("centerDiv3D")
mapOld.style.width = "50%" mapOld.style.width = "50%"
...@@ -93,9 +102,6 @@ export function destroyControl() { ...@@ -93,9 +102,6 @@ export function destroyControl() {
} }
function addTestData() { function addTestData() {
const groupLayer = new mars3d.layer.GroupLayer({
name: "组图层"
})
const layer = new mars3d.layer.TilesetLayer({ const layer = new mars3d.layer.TilesetLayer({
name: "测试模型2", name: "测试模型2",
url: "//data.mars3d.cn/3dtiles/bim-daxue/tileset.json", url: "//data.mars3d.cn/3dtiles/bim-daxue/tileset.json",
...@@ -105,7 +111,5 @@ function addTestData() { ...@@ -105,7 +111,5 @@ function addTestData() {
dynamicScreenSpaceError: true, dynamicScreenSpaceError: true,
cullWithChildrenBounds: false cullWithChildrenBounds: false
}) })
groupLayer.addLayer(layer) map.addLayer(layer)
map.addLayer(groupLayer)
} }
src/example/thing/analysis/measure/map.js
...@@ -13,7 +13,7 @@ export function onMounted(mapInstance) { ...@@ -13,7 +13,7 @@ export function onMounted(mapInstance) {
map = mapInstance // 记录map map = mapInstance // 记录map
// 修改编辑点样式，比如大小 // 修改编辑点样式，比如大小
mars3d.DrawUtil.setPointStyle({ pixelSize: 14 }) mars3d.DrawUtil.setAllEditPointStyle({ pixelSize: 14 })
measure = new mars3d.thing.Measure({ measure = new mars3d.thing.Measure({
label: { label: {
......
src/example/thing/tileset/tilesetClip/map.js
...@@ -47,7 +47,7 @@ export function showDytDemo() { ...@@ -47,7 +47,7 @@ export function showDytDemo() {
url: "//data.mars3d.cn/3dtiles/qx-dyt/tileset.json", url: "//data.mars3d.cn/3dtiles/qx-dyt/tileset.json",
position: { alt: -27 }, position: { alt: -27 },
maximumScreenSpaceError: 1, // 可传入TilesetFlat构造参数，下面是演示压平区域 maximumScreenSpaceError: 1, // 可传入TilesetFlat构造参数，下面是演示压平区域
flat: { clip: {
precise, precise,
enabled: true enabled: true
}, },
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论