Compare commits

...

26 Commits

Author SHA1 Message Date
f24a95ab32 线贴图 速度相同 切换有问题 2025-07-14 18:05:19 +08:00
c03cd63532 Merge branch 'develop' of http://xny.yj-3d.com:3000/zh/sdk4.0 into develop 2025-07-14 11:32:29 +08:00
1b712424d8 图片 2025-07-14 11:32:25 +08:00
51f7ef9864 修改飞线和光照bug 2025-07-14 11:31:10 +08:00
zh
040049236d 全球等高线 2025-07-14 10:11:48 +08:00
zh
2db5eafabf 全球等高线忽略小于0的高度 2025-07-14 09:27:46 +08:00
zh
c843b025fc 等高线控制 2025-07-11 17:50:52 +08:00
zh
53b4eb03e5 Merge branch 'develop' of http://xny.yj-3d.com:3000/zh/sdk4.0 2025-07-11 15:59:51 +08:00
zh
e242427228 将url中localhost端口改为当前host端口 2025-07-11 15:59:38 +08:00
ff60cc4f65 线 空间长度、投影长度、地表长度bug修改 2025-07-11 15:46:29 +08:00
zh
e45b67298a Merge branch 'develop' of http://xny.yj-3d.com:3000/zh/sdk4.0 into develop 2025-07-11 09:21:38 +08:00
zh
579b76dc0e 将url中localhost端口改为当前host端口 2025-07-11 09:19:20 +08:00
b0ae9c7042 修改线空间长度选择 2025-07-10 16:55:46 +08:00
11812253e6 线样式修改 2025-07-10 15:14:01 +08:00
zh
399725ed06 Merge branch 'develop' of http://xny.yj-3d.com:3000/zh/sdk4.0 2025-07-09 17:44:11 +08:00
zh
574538e7bb 默认墙材质 2025-07-09 17:40:13 +08:00
45f2d6f4eb 修改间距大值 缓冲区bug 2025-07-09 11:26:33 +08:00
zh
ff4f823a27 修改点线面默认样式 2025-07-09 11:15:53 +08:00
zh
c6aa99792f 广告牌高程计算忽略三维扫描 2025-07-08 17:50:23 +08:00
zh
16942a2e63 卷帘对比下图层层级修改同步 2025-07-08 16:48:22 +08:00
dd003aa00d 贴图反向bug修改 2025-07-07 17:17:40 +08:00
ea94efb65f Merge branch 'develop' of http://xny.yj-3d.com:3000/zh/sdk4.0 into develop 2025-07-07 16:21:07 +08:00
fa3325580c 线样式(无同步间距调节) 2025-07-07 16:21:01 +08:00
zh
0cf59afffd Merge branch 'master' of http://xny.yj-3d.com:3000/zh/sdk4.0 into develop 2025-07-04 13:58:04 +08:00
zh
2b6edf70b9 Merge branch 'master' of http://xny.yj-3d.com:3000/zh/sdk4.0 into develop 2025-07-03 18:18:43 +08:00
484fe70e16 飞线,光照 2025-07-03 16:28:48 +08:00
79 changed files with 4100 additions and 665 deletions

View File

@ -0,0 +1,109 @@
function html() {
return `
<span class="custom-divider"></span>
<div class="div-item">
<div class="row" style="align-items: flex-start;">
<div class="col" style="flex: 0 0 120px;">
<span class="label">等高线</span>
<input class="btn-switch show" type="checkbox">
</div>
</div>
</div>
<span class="custom-divider"></span>
<div class="div-item">
<div class="row">
<div class="col input-select-unit-box">
<span class="label">等高距</span>
<div class="input-number input-number-unit-1">
<input class="input equal-height-distance" type="number" title="" min="1" max="1000">
<span class="unit">m</span>
<span class="arrow"></span>
</div>
</div>
<div class="col input-select-unit-box" style="flex: 0 0 60px;">
</div>
<div class="col input-select-unit-box" style="flex: 0 0 157px;">
<span class="label">选中线颜色</span>
<div class="active-color"></div>
</div>
</div>
</div>
<span class="custom-divider"></span>
<div class="div-item">
<div class="row" style="align-items: flex-start;">
<div class="col" style="flex: 0 0 120px;">
<span class="label">计曲线</span>
<input class="btn-switch index-contour-switch" type="checkbox">
</div>
<div class="col input-select-unit-box" style="flex: 0 0 120px;">
<span class="label">计曲线颜色</span>
<div class="index-contour-color"></div>
</div>
<div class="col input-select-unit-box">
<span class="label">计曲线宽度</span>
<div class="input-number input-number-unit-1">
<input class="input index-contour-width" type="number" title="" step="0.1" min="1" max="10">
<span class="unit">px</span>
<span class="arrow"></span>
</div>
</div>
</div>
<div class="row" style="align-items: flex-start;">
<div class="col" style="flex: 0 0 120px;">
<span class="label">首曲线</span>
<input class="btn-switch intermediate-contour-switch" type="checkbox">
</div>
<div class="col input-select-unit-box" style="flex: 0 0 120px;">
<span class="label">首曲线颜色</span>
<div class="intermediate-contour-color"></div>
</div>
<div class="col input-select-unit-box">
<span class="label">首曲线宽度</span>
<div class="input-number input-number-unit-1">
<input class="input intermediate-contour-width" type="number" step="0.1" title="" min="1" max="10">
<span class="unit">px</span>
<span class="arrow"></span>
</div>
</div>
</div>
<div class="row" style="align-items: flex-start;">
<div class="col" style="flex: 0 0 120px;">
<span class="label">间曲线</span>
<input class="btn-switch halfInterval-contour-switch" type="checkbox">
</div>
<div class="col input-select-unit-box" style="flex: 0 0 120px;">
<span class="label">间曲线颜色</span>
<div class="halfInterval-contour-color"></div>
</div>
<div class="col input-select-unit-box">
<span class="label">间曲线宽度</span>
<div class="input-number input-number-unit-1">
<input class="input halfInterval-contour-width" type="number" title="" min="1" max="10">
<span class="unit">px</span>
<span class="arrow"></span>
</div>
</div>
</div>
<div class="row" style="align-items: flex-start;">
<div class="col" style="flex: 0 0 120px;">
<span class="label">助曲线</span>
<input class="btn-switch supplementary-contour-switch" type="checkbox">
</div>
<div class="col input-select-unit-box" style="flex: 0 0 120px;">
<span class="label">助曲线颜色</span>
<div class="supplementary-contour-color"></div>
</div>
<div class="col input-select-unit-box">
<span class="label">助曲线宽度</span>
<div class="input-number input-number-unit-1">
<input class="input supplementary-contour-width" type="number" title="" min="1" max="10">
<span class="unit">px</span>
<span class="arrow"></span>
</div>
</div>
</div>
</div>
`
}
export { html }

View File

@ -3,12 +3,35 @@
*/ */
import Dialog from "../../Obj/Element/Dialog"; import Dialog from "../../Obj/Element/Dialog";
import Tools from "../../Tools"; import Tools from "../../Tools";
import { flyTo } from '../global'
import YJColorPicker from "../../Obj/Element/yj-color-picker";
import { html } from "./_element";
let _DialogObject = null; let _DialogObject = null;
let material = null; let material = null;
let handler = null; let handler = null;
let activeHeightElm = null; let activeHeightElm = null;
let tools let tools
let _sdk
let secondaryLinesCount = 19
let show = false
let equalHeightDistance = 10
let activeColor = '#ffd000'
let indexContourShow = true
let indexContourWidth = 2.5
let indexContourColor = '#43cf7c'
let intermediateContourShow = true
let intermediateContourWidth = 1.8
let intermediateContourColor = '#ff0000'
let halfIntervalContourShow = false
let halfIntervalContourWidth = 1.0
let halfIntervalContourColor = '#64b6d9'
let supplementaryContourShow = false
let supplementaryContourWidth = 1.0
let supplementaryContourColor = '#d084d1'
activeHeightElm = document.createElement('div') activeHeightElm = document.createElement('div')
activeHeightElm.className = 'YJ-customize-active-height-elm' activeHeightElm.className = 'YJ-customize-active-height-elm'
activeHeightElm.style.position = 'absolute' activeHeightElm.style.position = 'absolute'
@ -20,7 +43,39 @@ activeHeightElm.style.textAlign = 'center'
activeHeightElm.style.pointerEvents = 'none' activeHeightElm.style.pointerEvents = 'none'
activeHeightElm.style.color = '#ff0000' activeHeightElm.style.color = '#ff0000'
activeHeightElm.style.display = 'none' activeHeightElm.style.display = 'none'
function accordingToCameraHeight() {
if (_sdk) {
const camera = _sdk.viewer.camera;
const position = camera.positionCartographic;
// 计算相机高度(相对于椭球面)
let cameraHeight = Cesium.Math.toDegrees(position.height);
if (cameraHeight < 1000000) {
if (!_sdk.viewer.scene.globe.material && show === true) {
showContour(_sdk)
}
// if (material) {
// if (cameraHeight > 450000) {
// material.uniforms.supplementaryContourShow = false
// }
// else if (supplementaryContourShow) {
// material.uniforms.supplementaryContourShow = true
// }
// }
}
else {
hideContour(_sdk)
}
// console.log(cameraHeight)
}
}
async function dialog(sdk) { async function dialog(sdk) {
_sdk = sdk
if (!sdk || _DialogObject) { if (!sdk || _DialogObject) {
return return
} }
@ -28,13 +83,12 @@ async function dialog(sdk) {
createMaterial() createMaterial()
} }
if (!tools) { if (!tools) {
tools = new Tools() tools = new Tools(sdk)
} }
_DialogObject = await new Dialog(sdk, {}, { _DialogObject = await new Dialog(sdk, {}, {
title: "等高线", left: '180px', title: "全局等高线", left: '180px',
top: '100px', top: '100px',
confirmCallBack: options => { },
closeCallBack: () => { closeCallBack: () => {
_DialogObject = null _DialogObject = null
} }
@ -43,63 +97,292 @@ async function dialog(sdk) {
_DialogObject._element.body.className = _DialogObject._element.body.className =
_DialogObject._element.body.className + ' contour' _DialogObject._element.body.className + ' contour'
let contentElm = document.createElement('div') let contentElm = document.createElement('div')
contentElm.innerHTML = ` contentElm.innerHTML = html(this)
<span class="custom-divider"></span>
<div class="div-item">
<div class="row">
<div class="col input-select-unit-box">
<span class="label">高差</span>
<div class="input-number input-number-unit-1">
<input class="input gap" type="number" title="" min="0" max="1000">
<span class="unit">m</span>
<span class="arrow"></span>
</div>
</div>
<div class="col input-select-unit-box" style="flex: 0 0 120px;">
<span class="label">主线颜色</span>
<div class="primary-lice-color"></div>
</div>
</div>
<div class="row">
<div class="col input-select-unit-box">
<span class="label">次线条数</span>
<div class="input-number input-number-unit-1">
<input class="input gap2" type="number" title="" min="0" max="10">
<span class="unit"></span>
<span class="arrow"></span>
</div>
</div>
<div class="col input-select-unit-box" style="flex: 0 0 120px;">
<span class="label">次线颜色</span>
<div class="secondary-lice-color"></div>
</div>
</div>
<div class="row" style="align-items: flex-start;">
<div class="col">
</div>
<div class="col" style="flex: 0 0 120px;">
<span class="label">开关</span>
<input class="btn-switch" type="checkbox">
</div>
</div>
</div>
<span class="custom-divider"></span>
`
contentElm.innerHTML = `
<span class="custom-divider"></span>
<div class="div-item">
<div class="row" style="align-items: flex-start;">
<div class="col" style="flex: 0 0 120px;">
<span class="label">开关</span>
<input class="btn-switch" type="checkbox">
</div>
</div>
</div>
`
_DialogObject.contentAppChild(contentElm) _DialogObject.contentAppChild(contentElm)
contentElm.getElementsByClassName('btn-switch')[0].addEventListener('change', (e) => { sdk.viewer.scene.postRender.removeEventListener(accordingToCameraHeight)
sdk.viewer.scene.postRender.addEventListener(accordingToCameraHeight)
// 显示
let showBtn = contentElm.getElementsByClassName('show')[0]
showBtn.checked = show
showBtn.addEventListener('change', (e) => {
if (e.target.checked) { if (e.target.checked) {
show = true
let height = sdk.viewer.camera.positionCartographic.height
if (height > 16360) {
let cartographic = sdk.viewer.camera.positionCartographic
let options = {
position: {
lng: Cesium.Math.toDegrees(cartographic.longitude),
lat: Cesium.Math.toDegrees(cartographic.latitude),
alt: 16360,
},
}
flyTo(sdk, options, 0.5)
}
showContour(sdk)
} else {
show = false
hideContour(sdk)
}
})
// 等高距
let equalHeightDistanceInput = contentElm.getElementsByClassName('equal-height-distance')[0]
equalHeightDistanceInput.value = equalHeightDistance
equalHeightDistanceInput.addEventListener('blur', (e) => {
let value = initInputValue(e)
equalHeightDistance = value
equalHeightDistanceInput.value = value
if (material) {
material.uniforms.spacing = equalHeightDistance * 5
}
})
// 选中颜色
// let activeColorPicker = new YJColorPicker({
// el: contentElm.getElementsByClassName('active-color')[0],
// size: "mini",
// isLog: false,
// alpha: true, //是否开启透明度
// disabled: false, //是否禁止打开颜色选择器
// predefineColor: true, // 预定义颜色
// defaultColor: '#ffffff',
// sure: color => {
// activeColor = color
// if (material) {
// material.uniforms.activeColor = Cesium.Color.fromCssColorString(activeColor)
// }
// },
// clear: () => {
// activeColor = 'rgba(255,255,255,1)'
// if (material) {
// material.uniforms.activeColor = Cesium.Color.fromCssColorString(activeColor)
// }
// }
// })
let activeColorPicker = new ewPlugins('colorpicker', {
el: contentElm.getElementsByClassName('active-color')[0],
size: 'mini',//颜色box类型
alpha: true,//是否开启透明度
defaultColor: activeColor,
disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画
sure: color => {
activeColor = color
if (material) {
material.uniforms.activeColor = Cesium.Color.fromCssColorString(activeColor)
}
},
clear: () => {
activeColor = 'rgba(255,255,255,1)'
if (material) {
material.uniforms.activeColor = Cesium.Color.fromCssColorString(activeColor)
}
}
})
// 计曲线开关
let indexContourSwitch = contentElm.getElementsByClassName('index-contour-switch')[0]
indexContourSwitch.checked = indexContourShow
indexContourSwitch.addEventListener('change', (e) => {
indexContourShow = e.target.checked
if (material) {
material.uniforms.indexContourShow = indexContourShow
}
})
// 计曲线颜色
let indexContourColorPicker = new ewPlugins('colorpicker', {
el: contentElm.getElementsByClassName('index-contour-color')[0],
size: 'mini',//颜色box类型
alpha: true,//是否开启透明度
defaultColor: indexContourColor,
disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画
sure: color => {
indexContourColor = color
if (material) {
material.uniforms.indexContourColor = Cesium.Color.fromCssColorString(indexContourColor)
}
},
clear: () => {
indexContourColor = 'rgba(255,255,255,1)'
if (material) {
material.uniforms.indexContourColor = Cesium.Color.fromCssColorString(indexContourColor)
}
}
})
// 计曲线宽度
let indexContourWidthInput = contentElm.getElementsByClassName('index-contour-width')[0]
indexContourWidthInput.value = indexContourWidth
indexContourWidthInput.addEventListener('blur', (e) => {
let value = initInputValue(e)
indexContourWidth = value
indexContourWidthInput.value = value
if (material) {
material.uniforms.indexContourWidth = indexContourWidth
}
})
// 首曲线开关
let intermediateContourSwitch = contentElm.getElementsByClassName('intermediate-contour-switch')[0]
intermediateContourSwitch.checked = intermediateContourShow
intermediateContourSwitch.addEventListener('change', (e) => {
intermediateContourShow = e.target.checked
if (material) {
material.uniforms.intermediateContourShow = intermediateContourShow
}
})
// 首曲线颜色
let intermediateContourColorPicker = new ewPlugins('colorpicker', {
el: contentElm.getElementsByClassName('intermediate-contour-color')[0],
size: 'mini',//颜色box类型
alpha: true,//是否开启透明度
defaultColor: intermediateContourColor,
disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画
sure: color => {
intermediateContourColor = color
if (material) {
material.uniforms.intermediateContourColor = Cesium.Color.fromCssColorString(intermediateContourColor)
}
},
clear: () => {
intermediateContourColor = 'rgba(255,255,255,1)'
if (material) {
material.uniforms.intermediateContourColor = Cesium.Color.fromCssColorString(intermediateContourColor)
}
}
})
// 首曲线宽度
let intermediateContourWidthInput = contentElm.getElementsByClassName('intermediate-contour-width')[0]
intermediateContourWidthInput.value = intermediateContourWidth
intermediateContourWidthInput.addEventListener('blur', (e) => {
let value = initInputValue(e)
intermediateContourWidth = value
intermediateContourWidthInput.value = value
if (material) {
material.uniforms.intermediateContourWidth = intermediateContourWidth
}
})
// 间曲线开关
let halfIntervalContourSwitch = contentElm.getElementsByClassName('halfInterval-contour-switch')[0]
halfIntervalContourSwitch.checked = halfIntervalContourShow
halfIntervalContourSwitch.addEventListener('change', (e) => {
halfIntervalContourShow = e.target.checked
if (material) {
material.uniforms.halfIntervalContourShow = halfIntervalContourShow
}
})
// 间曲线颜色
let halfIntervalContourColorPicker = new ewPlugins('colorpicker', {
el: contentElm.getElementsByClassName('halfInterval-contour-color')[0],
size: 'mini',//颜色box类型
alpha: true,//是否开启透明度
defaultColor: halfIntervalContourColor,
disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画
sure: color => {
halfIntervalContourColor = color
if (material) {
material.uniforms.halfIntervalContourColor = Cesium.Color.fromCssColorString(halfIntervalContourColor)
}
},
clear: () => {
halfIntervalContourColor = 'rgba(255,255,255,1)'
if (material) {
material.uniforms.halfIntervalContourColor = Cesium.Color.fromCssColorString(halfIntervalContourColor)
}
}
})
// 间曲线宽度
let halfIntervalContourWidthInput = contentElm.getElementsByClassName('halfInterval-contour-width')[0]
halfIntervalContourWidthInput.value = halfIntervalContourWidth
halfIntervalContourWidthInput.addEventListener('blur', (e) => {
let value = initInputValue(e)
halfIntervalContourWidth = value
halfIntervalContourWidthInput.value = value
if (material) {
material.uniforms.halfIntervalContourWidth = halfIntervalContourWidth
}
})
// 助曲线开关
let supplementaryContourSwitch = contentElm.getElementsByClassName('supplementary-contour-switch')[0]
supplementaryContourSwitch.checked = supplementaryContourShow
supplementaryContourSwitch.addEventListener('change', (e) => {
supplementaryContourShow = e.target.checked
if (material) {
material.uniforms.supplementaryContourShow = supplementaryContourShow
}
})
// 助曲线颜色
let supplementaryContourColorPicker = new ewPlugins('colorpicker', {
el: contentElm.getElementsByClassName('supplementary-contour-color')[0],
size: 'mini',//颜色box类型
alpha: true,//是否开启透明度
defaultColor: supplementaryContourColor,
disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画
sure: color => {
supplementaryContourColor = color
if (material) {
material.uniforms.supplementaryContourColor = Cesium.Color.fromCssColorString(supplementaryContourColor)
}
},
clear: () => {
supplementaryContourColor = 'rgba(255,255,255,1)'
if (material) {
material.uniforms.supplementaryContourColor = Cesium.Color.fromCssColorString(supplementaryContourColor)
}
}
})
// 助曲线宽度
let supplementaryContourWidthInput = contentElm.getElementsByClassName('supplementary-contour-width')[0]
supplementaryContourWidthInput.value = supplementaryContourWidth
supplementaryContourWidthInput.addEventListener('blur', (e) => {
let value = initInputValue(e)
supplementaryContourWidth = value
supplementaryContourWidthInput.value = value
if (material) {
material.uniforms.supplementaryContourWidth = supplementaryContourWidth
}
})
function initInputValue(e) {
let value = e.target.value
if (e.target.value || (e.target.dataset.null !== 'undefined' && e.target.dataset.null !== '' && !Boolean(e.target.dataset.null))) {
value = Number(value)
if ((e.target.max) && value > Number(e.target.max)) {
value = Number(e.target.max)
}
if ((e.target.min) && value < Number(e.target.min)) {
value = Number(e.target.min)
}
if ((e.target.dataset.min) && value < Number(e.target.dataset.min)) {
value = Number(e.target.dataset.min)
}
}
return value
}
}
function showContour(sdk) {
const camera = sdk.viewer.camera;
const position = camera.positionCartographic;
// 计算相机高度(相对于椭球面)
let cameraHeight = Cesium.Math.toDegrees(position.height);
if (cameraHeight > 1000000) {
return
}
if (handler) { if (handler) {
handler.destroy() handler.destroy()
} }
@ -123,11 +406,16 @@ async function dialog(sdk) {
activeHeightElm.style.left = movement.endPosition.x - 50 + left + 'px' activeHeightElm.style.left = movement.endPosition.x - 50 + left + 'px'
activeHeightElm.style.top = movement.endPosition.y - 40 + top + 'px' activeHeightElm.style.top = movement.endPosition.y - 40 + top + 'px'
activeHeightElm.style.display = 'block' activeHeightElm.style.display = 'block'
// let pos = sdk.viewer.scene.clampToHeight(cartesian)
let pos84 = tools.cartesian3Towgs84(cartesian, sdk.viewer) let pos84 = tools.cartesian3Towgs84(cartesian, sdk.viewer)
// pos84.alt = height
let mainContourHeight = Math.floor(pos84.alt / material.uniforms.spacing) * material.uniforms.spacing let mainContourHeight = Math.floor(pos84.alt / material.uniforms.spacing) * material.uniforms.spacing
let gap = pos84.alt - mainContourHeight let gap = pos84.alt - mainContourHeight
let gap2 = material.uniforms.spacing / (material.uniforms.secondaryLinesCount + 1) let gap2 = material.uniforms.spacing / (material.uniforms.secondaryLinesCount + 1)
let activeHeight = Math.floor(gap / gap2) * gap2 + mainContourHeight let activeHeight = Math.floor(gap / gap2) * gap2 + mainContourHeight
if (pos84.alt < 0) {
pos84.alt = 0
}
if ((pos84.alt - activeHeight) > gap2 / 2) { if ((pos84.alt - activeHeight) > gap2 / 2) {
activeHeight = activeHeight + gap2 activeHeight = activeHeight + gap2
} }
@ -140,7 +428,8 @@ async function dialog(sdk) {
} }
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE) }, Cesium.ScreenSpaceEventType.MOUSE_MOVE)
sdk.viewer.scene.globe.material = material; sdk.viewer.scene.globe.material = material;
} else { }
function hideContour(sdk) {
if (handler) { if (handler) {
handler.destroy() handler.destroy()
handler = null handler = null
@ -150,18 +439,32 @@ async function dialog(sdk) {
sdk.viewer.container.removeChild(activeHeightElm) sdk.viewer.container.removeChild(activeHeightElm)
} }
sdk.viewer.scene.globe.material = null; sdk.viewer.scene.globe.material = null;
}
})
} }
function createMaterial() { function createMaterial() {
Cesium.Material._materialCache._materials.ElevationContour.fabric.source = ` Cesium.Material._materialCache._materials.ElevationContour.fabric.source = `
uniform vec4 color; uniform vec4 activeColor; // 选中颜色
uniform vec4 secondaryLinesColor; uniform float spacing; // 等高距
uniform float spacing;
uniform float width; // 计曲线
uniform float secondaryLinesWidth; uniform bool indexContourShow;
uniform float indexContourWidth;
uniform vec4 indexContourColor;
// 首曲线
uniform bool intermediateContourShow;
uniform float intermediateContourWidth;
uniform vec4 intermediateContourColor;
// 间曲线
uniform bool halfIntervalContourShow;
uniform float halfIntervalContourWidth;
uniform vec4 halfIntervalContourColor;
// 助曲线
uniform bool supplementaryContourShow;
uniform float supplementaryContourWidth;
uniform vec4 supplementaryContourColor;
uniform float mouseHeight; uniform float mouseHeight;
uniform float secondaryLinesCount; // 0=无次线, 1=1条次线, 2=2条次线... uniform float secondaryLinesCount; // 0=无次线, 1=1条次线, 2=2条次线...
czm_material czm_getMaterial(czm_materialInput materialInput) czm_material czm_getMaterial(czm_materialInput materialInput)
@ -175,18 +478,32 @@ czm_material czm_getMaterial(czm_materialInput materialInput)
#if (__VERSION__ == 300 || defined(GL_OES_standard_derivatives)) #if (__VERSION__ == 300 || defined(GL_OES_standard_derivatives))
float dxc = abs(dFdx(materialInput.height)); float dxc = abs(dFdx(materialInput.height));
float dyc = abs(dFdy(materialInput.height)); float dyc = abs(dFdy(materialInput.height));
float dFMain = max(dxc, dyc) * czm_pixelRatio * width; float dFMain = max(dxc, dyc) * czm_pixelRatio * indexContourWidth;
#else #else
float dFMain = czm_pixelRatio * width; float dFMain = czm_pixelRatio * indexContourWidth;
#endif #endif
bool isMainContour = distanceToMainContour < dFMain; bool isMainContour = distanceToMainContour < dFMain;
bool isSecondaryContour = false; bool isSecondaryContour = false;
float dFSecondary = 0.0; float dFSecondary = 0.0;
float secondarySpacing = 0.0; float secondarySpacing = 0.0;
bool isHalfInterval = false;
bool isIntermediate= false;
// 计算当前高度所属的等高线高度
float mainContourHeight = floor(materialInput.height / spacing) * spacing;
float secondaryContourHeight = floor(materialInput.height / spacing * (secondaryLinesCount + 1.0)) * spacing / (secondaryLinesCount + 1.0);
// 计算次线在两条主等高线之间的相对位置
float relativeHeight = materialInput.height - mainContourHeight;
float normalizedPosition = relativeHeight / spacing;
// 计算次线索引(从主等高线开始计数)
float lineIndex = floor(normalizedPosition * (secondaryLinesCount + 1.0));
// 只有当存在次线时才计算次线 // 只有当存在次线时才计算次线
if(secondaryLinesCount > 0.0) { if(secondaryLinesCount > 0.0) {
float secondaryLinesWidth = supplementaryContourWidth;
secondarySpacing = spacing / (secondaryLinesCount + 1.0); secondarySpacing = spacing / (secondaryLinesCount + 1.0);
float distanceToSecondaryContour = mod(materialInput.height, secondarySpacing); float distanceToSecondaryContour = mod(materialInput.height, secondarySpacing);
@ -194,6 +511,28 @@ czm_material czm_getMaterial(czm_materialInput materialInput)
float minDistanceToMain = min(distanceToMainContour, spacing - distanceToMainContour); float minDistanceToMain = min(distanceToMainContour, spacing - distanceToMainContour);
bool notCloseToMain = minDistanceToMain > dFMain * 2.0; // 2倍线宽缓冲 bool notCloseToMain = minDistanceToMain > dFMain * 2.0; // 2倍线宽缓冲
if (lineIndex > 0.0 && lineIndex < secondaryLinesCount) {
// 使用mod函数检查余数是否接近0考虑浮点数精度问题
isHalfInterval = abs(mod(lineIndex, 2.0)) < 0.01;
if(isHalfInterval) {
secondaryLinesWidth = halfIntervalContourWidth;
}
// 使用mod函数检查余数是否接近0考虑浮点数精度问题
isIntermediate = abs(mod(lineIndex, 4.0)) < 0.01;
if(isIntermediate) {
secondaryLinesWidth = intermediateContourWidth;
}
}
#if (__VERSION__ == 300 || defined(GL_OES_standard_derivatives)) #if (__VERSION__ == 300 || defined(GL_OES_standard_derivatives))
dFSecondary = max(dxc, dyc) * czm_pixelRatio * secondaryLinesWidth; dFSecondary = max(dxc, dyc) * czm_pixelRatio * secondaryLinesWidth;
#else #else
@ -203,10 +542,6 @@ czm_material czm_getMaterial(czm_materialInput materialInput)
isSecondaryContour = (distanceToSecondaryContour < dFSecondary) && notCloseToMain; isSecondaryContour = (distanceToSecondaryContour < dFSecondary) && notCloseToMain;
} }
// 计算当前高度所属的等高线高度
float mainContourHeight = floor(materialInput.height / spacing) * spacing;
float secondaryContourHeight = floor(materialInput.height / spacing * (secondaryLinesCount + 1.0)) * spacing / (secondaryLinesCount + 1.0);
// 高亮判断 // 高亮判断
bool shouldHighlight = false; bool shouldHighlight = false;
if(isMainContour && abs(mainContourHeight - mouseHeight) < 0.5 * (spacing/(secondaryLinesCount+1.0))) { if(isMainContour && abs(mainContourHeight - mouseHeight) < 0.5 * (spacing/(secondaryLinesCount+1.0))) {
@ -218,15 +553,41 @@ czm_material czm_getMaterial(czm_materialInput materialInput)
// 颜色输出 // 颜色输出
vec4 outColor; vec4 outColor;
if(shouldHighlight) { if(shouldHighlight) {
outColor = vec4(1.0, 0.0, 0.0, 1.0); outColor = czm_gammaCorrect(vec4(activeColor.rgb, activeColor.a));
} else if(isMainContour) { } else if(isMainContour) {
outColor = czm_gammaCorrect(vec4(color.rgb, color.a)); float a = indexContourColor.a;
if(!indexContourShow) {
a = 0.0;
}
outColor = czm_gammaCorrect(vec4(indexContourColor.rgb, a));
} else if(isSecondaryContour) { } else if(isSecondaryContour) {
outColor = czm_gammaCorrect(vec4(secondaryLinesColor.rgb, secondaryLinesColor.a)); float a = supplementaryContourColor.a;
if(!supplementaryContourShow) {
a = 0.0;
}
outColor = czm_gammaCorrect(vec4(supplementaryContourColor.rgb, a));
if(isHalfInterval) {
float a = halfIntervalContourColor.a;
if(!halfIntervalContourShow) {
a = 0.0;
}
outColor = czm_gammaCorrect(vec4(halfIntervalContourColor.rgb, a));
}
if(isIntermediate) {
float a = intermediateContourColor.a;
if(!intermediateContourShow) {
a = 0.0;
}
outColor = czm_gammaCorrect(vec4(intermediateContourColor.rgb, a));
}
} else { } else {
outColor = vec4(0.0); outColor = vec4(0.0);
} }
if(materialInput.height<0.0) {
outColor = vec4(0.0);
}
material.diffuse = outColor.rgb; material.diffuse = outColor.rgb;
material.alpha = outColor.a; material.alpha = outColor.a;
return material; return material;
@ -237,14 +598,25 @@ czm_material czm_getMaterial(czm_materialInput materialInput)
fabric: { fabric: {
type: "ElevationContour", type: "ElevationContour",
uniforms: { uniforms: {
width: 2, spacing: 10 * 5,
secondaryLinesWidth: 1, // 次级线宽度 activeColor: Cesium.Color.fromCssColorString(activeColor),
spacing: 200,
color: Cesium.Color.fromCssColorString('#ffd000'),
secondaryLinesColor: Cesium.Color.fromCssColorString('#0dff00').withAlpha(0.5),
mouseHeight: -100000, mouseHeight: -100000,
mousePosition: new Cesium.Cartesian3(0, 0, 0), mousePosition: new Cesium.Cartesian3(0, 0, 0),
secondaryLinesCount: 3 secondaryLinesCount: secondaryLinesCount,
cameraHeight: 0,
indexContourShow: indexContourShow,
indexContourWidth: indexContourWidth,
indexContourColor: Cesium.Color.fromCssColorString(indexContourColor),
intermediateContourShow: intermediateContourShow,
intermediateContourWidth: intermediateContourWidth,
intermediateContourColor: Cesium.Color.fromCssColorString(intermediateContourColor),
halfIntervalContourShow: halfIntervalContourShow,
halfIntervalContourWidth: halfIntervalContourWidth,
halfIntervalContourColor: Cesium.Color.fromCssColorString(halfIntervalContourColor),
supplementaryContourShow: supplementaryContourShow,
supplementaryContourWidth: supplementaryContourWidth,
supplementaryContourColor: Cesium.Color.fromCssColorString(supplementaryContourColor),
}, },
} }
}); });

View File

@ -278,7 +278,7 @@ async function init(sdk) {
sdk.viewer.scene.preRender.addEventListener(syncViewer, syncObject) sdk.viewer.scene.preRender.addEventListener(syncViewer, syncObject)
// sdk.viewer.imageryLayers.layerAdded.addEventListener(syncImageryLayerAdded); // sdk.viewer.imageryLayers.layerAdded.addEventListener(syncImageryLayerAdded);
// sdk.viewer.imageryLayers.layerMoved.addEventListener(syncImageryLayerMoved); sdk.viewer.imageryLayers.layerMoved.addEventListener(syncImageryLayerMoved);
// sdk.viewer.imageryLayers.layerRemoved.addEventListener(syncImageryLayerRemoved); // sdk.viewer.imageryLayers.layerRemoved.addEventListener(syncImageryLayerRemoved);
// sdk.viewer.imageryLayers.layerShownOrHidden.addEventListener(syncImageryLayerShownOrHidden); // sdk.viewer.imageryLayers.layerShownOrHidden.addEventListener(syncImageryLayerShownOrHidden);
@ -711,6 +711,9 @@ async function setSplitDirection(v, id, isoff = false, entityId) {
status.P = true status.P = true
status.D = true status.D = true
options.show = true options.show = true
if(thatP.type==='layer') {
options.layer_index = thatP.layer_index
}
target = await new thatP.constructor(sdkD, options) target = await new thatP.constructor(sdkD, options)
if (thatP.onClick) { if (thatP.onClick) {
target.onClick = thatP.onClick target.onClick = thatP.onClick
@ -794,6 +797,9 @@ async function setSplitDirection(v, id, isoff = false, entityId) {
status.P = false status.P = false
status.D = true status.D = true
options.show = true options.show = true
if(thatP.type==='layer') {
options.layer_index = thatP.layer_index
}
target = await new thatP.constructor(sdkD, options) target = await new thatP.constructor(sdkD, options)
if (thatP.onClick) { if (thatP.onClick) {
target.onClick = thatP.onClick target.onClick = thatP.onClick
@ -1033,7 +1039,13 @@ function syncImageryLayerAdded(layer, index) {
sdkD.viewer.imageryLayers.addImageryProvider(layer.imageryProvider, index) sdkD.viewer.imageryLayers.addImageryProvider(layer.imageryProvider, index)
} }
function syncImageryLayerMoved(layer, newindxe, oldindex) { function syncImageryLayerMoved(layer, newindxe, oldindex) {
let layerD = sdkD.viewer.imageryLayers._layers[oldindex] let layerD
for (let i = 0; i < sdkD.viewer.imageryLayers._layers.length; i++) {
if (sdkD.viewer.imageryLayers._layers[i]._id === layer._id) {
layerD = sdkD.viewer.imageryLayers._layers[i]
break
}
}
if (!layerD) { if (!layerD) {
return return
} }
@ -1042,13 +1054,15 @@ function syncImageryLayerMoved(layer, newindxe, oldindex) {
sdkD.viewer.imageryLayers.lowerToBottom(layerD) sdkD.viewer.imageryLayers.lowerToBottom(layerD)
} }
// 移到最高层 // 移到最高层
else if (newindxe === sdk.viewer.imageryLayers._layers.length - 1) { else if (newindxe === sdkD.viewer.imageryLayers._layers.length - 1) {
sdkD.viewer.imageryLayers.raiseToTop(layerD) sdkD.viewer.imageryLayers.raiseToTop(layerD)
} }
else { else {
if (newindxe < oldindex) { if (newindxe < oldindex) {
if(newindxe<sdkD.viewer.imageryLayers._layers.length-1) {
sdkD.viewer.imageryLayers.lower(layerD) sdkD.viewer.imageryLayers.lower(layerD)
} }
}
else { else {
sdkD.viewer.imageryLayers.raise(layerD) sdkD.viewer.imageryLayers.raise(layerD)
} }

View File

@ -0,0 +1,56 @@
function html() {
return `
<span class="custom-divider"></span>
<div class="div-item">
<div class="row">
<div class="col">
<span class="label">播放倍数</span>
<div class="input-number input-number-unit-1">
<input class="input" type="number" title="" min="0.01" max="999999" step="10" @model="speed">
<span class="arrow"></span>
</div>
</div>
<div class="col">
<span class="label">阴影柔和度</span>
<div class="input-number input-number-unit-1">
<input class="input" type="number" title="" min="0" max="1" step="0.1" @model="darkness">
<span class="arrow"></span>
</div>
</div>
</div>
</div>
<div class="div-item">
<div class="row">
<div class="col">
<span class="label">阴影优化</span>
<input class="btn-switch" type="checkbox" @model="softShadow">
</div>
<div class="col">
<span class="label" style="flex: 0 0 56px;">日期选择</span>
<input class="sunshine-date" type="text" placeholder="YYYY-MM-DD" @model="time">
</div>
</div>
</div>
<span class="custom-divider"></span>
<div class="div-item">
<div class="row">
<div class="col">
<div class="timeline-container">
<div class="timeline" id="timeline">
<div class="progress" id="progress">
<div class="handle" id="handle"></div>
<div class="current-time" id="currentTime">00:00:00</div>
</div>
</div>
<div class="time-marks">
</div>
<button id="timePause">暂停</button>
</div>
</div>
</div>
</div>
<span class="custom-divider"></span>
`
}
export { html }

View File

@ -0,0 +1,92 @@
class eventBinding {
constructor() {
this.element = {}
}
static event = {}
getEvent(name) {
return eventBinding.event[name]
}
getEventAll() {
return eventBinding.event
}
setEvent(name, event) {
eventBinding.event[name] = event
}
on(that, elements) {
for (let i = 0; i < elements.length; i++) {
let Event = []
let isEvent = false
let removeName = []
if (!elements[i] || !elements[i].attributes) {
continue;
}
for (let m of elements[i].attributes) {
switch (m.name) {
case '@model': {
isEvent = true
if (elements[i].type == 'checkbox') {
Event.push((e) => { that[m.value] = e.target.checked })
elements[i].checked = that[m.value]
}
else {
Event.push((e) => {
let value = e.target.value
if (e.target.type == 'number') {
value = Number(value)
}
that[m.value] = value
})
if (elements[i].nodeName == 'IMG') {
elements[i].src = that[m.value]
}
else {
elements[i].value = that[m.value]
}
}
if (this.element[m.value]) {
this.element[m.value].push(elements[i])
}
else {
this.element[m.value] = [elements[i]]
}
removeName.push(m.name)
break;
}
case '@click': {
elements[i].addEventListener('click', (e) => {
if (typeof (that.Dialog[m.value]) === 'function') {
that.Dialog[m.value](e)
}
});
removeName.push(m.name)
// elements[i].attributes.removeNamedItem(m.name)
break;
}
}
// elements[i].attributes[m] = undefined
}
for (let n = 0; n < removeName.length; n++) {
elements[i].attributes.removeNamedItem(removeName[n])
}
if (isEvent) {
let ventType = 'input'
if (elements[i].tagName != 'INPUT' || elements[i].type == 'checkbox') {
ventType = 'change'
}
elements[i].addEventListener(ventType, (e) => {
for (let t = 0; t < Event.length; t++) {
Event[t](e)
}
});
}
}
}
}
const EventBinding = new eventBinding();
export default EventBinding;

View File

@ -0,0 +1,227 @@
/**
* @description 水面
*/
import Dialog from '../../../Obj/Element/Dialog';
import { html } from "./_element";
import EventBinding from '../../../Obj/Element/Dialog/eventBinding';
import { syncData } from '../../MultiViewportMode'
import Tools from '../../../Tools'
import TimeLine from './TimeLine'
import { setSplitDirection, syncSplitData, setActiveId } from '../../SplitScreen'
export default class Sunshine {
/**
* @constructor
* @param sdk
* @description 光照
* @param options {object} 光照属性
* @param options.time=当前时间 {string} 当前时间
* @param options.speed=1000 {number} 速度倍速
* @param options.darkness=0.3 {number} 阴影不透明度--越大越不透明
* @param options.softShadow=false {boolean} 阴影优化--true/false}
* @param Dialog {object} 弹框对象
* @param Dialog.confirmCallBack {function} 弹框确认时的回调
* */
constructor(sdk, options = {}, _Dialog = {}) {
this.viewer = sdk.viewer
this.options = { ...options }
this.sdk = { ...sdk }
this.options.time = options.time || new Date()
this.options.speed = options.speed || 1000
this.options.darkness = options.darkness || 0.4
this.options.softShadow = options.softShadow || true
this.options.show = options.show === true ? true : false
this.Dialog = _Dialog
this.timeLine
this._EventBinding = new EventBinding()
this._elms = {};
Sunshine.start(this)
}
static start(that) {
that.viewer.scene.globe.enableLighting = true
that.viewer.shadows = true
that.viewer.scene.globe.enableLighting = true;
that.viewer.terrainShadows = Cesium.ShadowMode.RECEIVE_ONLY
that.viewer.shadowMap.darkness = 1.0 - that.options.darkness //阴影透明度--越大越透明
const now = new Date();
now.setHours(0, 0, 0, 0); // 设置为当天0点
that.viewer.clock.currentTime = Cesium.JulianDate.fromDate(now);
that.viewer.clock.multiplier = that.options.speed;
that.viewer.shadowMap.softShadows = that.options.softShadow;
that.edit(true)
}
get darkness() {
return this.options.darkness
}
set darkness(v) {
this.options.darkness = v
this.viewer.shadowMap.darkness = 1.0 - this.options.darkness
}
get speed() {
return this.options.speed
}
set speed(v) {
this.options.speed = v
this.viewer.clock.multiplier = this.options.speed;
this.timeLine.setSpeed(v)
}
get softShadow() {
return this.options.softShadow
}
set softShadow(v) {
this.options.softShadow = v
this.viewer.shadowMap.softShadows = this.options.softShadow;
}
/**
* @description 编辑框
* @param state=false {boolean} 状态: true打开, false关闭
*/
async edit(state = false) {
let tools = new Tools()
this.originalOptions = tools.deepCopyObj(this.options)
// let elms = this.sdk.viewer._container.getElementsByClassName('YJ-custom-base-dialog')
// for (let i = elms.length - 1; i >= 0; i--) {
// this.sdk.viewer._container.removeChild(elms[i])
// }
if (this._DialogObject && this._DialogObject.close) {
this._DialogObject.close()
this._DialogObject = null
}
if (state) {
let _this = this
this._DialogObject = await new Dialog(this.sdk, this.originalOptions, {
title: '光照属性', left: '180px', top: '100px',
confirmCallBack: (options) => {
this.originalOptions = tools.deepCopyObj(this.options)
this._DialogObject.close()
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(this.originalOptions)
syncData(this.sdk, this.options.id)
syncSplitData(this.sdk, this.options.id)
this.remove()
},
resetCallBack: () => {
this.reset()
this.Dialog.resetCallBack && this.Dialog.resetCallBack()
},
// removeCallBack: () => {
// this.Dialog.removeCallBack && this.Dialog.removeCallBack()
// },
closeCallBack: () => {
this.reset()
_this.remove()
// this.entity.style = new Cesium.Cesium3DTileStyle({
// color: "color('rgba(255,255,255," + this.newData.transparency + ")')",
// show: true,
// });
this.Dialog.closeCallBack && this.Dialog.closeCallBack()
},
showCallBack: (show) => {
this.show = show
this.Dialog.showCallBack && this.Dialog.showCallBack()
}
}, true)
this._DialogObject._element.body.className = this._DialogObject._element.body.className + ' sun-shine-surface'
let contentElm = document.createElement('div');
contentElm.innerHTML = html()
this._DialogObject.contentAppChild(contentElm)
//时间轴
let _that = this
this.timeLine = new TimeLine(this.sdk, this.options.speed)
// this.timeLine.setSpeed(1000)
this.timeLine.moveComplay(item => {
let timeData = _that.time + " " + item
_that.viewer.clock.currentTime = Cesium.JulianDate.fromDate(new Date(timeData));
_that.viewer.scene.requestRender();
})
let jeDateObject
let printDateElm = contentElm.getElementsByClassName('sunshine-date')[0]
let text
jeDateObject = jeDate(printDateElm, {
format: "YYYY-MM-DD",
isinitVal: true,
isClear: false,
donefun: function (obj) {
this.time = obj.val
const now = new Date();
let timeData = now.setHours(0, 0, 0, 0); // 设置为当天0点
_that.viewer.clock.currentTime = Cesium.JulianDate.fromDate(new Date(timeData));
_that.timeLine.updateTime(timeData)
}
});
if (this.time) {
jeDateObject.setValue(this.time)
}
else {
jeDateObject.nowBtn && jeDateObject.nowBtn()
this.time = jeDateObject.getValue()
}
let all_elm = contentElm.getElementsByTagName("*")
this._EventBinding.on(this, all_elm)
this._elms = this._EventBinding.element
this._elms.color = [jeDateObject]
} else {
// if (this._element_style) {
// document.getElementsByTagName('head')[0].removeChild(this._element_style)
// this._element_style = null
// }
// if (this._DialogObject && this._DialogObject.remove) {
// this._DialogObject.remove()
// this._DialogObject = null
// }
}
}
reset() {
if (!this.viewer.entities.getById(this.options.id)) {
return
}
this.time = this.originalOptions.time
this.speed = this.originalOptions.speed
this.darkness = this.originalOptions.darkness
}
/**
* 飞到对应实体
*/
async flyTo(options = {}) {
}
/**
* 删除
*/
async remove() {
this.viewer.scene.globe.enableLighting = false
this.viewer.shadows = false
this.viewer.clock.multiplier = 1.0
this.viewer.clock.currentTime = Cesium.JulianDate.fromDate(new Date());
this.entity = null
this.timeLine.clear()
if (this._DialogObject && !this._DialogObject.isDestroy) {
this._DialogObject.close()
this._DialogObject = null
}
// await this.sdk.removeIncetance(this.options.id)
await syncData(this.sdk, this.options.id)
}
flicker() { }
}

View File

@ -0,0 +1,133 @@
export default class TimeLine {
constructor(sdk, speed) {
this.sdk = { ...sdk };
this.progress = document.getElementById('progress');
this.handle = document.getElementById('handle');
this.timeline = document.getElementById('timeline');
this.currentTime = document.getElementById('currentTime');
this.timelineCon = document.getElementsByClassName('timeline-container')[0];
this.speed = speed;
this.animationId;
this.startTime = Date.now();
this.manualPosition = null;
this.isDragging = false;
this.pauseed = false;
this.time = '';
this.update = this.update.bind(this);
TimeLine.init(this)
}
static init(that) {
for (let i = 0; i <= 24; i++) {
if (i % 6 === 0) {
const label = document.createElement('div');
label.className = 'time-mark';
label.textContent = `${i}:00`;
label.style.left = `${(i / 24) * 100}%`;
document.getElementsByClassName('time-marks')[0].appendChild(label)
}
}
that.startTime = Date.now() - ((that.manualPosition || 0) * 86400 * 1000 / that.speed);
that.timeline.addEventListener('mousedown', (e) => {
that.isDragging = true;
e.preventDefault();
});
that.timeline.addEventListener('mousemove', (e) => {
if (!that.isDragging) return;
const rect = that.timeline.getBoundingClientRect();
let pos = (e.clientX - rect.left) / rect.width;
pos = Math.max(0, Math.min(1, pos));
that.manualPosition = pos;
that.progress.style.width = `${pos * 100}%`;
const seconds = pos * 86400;
that.currentTime.textContent = that.formatTime(seconds);
});
that.update();
document.getElementById('timePause').addEventListener('click', function () {
that.pauseed = !that.pauseed;
if (that.pauseed) {
document.getElementById('timePause').textContent = '播放';
that.animationId && cancelAnimationFrame(that.animationId);
that.pausedTime = Date.now(); // 记录暂停时刻
that.sdk.viewer.clock.shouldAnimate = false
} else {
document.getElementById('timePause').textContent = '暂停';
that.manualPosition = null
const pausedDuration = Date.now() - that.pausedTime;
that.startTime += pausedDuration; // 补偿暂停期间的时间差
that.sdk.viewer.clock.shouldAnimate = true
that.update(); // 重启动画循环
}
});
}
moveComplay(func) {
let that = this
that.timeline.addEventListener('mouseup', () => {
that.isDragging = false;
if (that.manualPosition !== null) {
// that.sdk.viewer.clock.shouldAnimate = true
that.startTime = Date.now() - (that.manualPosition * 86400 * 1000 / that.speed);
that.manualPosition = null;
if (!that.pauseed) {
that.update()
func(that.time)
} else {
that.pausedTime = Date.now(); // 记录暂停时刻
func(that.currentTime.textContent)
}
}
});
}
formatTime(seconds) {
const hrs = Math.floor(seconds / 3600).toString().padStart(2, '0');
const mins = Math.floor((seconds % 3600) / 60).toString().padStart(2, '0');
const secs = Math.floor(seconds % 60).toString().padStart(2, '0');
return `${hrs}:${mins}:${secs}`;
}
update() {
if (this.manualPosition !== null) return;
const elapsed = (Date.now() - this.startTime) * this.speed;
const totalSeconds = elapsed / 1000;
const daySeconds = totalSeconds % 86400;
const percentage = daySeconds / 86400;
this.progress.style.width = `${percentage * 100}%`;
this.time = this.formatTime(daySeconds)
this.currentTime.textContent = this.time;
this.animationId = requestAnimationFrame(this.update);
}
setSpeed(v) {
const currentProgress = this.manualPosition ??
(Date.now() - this.startTime) * this.speed / (86400 * 1000);
this.speed = v;
this.startTime = Date.now() - (currentProgress * 86400 * 1000 / this.speed);
this.manualPosition = null;
this.update();
}
updateTime() {
this.startTime = Date.now() - (this.manualPosition * 86400 * 1000 / this.speed);
this.manualPosition = null;
this.update();
}
clear() {
this.animationId && cancelAnimationFrame(this.animationId);
this.progress.style.width = '0%';
this.currentTime.textContent = '00:00:00';
}
}

View File

@ -14,6 +14,7 @@ import { getTheme, setTheme } from "../Obj/Element/theme";
import { setActiveViewer as setMultiViewportActiveViewer } from './MultiViewportMode' import { setActiveViewer as setMultiViewportActiveViewer } from './MultiViewportMode'
import { setActiveViewer as setSplitActiveViewer, getSdk } from './SplitScreen' import { setActiveViewer as setSplitActiveViewer, getSdk } from './SplitScreen'
import { updateCluster } from './cluster/cluster' import { updateCluster } from './cluster/cluster'
import { getHost } from "../on";
let coordinateSystem = 'EPSG:4326' let coordinateSystem = 'EPSG:4326'
let _cartesian let _cartesian
@ -110,7 +111,7 @@ function CesiumContainer(sdk, options) {
} }
containerObject[sdk.viewer._element.className] || (containerObject[sdk.viewer._element.className] = {}) containerObject[sdk.viewer._element.className] || (containerObject[sdk.viewer._element.className] = {})
containerObject[sdk.viewer._element.className].event && containerObject[sdk.viewer._element.className].event.destroy() containerObject[sdk.viewer._element.className].event && containerObject[sdk.viewer._element.className].event.destroy()
let tools = new Tools() let tools = new Tools(sdk)
let element = sdk.viewer._element let element = sdk.viewer._element
let proj = sdk.proj let proj = sdk.proj
for (let key in options) { for (let key in options) {
@ -173,15 +174,28 @@ function CesiumContainer(sdk, options) {
} }
let event = new MouseEvent(sdk) let event = new MouseEvent(sdk)
containerObject[sdk.viewer._element.className].event = event containerObject[sdk.viewer._element.className].event = event
let lastPickTime = 0;
let timeoutEvent
event.mouse_move((movement, cartesian) => { event.mouse_move((movement, cartesian) => {
_cartesian = cartesian _cartesian = cartesian
// const now = Date.now();
// if (now - lastPickTime < 500) {
// clearTimeout(timeoutEvent)
// timeoutEvent = setTimeout(() => {
// update()
// }, 500);
// return
// }
// lastPickTime = now;
update() update()
}) })
function update() { async function update() {
if (!_cartesian) { if (!_cartesian) {
return return
} }
// let pos = sdk.viewer.scene.clampToHeight(_cartesian)
let position = tools.cartesian3Towgs84(_cartesian, sdk.viewer) let position = tools.cartesian3Towgs84(_cartesian, sdk.viewer)
// position.alt = height
if (coordinateSystem === 'EPSG:4326') { if (coordinateSystem === 'EPSG:4326') {
infoElm.innerHTML = ` infoElm.innerHTML = `
<span>经度:</span><span>${Number(position.lng.toFixed(6))}° </span> <span>经度:</span><span>${Number(position.lng.toFixed(6))}° </span>
@ -244,6 +258,16 @@ function setBillboardDefaultUrl(url, name) {
else { else {
name = 'billboard_default_url' name = 'billboard_default_url'
} }
let host = getHost()
if (!url.startsWith("http")) {
//说明是本地的json在磁盘中存在的
if (!url.includes(":")) {
if (host) {
let o = new URL(url, host)
url = o.href
}
}
}
localStorage.setItem(name, url); localStorage.setItem(name, url);
} }
/*获取广告牌默认图标*/ /*获取广告牌默认图标*/
@ -426,12 +450,12 @@ function closeViewFollow(sdk) {
/* 方里网状态开关 */ /* 方里网状态开关 */
function FlwStatusSwitch(sdk, status) { function FlwStatusSwitch(sdk, status) {
if(!sdk) { if (!sdk) {
return return
} }
let layer let layer
let sdkD = getSdk().sdkD let sdkD = getSdk().sdkD
if(sdkD && sdk !== sdkD) { if (sdkD && sdk !== sdkD) {
FlwStatusSwitch(sdkD, status) FlwStatusSwitch(sdkD, status)
} }
for (let i = 0; i < sdk.viewer.imageryLayers._layers.length; i++) { for (let i = 0; i < sdk.viewer.imageryLayers._layers.length; i++) {
@ -466,12 +490,12 @@ function getFlwStatus(sdk) {
/* 经纬网状态开关 */ /* 经纬网状态开关 */
function JwwStatusSwitch(sdk, status) { function JwwStatusSwitch(sdk, status) {
if(!sdk) { if (!sdk) {
return return
} }
let layer let layer
let sdkD = getSdk().sdkD let sdkD = getSdk().sdkD
if(sdkD && sdk !== sdkD) { if (sdkD && sdk !== sdkD) {
JwwStatusSwitch(sdkD, status) JwwStatusSwitch(sdkD, status)
} }
for (let i = 0; i < sdk.viewer.imageryLayers._layers.length; i++) { for (let i = 0; i < sdk.viewer.imageryLayers._layers.length; i++) {

View File

@ -70,7 +70,7 @@ import {
import { MouseCoordinate } from '../Global/MouseCoordinate' import { MouseCoordinate } from '../Global/MouseCoordinate'
import { MouseRightMenu } from '../Global/mouseRightMenu' import { MouseRightMenu } from '../Global/mouseRightMenu'
import { dialog as ContourDialog } from '../Global/Contour' import { dialog as ContourDialog } from '../Global/Contour'
import { on as SplitScreenOn, off as SplitScreenOff, setActiveId as SplitScreenSetActiveId ,getSdk } from '../Global/SplitScreen' import { on as SplitScreenOn, off as SplitScreenOff, setActiveId as SplitScreenSetActiveId, getSdk } from '../Global/SplitScreen'
import LocateCurrent from '../Obj/Base/LocateCurrent' import LocateCurrent from '../Obj/Base/LocateCurrent'
import { AnalysisClear, SectionClear } from '../Obj/Analysis/clear' import { AnalysisClear, SectionClear } from '../Obj/Analysis/clear'
@ -157,7 +157,7 @@ import WaterSurface from '../Obj/Base/WaterSurface'
// import ItineraryMove from '../Obj/Base/ItineraryMove' // import ItineraryMove from '../Obj/Base/ItineraryMove'
import TrajectoryMotion from '../Obj/Base/TrajectoryMotion' import TrajectoryMotion from '../Obj/Base/TrajectoryMotion'
import TrajectoryMotionObject from '../Obj/Base/TrajectoryMotionObject' import TrajectoryMotionObject from '../Obj/Base/TrajectoryMotionObject'
import Road from '../Obj/Base/Road' // import Road from '../Obj/Base/Road'
import Graffiti from '../Obj/Base/Graffiti' import Graffiti from '../Obj/Base/Graffiti'
import GroundImage from '../Obj/Base/GroundImage' import GroundImage from '../Obj/Base/GroundImage'
import GroundSvg from '../Obj/Base/GroundSvg' import GroundSvg from '../Obj/Base/GroundSvg'
@ -183,6 +183,8 @@ import Dialog from '../Obj/Element/Dialog'
import newAirLine from '../Obj/AirLine/pointRoute.js' import newAirLine from '../Obj/AirLine/pointRoute.js'
import Frustum from '../Obj/AirLine/frustum' import Frustum from '../Obj/AirLine/frustum'
import DrawTakeOff from '../Obj/AirLine/DrawTakeOff' import DrawTakeOff from '../Obj/AirLine/DrawTakeOff'
import FlowLine from '../Obj/Base/FlowLine'
import Sunshine from '../Global/efflect/Sunshine'
const YJEarthismeasuring = Symbol('测量状态') const YJEarthismeasuring = Symbol('测量状态')
const screenRecord = Symbol('录屏对象') const screenRecord = Symbol('录屏对象')
@ -234,7 +236,7 @@ if (!window.YJ) {
Model2, Model2,
TrajectoryMotion, TrajectoryMotion,
TrajectoryMotionObject, TrajectoryMotionObject,
Road, // Road,
Graffiti, Graffiti,
GroundImage, GroundImage,
GroundSvg, GroundSvg,
@ -253,7 +255,8 @@ if (!window.YJ) {
newAirLine, newAirLine,
FRUSTUN: Frustum, FRUSTUN: Frustum,
// GenerateRoute // GenerateRoute
Dialog Dialog,
FlowLine
}, },
YJEarth, YJEarth,
Tools, Tools,
@ -292,7 +295,7 @@ if (!window.YJ) {
cease: FlyRoamCease cease: FlyRoamCease
}, },
flyTo, flyTo,
efflect: { rain, snow, fog, nightVision, skyStarry, illumination }, efflect: { rain, snow, fog, nightVision, skyStarry, illumination, Sunshine },
CameraController, CameraController,
CesiumContainer, CesiumContainer,
setBillboardDefaultUrl, setBillboardDefaultUrl,
@ -301,7 +304,7 @@ if (!window.YJ) {
on: multiViewportModeOn, on: multiViewportModeOn,
off: multiViewportModeOff, off: multiViewportModeOff,
get2DView, get2DView,
getSdk:getSdk2 getSdk: getSdk2
}, },
MouseCoordinate, MouseCoordinate,
MouseRightMenu, MouseRightMenu,

View File

@ -62,7 +62,7 @@ class PolygonObject extends Base {
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,

View File

@ -24,7 +24,7 @@ class AssembleObject extends Base {
* @param options {object} 属性 * @param options {object} 属性
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.color="#36c4ff" {string} 颜色 * @param options.color="#ff000080" {string} 颜色
* @param options.height {number} 高度 * @param options.height {number} 高度
* @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式
* @param {Array.<object>} options.positions 坐标数组 [{lon,lat,alt},...] * @param {Array.<object>} options.positions 坐标数组 [{lon,lat,alt},...]
@ -34,13 +34,13 @@ class AssembleObject extends Base {
constructor(sdk, options = {}, _Dialog = {}) { constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options); super(sdk, options);
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.color = options.color || "#36c4ff" this.options.color = options.color || "#ff000080"
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2 this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2
this.options.positions = options.positions || [] this.options.positions = options.positions || []
this.options.line = options.line || {} this.options.line = options.line || {}
this.options.line.width = this.options.line.width || 2 this.options.line.width = ((this.options.line.width || this.options.line.width === 0) ? this.options.line.width : 3)
this.options.line.color = this.options.line.color || 'rgba(155, 155, 124, 0.89)' this.options.line.color = this.options.line.color || '#ff000080'
this.options['area-unit'] = options['area-unit'] || '平方米' this.options['area-unit'] = options['area-unit'] || '平方米'
this.entity this.entity
this.event = new MouseEvent(this.sdk) this.event = new MouseEvent(this.sdk)
@ -57,8 +57,8 @@ class AssembleObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -106,14 +106,14 @@ class AssembleObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
let material = Cesium.Color.fromCssColorString(v) let material = Cesium.Color.fromCssColorString(this.options.color)
if (this.sdk.viewer.scene.mode === 2) { if (this.sdk.viewer.scene.mode === 2) {
material = new Cesium.CustomColorMaterialSource({ material = new Cesium.CustomColorMaterialSource({
color: v color: this.options.color
}) })
} }
this.entity.polygon.material = material this.entity.polygon.material = material
@ -123,14 +123,14 @@ class AssembleObject extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.color = c this.color = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -238,25 +238,25 @@ class AssembleObject extends Base {
return this.options.line.color return this.options.line.color
} }
set lineColor(v) { set lineColor(v) {
this.options.line.color = v this.options.line.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) {
return return
} }
this.entity.polyline.material = Cesium.Color.fromCssColorString(v) this.entity.polyline.material = Cesium.Color.fromCssColorString(this.options.line.color)
if (this._elms.lineColor) { if (this._elms.lineColor) {
this._elms.lineColor.forEach((item, i) => { this._elms.lineColor.forEach((item, i) => {
let lineColorPicker = new ewPlugins('colorpicker', { let lineColorPicker = new ewPlugins('colorpicker', {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.line.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.lineColor = c this.lineColor = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.lineColor = 'rgba(255,255,255,1)' this.lineColor = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.lineColor[i] = lineColorPicker this._elms.lineColor[i] = lineColorPicker
@ -268,10 +268,10 @@ class AssembleObject extends Base {
return this.options.line.width return this.options.line.width
} }
set lineWidth(v) { set lineWidth(v) {
this.options.line.width = v this.options.line.width = ((v || v === 0) ? v : 3)
this.entity.polyline.width = v this.entity.polyline.width = this.options.line.width
this._elms.lineColor && this._elms.lineColor.forEach((item) => { this._elms.lineColor && this._elms.lineColor.forEach((item) => {
item.value = v item.value = this.options.line.width
}) })
} }
@ -464,7 +464,7 @@ class AssembleObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -24,7 +24,7 @@ class AttackArrowObject extends Base {
* @param options {object} 属性 * @param options {object} 属性
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.color="#36c4ff" {string} 颜色 * @param options.color="#ff000080" {string} 颜色
* @param options.height {number} 高度 * @param options.height {number} 高度
* @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式
* @param {Array.<object>} options.positions 坐标数组 [{lon,lat,alt},...] * @param {Array.<object>} options.positions 坐标数组 [{lon,lat,alt},...]
@ -34,13 +34,13 @@ class AttackArrowObject extends Base {
constructor(sdk, options = {}, _Dialog = {}) { constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options); super(sdk, options);
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.color = options.color || "#36c4ff" this.options.color = options.color || "#ff000080"
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options.positions = options.positions || [] this.options.positions = options.positions || []
this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2 this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2
this.options.line = options.line || {} this.options.line = options.line || {}
this.options.line.width = this.options.line.width || 2 this.options.line.width = ((this.options.line.width || this.options.line.width === 0) ? this.options.line.width : 3)
this.options.line.color = this.options.line.color || 'rgba(155, 155, 124, 0.89)' this.options.line.color = this.options.line.color || '#ff000080'
this.options['area-unit'] = options['area-unit'] || '平方米' this.options['area-unit'] = options['area-unit'] || '平方米'
this.entity this.entity
this.event = new MouseEvent(this.sdk) this.event = new MouseEvent(this.sdk)
@ -61,8 +61,8 @@ class AttackArrowObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -110,14 +110,14 @@ class AttackArrowObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
let material = Cesium.Color.fromCssColorString(v) let material = Cesium.Color.fromCssColorString(this.options.color)
if (this.sdk.viewer.scene.mode === 2) { if (this.sdk.viewer.scene.mode === 2) {
material = new Cesium.CustomColorMaterialSource({ material = new Cesium.CustomColorMaterialSource({
color: v color: this.options.color
}) })
} }
this.entity.polygon.material = material this.entity.polygon.material = material
@ -127,14 +127,14 @@ class AttackArrowObject extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.color = c this.color = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -243,25 +243,25 @@ class AttackArrowObject extends Base {
return this.options.line.color return this.options.line.color
} }
set lineColor(v) { set lineColor(v) {
this.options.line.color = v this.options.line.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) {
return return
} }
this.entity.polyline.material = Cesium.Color.fromCssColorString(v) this.entity.polyline.material = Cesium.Color.fromCssColorString(this.options.line.color)
if (this._elms.lineColor) { if (this._elms.lineColor) {
this._elms.lineColor.forEach((item, i) => { this._elms.lineColor.forEach((item, i) => {
let lineColorPicker = new ewPlugins('colorpicker', { let lineColorPicker = new ewPlugins('colorpicker', {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.line.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.lineColor = c this.lineColor = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.lineColor = 'rgba(255,255,255,1)' this.lineColor = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.lineColor[i] = lineColorPicker this._elms.lineColor[i] = lineColorPicker
@ -273,8 +273,8 @@ class AttackArrowObject extends Base {
return this.options.line.width return this.options.line.width
} }
set lineWidth(v) { set lineWidth(v) {
this.options.line.width = v this.options.line.width = ((v || v === 0) ? v : 3)
this.entity.polyline.width = v this.entity.polyline.width = this.options.line.width
this._elms.lineColor && this._elms.lineColor.forEach((item) => { this._elms.lineColor && this._elms.lineColor.forEach((item) => {
item.value = v item.value = v
}) })
@ -469,7 +469,7 @@ class AttackArrowObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -33,6 +33,7 @@ class ArcgisLayer extends BaseLayer {
} else { } else {
this.entity = this.sdk.viewer.imageryLayers.addImageryProvider(imageryProvider,) this.entity = this.sdk.viewer.imageryLayers.addImageryProvider(imageryProvider,)
} }
this.entity._id = this.options.id
for (let i = 0; i < this.sdk.viewer.imageryLayers._layers.length; i++) { for (let i = 0; i < this.sdk.viewer.imageryLayers._layers.length; i++) {
if (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider && this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type && (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'flw' || this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'jww')) { if (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider && this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type && (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'flw' || this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'jww')) {
let layer = this.sdk.viewer.imageryLayers._layers[i] let layer = this.sdk.viewer.imageryLayers._layers[i]

View File

@ -30,6 +30,7 @@ class GdImagery extends BaseLayer {
} else { } else {
this.entity = this.sdk.viewer.imageryLayers.addImageryProvider(gdLayer,) this.entity = this.sdk.viewer.imageryLayers.addImageryProvider(gdLayer,)
} }
this.entity._id = this.options.id
for (let i = 0; i < this.sdk.viewer.imageryLayers._layers.length; i++) { for (let i = 0; i < this.sdk.viewer.imageryLayers._layers.length; i++) {
if (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider && this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type && (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'flw' || this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'jww')) { if (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider && this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type && (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'flw' || this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'jww')) {
let layer = this.sdk.viewer.imageryLayers._layers[i] let layer = this.sdk.viewer.imageryLayers._layers[i]

View File

@ -126,6 +126,7 @@ class Layer extends BaseLayer {
this.entity = this.entity =
this.sdk.viewer.scene.imageryLayers.addImageryProvider(layer,) this.sdk.viewer.scene.imageryLayers.addImageryProvider(layer,)
} }
this.entity._id = this.options.id
for (let i = 0; i < this.sdk.viewer.imageryLayers._layers.length; i++) { for (let i = 0; i < this.sdk.viewer.imageryLayers._layers.length; i++) {
if (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider && this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type && (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'flw' || this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'jww')) { if (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider && this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type && (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'flw' || this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'jww')) {
let layer = this.sdk.viewer.imageryLayers._layers[i] let layer = this.sdk.viewer.imageryLayers._layers[i]

View File

@ -37,6 +37,7 @@ class Layer3rdparty extends BaseLayer {
this.entity = this.entity =
this.sdk.viewer.scene.imageryLayers.addImageryProvider(layer,) this.sdk.viewer.scene.imageryLayers.addImageryProvider(layer,)
} }
this.entity._id = this.options.id
for (let i = 0; i < this.sdk.viewer.imageryLayers._layers.length; i++) { for (let i = 0; i < this.sdk.viewer.imageryLayers._layers.length; i++) {
if (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider && this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type && (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'flw' || this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'jww')) { if (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider && this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type && (this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'flw' || this.sdk.viewer.imageryLayers._layers[i]._imageryProvider._type === 'jww')) {
let layer = this.sdk.viewer.imageryLayers._layers[i] let layer = this.sdk.viewer.imageryLayers._layers[i]

View File

@ -28,11 +28,11 @@ class BaseLayer extends BaseSource {
} }
get layerIndex() { get layerIndex() {
return this.entity._layerIndex return this.entity ? this.entity._layerIndex : undefined
} }
get layer_index() { get layer_index() {
return this.entity._layerIndex return this.entity ? this.entity._layerIndex : undefined
} }
get brightness() { get brightness() {

View File

@ -56,7 +56,7 @@ function html(that) {
</div> </div>
</div> </div>
<div class="col"> <div class="col">
<span class="label">视野缩放</span> <span class="label">固定大小</span>
<input class="btn-switch" type="checkbox" @model="scaleByDistance"> <input class="btn-switch" type="checkbox" @model="scaleByDistance">
</div> </div>
</div> </div>

View File

@ -100,8 +100,8 @@ class Model extends BaseModel {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -145,15 +145,7 @@ class Model extends BaseModel {
if (!this.sdk || !this.sdk.viewer || !this.sdk.viewer.scene) { if (!this.sdk || !this.sdk.viewer || !this.sdk.viewer.scene) {
return return
} }
if (!url.startsWith("http")) { url = this.replaceHost(url, this.options.host)
//说明是本地的json在磁盘中存在的
if (!url.includes(":")) {
if (this.options.host) {
let o = new URL(url, this.options.host)
url = o.href
}
}
}
// this.handler = new Cesium.ScreenSpaceEventHandler( // this.handler = new Cesium.ScreenSpaceEventHandler(
// this.sdk.viewer.canvas // this.sdk.viewer.canvas
// ) // )
@ -791,7 +783,7 @@ class Model extends BaseModel {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker
@ -1336,7 +1328,9 @@ class Model extends BaseModel {
this.name = this.options.name || '未命名对象' this.name = this.options.name || '未命名对象'
this.originalOptions = this.deepCopyObj(this.options) this.originalOptions = this.deepCopyObj(this.options)
this._DialogObject.close() this._DialogObject.close()
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(this.originalOptions) let cdoptions = this.deepCopyObj(this.options)
cdoptions.host = ''
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(cdoptions)
syncData(this.sdk, this.options.id) syncData(this.sdk, this.options.id)
syncSplitData(this.sdk, this.options.id) syncSplitData(this.sdk, this.options.id)
}, },

View File

@ -247,7 +247,9 @@ class BaseTerrain extends BaseSource {
} }
this.originalOptions = this.deepCopyObj(this.options) this.originalOptions = this.deepCopyObj(this.options)
this._DialogObject.close() this._DialogObject.close()
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(this.originalOptions) let cdoptions = this.deepCopyObj(this.options)
cdoptions.host = ''
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(cdoptions)
}, },
// resetCallBack: () => { // resetCallBack: () => {
// this.name = this.originalOptions.name // this.name = this.originalOptions.name

View File

@ -63,9 +63,9 @@ class BillboardObject extends Base {
*@param options.label {object} 标注文字的参数 *@param options.label {object} 标注文字的参数
*@param [options.label.text] {string} 标注中文字 *@param [options.label.text] {string} 标注中文字
*@param [options.label.show=true] {boolean} 标注文字显示/隐藏 *@param [options.label.show=true] {boolean} 标注文字显示/隐藏
*@param [options.label.fontFamily=0] {number} 标注文字字体 0思源黑体1:庞门正道标题体;2:数黑体 *@param [options.label.fontFamily=0] {number} 标注文字字体 0黑体1思源黑体;2:庞门正道标题体;3:数黑体
*@param [options.label.fontSize=39] {number} 标注文字大小 单位px微软雅黑 *@param [options.label.fontSize=39] {number} 标注文字大小 单位px微软雅黑
*@param [options.label.color=#07f8e4] {string} 标注文字颜色 *@param [options.label.color=#00ffff] {string} 标注文字颜色
*@param _Dialog {object} 弹框事件 *@param _Dialog {object} 弹框事件
*@param _Dialog.confirmCallBack {function} 弹框确认时的回调 *@param _Dialog.confirmCallBack {function} 弹框确认时的回调
*@param _Dialog.instructSubmit(id,name,instruct) {function} 提交指令ID, 名称,指令内容) *@param _Dialog.instructSubmit(id,name,instruct) {function} 提交指令ID, 名称,指令内容)
@ -107,7 +107,7 @@ class BillboardObject extends Base {
: true : true
this.options.label.fontFamily = options.label.fontFamily || 0 this.options.label.fontFamily = options.label.fontFamily || 0
this.options.label.fontSize = options.label.fontSize || 39 this.options.label.fontSize = options.label.fontSize || 39
this.options.label.color = options.label.color || '#FFFF00' this.options.label.color = options.label.color || '#00ffff'
this.options.positions = options.positions = options.positions || {} this.options.positions = options.positions = options.positions || {}
this.options.positions.lng = Number( this.options.positions.lng = Number(
Number(options.positions.lng || 0).toFixed(8) Number(options.positions.lng || 0).toFixed(8)
@ -211,8 +211,9 @@ class BillboardObject extends Base {
let index = 0 let index = 0
let font = getFontFamily(that.labelFontFamily) || 'Helvetica' let font = getFontFamily(that.labelFontFamily) || 'Helvetica'
let url = that.replaceHost(that.options.billboard.image, that.options.host)
that._frameImages = [] that._frameImages = []
if (that.options.billboard.image && that.options.billboard.image.endsWith('gif')) { if (url && url.endsWith('gif')) {
isGlf = true isGlf = true
switch (that.options.heightMode) { switch (that.options.heightMode) {
case 2: case 2:
@ -222,7 +223,7 @@ class BillboardObject extends Base {
} }
let gifImg = document.createElement('img') let gifImg = document.createElement('img')
gifImg.setAttribute('rel:animated_src', that.options.billboard.image) gifImg.setAttribute('rel:animated_src', url)
gifImg.setAttribute('rel:auto_play', '1') gifImg.setAttribute('rel:auto_play', '1')
const imgDiv = document.createElement('div') const imgDiv = document.createElement('div')
imgDiv.appendChild(gifImg) imgDiv.appendChild(gifImg)
@ -272,7 +273,7 @@ class BillboardObject extends Base {
else { else {
let image = new Image() let image = new Image()
image.src = image.src =
that.options.billboard.image || url ||
that.getSourceRootPath() + '/img/A-ablu-blank.png' that.getSourceRootPath() + '/img/A-ablu-blank.png'
switch (that.options.heightMode) { switch (that.options.heightMode) {
case 2: case 2:
@ -720,11 +721,21 @@ class BillboardObject extends Base {
} }
get billboardImage() { get billboardImage() {
return this.options.billboard.image let url = this.options.billboard.image
if (url && !url.startsWith("http")) {
//说明是本地的json在磁盘中存在的
if (!url.includes(":")) {
if (this.options.host) {
let o = new URL(url, this.options.host)
url = o.href
}
}
}
return url
} }
set billboardImage(v) { set billboardImage(v) {
let _this = this let _this = this
this.options.billboard.image = v this.options.billboard.image = this.replaceHost(v, this.options.host)
let url = let url =
this.options.billboard.image || this.options.billboard.image ||
getBillboardDefaultUrl(this.options.billboard.defaultImage) || getBillboardDefaultUrl(this.options.billboard.defaultImage) ||
@ -916,7 +927,7 @@ class BillboardObject extends Base {
return this.options.label.color return this.options.label.color
} }
set labelColor(v) { set labelColor(v) {
this.options.label.color = v this.options.label.color = v || '#00ffff'
this.renewPoint() this.renewPoint()
if (this._elms.labelColor) { if (this._elms.labelColor) {
this._elms.labelColor.forEach((item, i) => { this._elms.labelColor.forEach((item, i) => {
@ -924,14 +935,14 @@ class BillboardObject extends Base {
el: item.el, el: item.el,
size: 'mini', //颜色box类型 size: 'mini', //颜色box类型
alpha: true, //是否开启透明度 alpha: true, //是否开启透明度
defaultColor: v, defaultColor: this.options.label.color,
disabled: false, //是否禁止打开颜色选择器 disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画 openPickerAni: 'opacity', //打开颜色选择器动画
sure: c => { sure: c => {
this.labelColor = c this.labelColor = c
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
this.labelColor = 'rgba(255,255,255,1)' this.labelColor = 'rgba(0,255,255,1)'
} //点击清空按钮事件回调 } //点击清空按钮事件回调
}) })
this._elms.labelColor[i] = colorPicker this._elms.labelColor[i] = colorPicker
@ -1497,10 +1508,11 @@ class BillboardObject extends Base {
} }
set billboardDefaultImage(v) { set billboardDefaultImage(v) {
setBillboardDefaultUrl(v, this.options.billboard.defaultImage) let url = this.replaceHost(v, this.options.host)
setBillboardDefaultUrl(url, this.options.billboard.defaultImage)
this._elms.billboardDefaultImage && this._elms.billboardDefaultImage &&
this._elms.billboardDefaultImage.forEach(item => { this._elms.billboardDefaultImage.forEach(item => {
item.src = v item.src = url
}) })
} }
@ -1575,8 +1587,10 @@ class BillboardObject extends Base {
} }
this.originalOptions = this.deepCopyObj(this.options) this.originalOptions = this.deepCopyObj(this.options)
this._DialogObject.close() this._DialogObject.close()
let cdoptions = this.deepCopyObj(this.options)
cdoptions.host = ''
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack &&
this.Dialog.confirmCallBack(this.originalOptions) this.Dialog.confirmCallBack(cdoptions)
syncData(this.sdk, this.options.id) syncData(this.sdk, this.options.id)
syncSplitData(this.sdk, this.options.id) syncSplitData(this.sdk, this.options.id)
}, },
@ -1812,7 +1826,13 @@ class BillboardObject extends Base {
case '2': case '2':
case 3: case 3:
case '3': case '3':
this.getClampToHeight(this.options.positions).then(h => { let objectsToExclude = []
for (let [key, value] of this.sdk.entityMap) {
if (value.type === 'RadarScanStereoscopic' && value.entity) {
objectsToExclude.push(value.entity)
}
}
this.getClampToHeight(this.options.positions, objectsToExclude).then(h => {
this.alt = Number(h.toFixed(2)) this.alt = Number(h.toFixed(2))
heightElm.value = this.alt heightElm.value = this.alt
}) })
@ -1876,7 +1896,13 @@ class BillboardObject extends Base {
break break
case 3: case 3:
case '3': case '3':
this.getClampToHeight(this.options.positions).then(h => { let objectsToExclude = []
for (let [key, value] of this.sdk.entityMap) {
if (value.type === 'RadarScanStereoscopic' && value.entity) {
objectsToExclude.push(value.entity)
}
}
this.getClampToHeight(this.options.positions, objectsToExclude).then(h => {
this.alt = Number(h.toFixed(2)) this.alt = Number(h.toFixed(2))
}) })
this.heightMode = 3 this.heightMode = 3
@ -2330,9 +2356,14 @@ class BillboardObject extends Base {
this.options.positions.lat, this.options.positions.lat,
10000000000000 10000000000000
) )
let updatedCartesians = await this.sdk.viewer.scene.clampToHeightMostDetailed(
[point1] let objectsToExclude = []
) for (let [key, value] of this.sdk.entityMap) {
if (value.type === 'RadarScanStereoscopic' && value.entity) {
objectsToExclude.push(value.entity)
}
}
let updatedCartesians = await this.sdk.viewer.scene.clampToHeightMostDetailed([point1], objectsToExclude)
if (updatedCartesians && updatedCartesians[0]) { if (updatedCartesians && updatedCartesians[0]) {
height = this.cartesian3Towgs84(updatedCartesians[0], this.sdk.viewer).alt height = this.cartesian3Towgs84(updatedCartesians[0], this.sdk.viewer).alt
} }
@ -2471,7 +2502,13 @@ class BillboardObject extends Base {
} }
// 如果没有高度值,则获取紧贴高度计算 // 如果没有高度值,则获取紧贴高度计算
if (!position.hasOwnProperty('alt')) { if (!position.hasOwnProperty('alt')) {
position.alt = await this.getClampToHeight(position) let objectsToExclude = []
for (let [key, value] of this.sdk.entityMap) {
if (value.type === 'RadarScanStereoscopic' && value.entity) {
objectsToExclude.push(value.entity)
}
}
position.alt = await this.getClampToHeight(position, objectsToExclude)
} }
lng = this.options.customView.relativePosition.lng + position.lng lng = this.options.customView.relativePosition.lng + position.lng
lat = this.options.customView.relativePosition.lat + position.lat lat = this.options.customView.relativePosition.lat + position.lat
@ -2482,7 +2519,13 @@ class BillboardObject extends Base {
orientation: orientation orientation: orientation
}) })
} else { } else {
let height = await this.getClampToHeight(this.options.positions) let objectsToExclude = []
for (let [key, value] of this.sdk.entityMap) {
if (value.type === 'RadarScanStereoscopic' && value.entity) {
objectsToExclude.push(value.entity)
}
}
let height = await this.getClampToHeight(this.options.positions, objectsToExclude)
this.sdk.viewer.camera.flyTo({ this.sdk.viewer.camera.flyTo({
orientation: options.orientation, orientation: options.orientation,
destination: Cesium.Cartesian3.fromDegrees( destination: Cesium.Cartesian3.fromDegrees(
@ -2650,7 +2693,13 @@ class BillboardObject extends Base {
} }
// 如果没有高度值,则获取紧贴高度计算 // 如果没有高度值,则获取紧贴高度计算
if (!position.hasOwnProperty('alt')) { if (!position.hasOwnProperty('alt')) {
position.alt = await this.getClampToHeight(position) let objectsToExclude = []
for (let [key, value] of this.sdk.entityMap) {
if (value.type === 'RadarScanStereoscopic' && value.entity) {
objectsToExclude.push(value.entity)
}
}
position.alt = await this.getClampToHeight(position, objectsToExclude)
} }
relativePosition = { relativePosition = {
lng: cameraPosition84.lng - position.lng, lng: cameraPosition84.lng - position.lng,

View File

@ -75,8 +75,8 @@ class CircleDiffuse extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -573,7 +573,7 @@ class CircleDiffuse extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -23,7 +23,7 @@ class CircleObject extends Base {
* @param options.id {string} 标注id * @param options.id {string} 标注id
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.color="#36c4ff" {string} 颜色 * @param options.color="#ff000080" {string} 颜色
* @param options.center {object} 位置 * @param options.center {object} 位置
* @param options.center.lng {object} 经度 * @param options.center.lng {object} 经度
* @param options.center.lat {object} 纬度 * @param options.center.lat {object} 纬度
@ -31,21 +31,21 @@ class CircleObject extends Base {
* @param options.radius=10 {object}半径 * @param options.radius=10 {object}半径
* @param options.line {object} 边框 * @param options.line {object} 边框
* @param options.line.width=2 {string} 边框宽 * @param options.line.width=2 {string} 边框宽
* @param options.line.color="rgba(155, 155, 124, 0.89)" {string} 边框颜色 * @param options.line.color="#ff000080" {string} 边框颜色
* @param options.label {object} 标注 * @param options.label {object} 标注
* @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式
*/ */
constructor(sdk, options = {}) { constructor(sdk, options = {}) {
super(sdk, options); super(sdk, options);
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.color = options.color || "#36c4ff" this.options.color = options.color || "#ff000080"
this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2 this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2
this.options.radius = (options.radius || options.radius === 0) ? options.radius : 10 this.options.radius = (options.radius || options.radius === 0) ? options.radius : 10
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options.center = options.center || {} this.options.center = options.center || {}
this.options.line = options.line || {} this.options.line = options.line || {}
this.options.line.width = this.options.line.width || 2 this.options.line.width = ((this.options.line.width || this.options.line.width === 0) ? this.options.line.width : 3)
this.options.line.color = this.options.line.color || 'rgba(155, 155, 124, 0.89)' this.options.line.color = this.options.line.color || '#ff000080'
this.options['area-unit'] = options['area-unit'] || '平方米' this.options['area-unit'] = options['area-unit'] || '平方米'
options.label = options.label || {} options.label = options.label || {}
this._elms = {}; this._elms = {};
@ -58,8 +58,8 @@ class CircleObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -216,14 +216,14 @@ class CircleObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
let material = Cesium.Color.fromCssColorString(v) let material = Cesium.Color.fromCssColorString(this.options.color)
if (this.sdk.viewer.scene.mode === 2) { if (this.sdk.viewer.scene.mode === 2) {
material = new Cesium.CustomColorMaterialSource({ material = new Cesium.CustomColorMaterialSource({
color: v color: this.options.color
}) })
} }
this.entity.polygon.material = material this.entity.polygon.material = material
@ -233,14 +233,14 @@ class CircleObject extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.color = c this.color = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -252,25 +252,25 @@ class CircleObject extends Base {
return this.options.line.color return this.options.line.color
} }
set lineColor(v) { set lineColor(v) {
this.options.line.color = v this.options.line.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) {
return return
} }
this.entity.polyline.material = Cesium.Color.fromCssColorString(v) this.entity.polyline.material = Cesium.Color.fromCssColorString(this.options.line.color)
if (this._elms.lineColor) { if (this._elms.lineColor) {
this._elms.lineColor.forEach((item, i) => { this._elms.lineColor.forEach((item, i) => {
let lineColorPicker = new ewPlugins('colorpicker', { let lineColorPicker = new ewPlugins('colorpicker', {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.line.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.lineColor = c this.lineColor = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.lineColor = 'rgba(255,255,255,1)' this.lineColor = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.lineColor[i] = lineColorPicker this._elms.lineColor[i] = lineColorPicker
@ -282,8 +282,8 @@ class CircleObject extends Base {
return this.options.line.width return this.options.line.width
} }
set lineWidth(v) { set lineWidth(v) {
this.options.line.width = v this.options.line.width = ((v || v === 0) ? v : 3)
this.entity.polyline.width = v this.entity.polyline.width = this.options.line.width
this._elms.lineWidth && this._elms.lineWidth.forEach((item) => { this._elms.lineWidth && this._elms.lineWidth.forEach((item) => {
item.value = v item.value = v
}) })
@ -478,7 +478,7 @@ class CircleObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -24,8 +24,8 @@ class CurvelineObject extends Base {
* @description 折线 * @description 折线
* @param options {object} 线属性 * @param options {object} 线属性
* @param options.name{string} 名称 * @param options.name{string} 名称
* @param options.width=5{number} 线宽 * @param options.width=3{number} 线宽
* @param options.color=#0df89e {string} 颜色 * @param options.color=#ff0000 {string} 颜色
* @param options.type=0 {number} 材质类型 0-实线 1-虚线 2-泛光 * @param options.type=0 {number} 材质类型 0-实线 1-虚线 2-泛光
* @param options.heightMode{number} 高度模式0海拔高度1相对高度2依附模式 * @param options.heightMode{number} 高度模式0海拔高度1相对高度2依附模式
* @param options['nose-to-tail']=false {boolean} 首尾相连 * @param options['nose-to-tail']=false {boolean} 首尾相连
@ -51,8 +51,8 @@ class CurvelineObject extends Base {
constructor(sdk, options = {}, _Dialog = {}) { constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options) super(sdk, options)
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.width = options.width || 10 this.options.width = ((options.width || options.width === 0) ? options.width : 3)
this.options.color = options.color || '#0df89e' this.options.color = options.color || '#ff0000'
this.options.type = options.type ? Number(options.type) : 0 this.options.type = options.type ? Number(options.type) : 0
this.options['nose-to-tail'] = options['nose-to-tail'] || false this.options['nose-to-tail'] = options['nose-to-tail'] || false
this.options.extend = options.extend || false this.options.extend = options.extend || false
@ -86,8 +86,8 @@ class CurvelineObject extends Base {
options.label.pixelOffset || options.label.pixelOffset === 0 options.label.pixelOffset || options.label.pixelOffset === 0
? options.label.pixelOffset ? options.label.pixelOffset
: 20, : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: near:
options.label.near || options.label.near === 0 options.label.near || options.label.near === 0
@ -143,7 +143,7 @@ class CurvelineObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff0000'
this.entity.polyline.material = this.getMaterial(v, this.options.type) this.entity.polyline.material = this.getMaterial(v, this.options.type)
if (this._elms.color) { if (this._elms.color) {
this._elms.color.forEach((item, i) => { this._elms.color.forEach((item, i) => {
@ -151,14 +151,14 @@ class CurvelineObject extends Base {
el: item.el, el: item.el,
size: 'mini', //颜色box类型 size: 'mini', //颜色box类型
alpha: true, //是否开启透明度 alpha: true, //是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false, //是否禁止打开颜色选择器 disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画 openPickerAni: 'opacity', //打开颜色选择器动画
sure: c => { sure: c => {
this.color = c this.color = c
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,1)'
} //点击清空按钮事件回调 } //点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -243,10 +243,10 @@ class CurvelineObject extends Base {
} }
set lineWidth(v) { set lineWidth(v) {
this.options.width = v this.options.width = (v || v == 0) ? v : 3
this._elms.lineWidth && this._elms.lineWidth &&
this._elms.lineWidth.forEach(item => { this._elms.lineWidth.forEach(item => {
item.value = v item.value = this.options.width
}) })
this.entity && this.entity &&
this.entity.polyline && this.entity.polyline &&
@ -623,7 +623,7 @@ class CurvelineObject extends Base {
this.labelLineColor = color this.labelLineColor = color
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
} //点击清空按钮事件回调 } //点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -1,5 +1,5 @@
/** /**
* 圆 *
*/ */
import Dialog from '../../Element/Dialog'; import Dialog from '../../Element/Dialog';
import cy_tabs from "../../Element/cy_html_tabs"; import cy_tabs from "../../Element/cy_html_tabs";
@ -24,7 +24,7 @@ class EllipseObject extends Base {
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.center {object} 位置 * @param options.center {object} 位置
* @param options.color="#36c4ff" {string} 颜色 * @param options.color="#ff000080" {string} 颜色
* @param options.center.lng {object} 经度 * @param options.center.lng {object} 经度
* @param options.center.lat {object} 维度 * @param options.center.lat {object} 维度
* @param options.semiMinorAxis=10 {number} 短半轴长度 * @param options.semiMinorAxis=10 {number} 短半轴长度
@ -32,22 +32,22 @@ class EllipseObject extends Base {
* @param options.bearing=0 {number} 旋转角度 * @param options.bearing=0 {number} 旋转角度
* @param options.line {object} 边框 * @param options.line {object} 边框
* @param options.line.width=2 {string} 边框宽 * @param options.line.width=2 {string} 边框宽
* @param options.line.color="rgba(155, 155, 124, 0.89)" {string} 边框颜色 * @param options.line.color="#ff000080" {string} 边框颜色
* @param options.label {object} 标注 * @param options.label {object} 标注
* @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式
*/ */
constructor(sdk, options = {}) { constructor(sdk, options = {}) {
super(sdk, options); super(sdk, options);
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.color = options.color || "#36c4ff" this.options.color = options.color || "#ff000080"
this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2 this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2
this.options.semiMinorAxis = (options.semiMinorAxis || options.semiMinorAxis === 0) ? options.semiMinorAxis : 10 this.options.semiMinorAxis = (options.semiMinorAxis || options.semiMinorAxis === 0) ? options.semiMinorAxis : 10
this.options.semiMajorAxis = (options.semiMajorAxis || options.semiMajorAxis === 0) ? options.semiMajorAxis : 20 this.options.semiMajorAxis = (options.semiMajorAxis || options.semiMajorAxis === 0) ? options.semiMajorAxis : 20
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options.center = options.center || {} this.options.center = options.center || {}
this.options.line = options.line || {} this.options.line = options.line || {}
this.options.line.width = this.options.line.width || 2 this.options.line.width = ((this.options.line.width || this.options.line.width === 0) ? this.options.line.width : 3)
this.options.line.color = this.options.line.color || 'rgba(155, 155, 124, 0.89)' this.options.line.color = this.options.line.color || '#ff000080'
this.options['area-unit'] = options['area-unit'] || '平方米' this.options['area-unit'] = options['area-unit'] || '平方米'
options.label = options.label || {} options.label = options.label || {}
this._elms = {}; this._elms = {};
@ -60,8 +60,8 @@ class EllipseObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -229,14 +229,14 @@ class EllipseObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
let material = Cesium.Color.fromCssColorString(v) let material = Cesium.Color.fromCssColorString(this.options.color)
if (this.sdk.viewer.scene.mode === 2) { if (this.sdk.viewer.scene.mode === 2) {
material = new Cesium.CustomColorMaterialSource({ material = new Cesium.CustomColorMaterialSource({
color: v color: this.options.color
}) })
} }
this.entity.polygon.material = material this.entity.polygon.material = material
@ -247,14 +247,14 @@ class EllipseObject extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.color = c this.color = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -266,25 +266,25 @@ class EllipseObject extends Base {
return this.options.line.color return this.options.line.color
} }
set lineColor(v) { set lineColor(v) {
this.options.line.color = v this.options.line.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) {
return return
} }
this.entity.polyline.material = Cesium.Color.fromCssColorString(v) this.entity.polyline.material = Cesium.Color.fromCssColorString(this.options.line.color)
if (this._elms.lineColor) { if (this._elms.lineColor) {
this._elms.lineColor.forEach((item, i) => { this._elms.lineColor.forEach((item, i) => {
let lineColorPicker = new ewPlugins('colorpicker', { let lineColorPicker = new ewPlugins('colorpicker', {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.line.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.lineColor = c this.lineColor = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.lineColor = 'rgba(255,255,255,1)' this.lineColor = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.lineColor[i] = lineColorPicker this._elms.lineColor[i] = lineColorPicker
@ -296,10 +296,10 @@ class EllipseObject extends Base {
return this.options.line.width return this.options.line.width
} }
set lineWidth(v) { set lineWidth(v) {
this.options.line.width = v this.options.line.width = ((v || v === 0) ? v : 3)
this.entity.polyline.width = v this.entity.polyline.width = this.options.line.width
this._elms.lineWidth && this._elms.lineWidth.forEach((item) => { this._elms.lineWidth && this._elms.lineWidth.forEach((item) => {
item.value = v item.value = this.options.line.width
}) })
} }
@ -492,7 +492,7 @@ class EllipseObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -0,0 +1,76 @@
function html() {
return `
<span class="custom-divider"></span>
<div class="div-item">
<div class="row">
<div class="col">
<span class="label">名称</span>
<input class="input" maxlength="40" type="text" @model="name">
</div>
<div class="col">
<span class="label">颜色</span>
<div class="flowLine-color"></div>
</div>
</div>
</div>
<span class="custom-divider"></span>
<div class="div-item">
<div class="row">
<div class="col">
<span class="label">飞线数量</span>
<div class="input-number input-number-unit-1">
<input class="input" type="number" title="" min="1" max="99999" @model="pointNumber">
<span class="arrow"></span>
</div>
</div>
<div class="col">
<span class="label">飞线宽度</span>
<div class="input-number input-number-unit-1">
<input class="input" type="number" title="" max="99999" min="1" step="1" @model="width">
<span class="arrow"></span>
</div>
</div>
</div>
</div>
<div class="div-item">
<div class="row">
<div class="col">
<span class="label">飞线高度</span>
<div class="input-number input-number-unit-1">
<input class="input" type="number" title="" min="0" max="999999" step="1" @model="height">
<span class="arrow"></span>
</div>
</div>
<div class="col">
<span class="label">飞线高度差</span>
<div class="input-number input-number-unit-1">
<input class="input" type="number" title="" max="99999" min="0" step="1" @model="heightDifference">
<span class="arrow"></span>
</div>
</div>
</div>
</div>
<div class="div-item">
<div class="row">
<div class="col">
<span class="label">单次运动时长s</span>
<div class="input-number input-number-unit-1">
<input class="input" type="number" title="" max="999999999" min="1" step="1" @model="duration">
<span class="arrow"></span>
</div>
</div>
<div class="col">
<span class="label">轨迹透明度</span>
<div class="input-number input-number-unit-1">
<input class="input" type="number" title="" max="1" min="0.01" step="0.01" @model="lineBackAlpha">
<span class="arrow"></span>
</div>
</div>
</div>
</div>
<span class="custom-divider"></span>
`
}
export { html }

View File

@ -0,0 +1,92 @@
class eventBinding {
constructor() {
this.element = {}
}
static event = {}
getEvent(name) {
return eventBinding.event[name]
}
getEventAll() {
return eventBinding.event
}
setEvent(name, event) {
eventBinding.event[name] = event
}
on(that, elements) {
for (let i = 0; i < elements.length; i++) {
let Event = []
let isEvent = false
let removeName = []
if (!elements[i] || !elements[i].attributes) {
continue;
}
for (let m of elements[i].attributes) {
switch (m.name) {
case '@model': {
isEvent = true
if (elements[i].type == 'checkbox') {
Event.push((e) => { that[m.value] = e.target.checked })
elements[i].checked = that[m.value]
}
else {
Event.push((e) => {
let value = e.target.value
if (e.target.type == 'number') {
value = Number(value)
}
that[m.value] = value
})
if (elements[i].nodeName == 'IMG') {
elements[i].src = that[m.value]
}
else {
elements[i].value = that[m.value]
}
}
if (this.element[m.value]) {
this.element[m.value].push(elements[i])
}
else {
this.element[m.value] = [elements[i]]
}
removeName.push(m.name)
break;
}
case '@click': {
elements[i].addEventListener('click', (e) => {
if (typeof (that.Dialog[m.value]) === 'function') {
that.Dialog[m.value](e)
}
});
removeName.push(m.name)
// elements[i].attributes.removeNamedItem(m.name)
break;
}
}
// elements[i].attributes[m] = undefined
}
for (let n = 0; n < removeName.length; n++) {
elements[i].attributes.removeNamedItem(removeName[n])
}
if (isEvent) {
let ventType = 'input'
if (elements[i].tagName != 'INPUT' || elements[i].type == 'checkbox') {
ventType = 'change'
}
elements[i].addEventListener(ventType, (e) => {
for (let t = 0; t < Event.length; t++) {
Event[t](e)
}
});
}
}
}
}
const EventBinding = new eventBinding();
export default EventBinding;

View File

@ -0,0 +1,485 @@
/**
* @description 水面
*/
import Dialog from '../../Element/Dialog';
import { html } from "./_element";
import EventBinding from '../../Element/Dialog/eventBinding';
import Base from "../index";
import { syncData } from '../../../Global/MultiViewportMode'
import DrawRect from '../../../Draw/drawRect'
import drawPolygon from '../../../Draw/drawPolygon'
import { setSplitDirection, syncSplitData, setActiveId } from '../../../Global/SplitScreen'
import { setActiveViewer, closeRotateAround, closeViewFollow } from '../../../Global/global'
import FlowLineMaterialProperty from "../../Materail/FlowLineMaterialProperty";
class FlowLine extends Base {
/**
* @constructor
* @param sdk
* @description 流光飞线
* @param options {object} 流光飞线属性
* @param options.name=未命名对象 {string} 名称
* @param options.pointNumber=300 {number} 线数量
* @param options.height=200 {number} 线高度
* @param options.heightDifference=3000 {number} 线高度差
* @param options.width=2 {number} 线宽
* @param options.duration=10.0 {number} 单次运动时间
* @param options.color=rgba(255,255,255,1) {string} 颜色
* @param options.lineBackAlpha=0.05 {number} 轨迹颜色不能为0
* @param Dialog {object} 弹框对象
* @param Dialog.confirmCallBack {function} 弹框确认时的回调
* */
constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options);
this.viewer = this.sdk.viewer
this.options.name = options.name || '飞线'
this.options.pointNumber = options.pointNumber || 200
this.options.height = options.height || 200
this.options.heightDifference = options.heightDifference || 3000
this.options.width = options.width || 2
this.options.duration = options.duration || 10.0
this.options.color = options.color || "rgba(255,255,255,1)"
this.options.lineBackAlpha = options.lineBackAlpha || 0.05
this.options.positions = options.positions || []
this.options.show = (options.show || options.show === false) ? options.show : true
this.Dialog = _Dialog
this._EventBinding = new EventBinding()
this._elms = {};
this.positionArea = []
this.positions = []
this.sdk.addIncetance(this.options.id, this)
// FlowLine.create(this)
FlowLine.drawLine(this)
}
// 创建水面
static create(that) {
// let Draw = new DrawRect(that.sdk)
// Draw.start((a, positions) => {
// that.positions = positions
// that.getLine(that, that.positions)
// that.edit(true)
// })
let Draw = new drawPolygon(that.sdk)
Draw.start((a, positions) => {
that.positionArea = positions
let posis = that.getRandomPointsInCesiumPolygon(positions, that.options.pointNumber)
that.positions = posis
that.getLine(that, posis)
that.edit(true)
})
}
static drawLine(that) {
that.positionArea = that.options.positions
let posis = that.getRandomPointsInCesiumPolygon(that.options.positions, that.options.pointNumber)
that.positions = posis
that.getLine(that, posis)
// that.edit(true)
}
getRandomPointsInCesiumPolygon(positions, count) {
let lons = [], lats = [], posi = []
positions.forEach(item => {
lons.push(item.lng)
lats.push(item.lat)
posi.push([item.lng, item.lat])
})
posi.push([posi[0][0], posi[0][1]])
const minLon = Math.min(...lons), maxLon = Math.max(...lons);
const minLat = Math.min(...lats), maxLat = Math.max(...lats);
const points = [];
while (points.length < count) {
const lon = minLon + Math.random() * (maxLon - minLon);
const lat = minLat + Math.random() * (maxLat - minLat);
// const cartesian = Cesium.Cartesian3.fromDegrees(lon, lat);
let point = turf.point([lon, lat]);
const polygon = turf.polygon([
posi
]);
const isInside = turf.booleanPointInPolygon(point, polygon);
if (isInside) {
points.push([
lon,
lat
]);
}
}
return points;
}
getLine(that, positions) {
let num = 0
let celiangEntity = null
if (that.viewer.entities.getById(that.options.id)) {
that.viewer.entities.getById(that.options.id)._children.forEach((item) => {
that.viewer.entities.remove(item);
});
that.viewer.entities.remove(that.viewer.entities.getById(that.options.id))
}
celiangEntity = that.viewer.entities.add(new Cesium.Entity({ id: that.options.id, show: that.options.show }))
positions.forEach((item, index) => {
let point = item
//根据点设置起始点位置
let start = Cesium.Cartesian3.fromDegrees(point[0], point[1], 0)
//根据点设置结束点位置
let end = Cesium.Cartesian3.fromDegrees(point[0], point[1], that.options.height + Math.random() * that.options.heightDifference)
//创建线
that.viewer.entities.add({
parent: celiangEntity,
polyline: {
positions: [start, end],
width: 2,
// material:Cesium.Color.RED
material: new Cesium.FlowLineMaterialProperty({
color: that.options.color,
duration: that.options.duration,
lineBackAlpha: that.options.lineBackAlpha,
num: num
})
}
})
});
}
get color() {
return this.options.color
}
set color(v) {
this.options.color = v
let entity = this.viewer.entities.getById(this.options.id)
if (entity) {
entity._children.forEach(item => {
item.polyline.material.color = Cesium.Color.fromCssColorString(v)
})
}
if (this._elms.color) {
this._elms.color.forEach((item, i) => {
let picker = new ewPlugins('colorpicker', {
el: item.el,
size: 'mini',//颜色box类型
alpha: true,//是否开启透明度
defaultColor: v,
disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => {
this.color = c
},//点击确认按钮事件回调
clear: () => {
this.color = 'rgba(255,255,255,1)'
},//点击清空按钮事件回调
})
this._elms.color[i] = picker
})
}
}
get pointNumber() {
return this.options.pointNumber
}
set pointNumber(v) {
this.options.pointNumber = v
let entity = this.viewer.entities.getById(this.options.id)
if (entity) {
let posis = this.getRandomPointsInCesiumPolygon(this.positionArea, this.options.pointNumber)
this.positions = posis
this.getLine(this, posis)
}
}
get height() {
return this.options.height
}
set height(v) {
this.options.height = v
let entity = this.viewer.entities.getById(this.options.id)
if (entity) {
this.getLine(this, this.positions)
}
}
get heightDifference() {
return this.options.heightDifference
}
set heightDifference(v) {
this.options.heightDifference = v
let entity = this.viewer.entities.getById(this.options.id)
if (entity) {
this.getLine(this, this.positions)
}
}
get width() {
return this.options.width
}
set width(v) {
this.options.width = v
let entity = this.viewer.entities.getById(this.options.id)
if (entity) {
entity._children.forEach(item => {
item.polyline.width = v
})
}
}
get duration() {
return this.options.duration
}
set duration(v) {
this.options.duration = v
let entity = this.viewer.entities.getById(this.options.id)
if (entity) {
entity._children.forEach(item => {
item.polyline.material.duration = v
})
}
}
get lineBackAlpha() {
return this.options.lineBackAlpha
}
set lineBackAlpha(v) {
this.options.lineBackAlpha = v
let entity = this.viewer.entities.getById(this.options.id)
if (entity) {
entity._children.forEach(item => {
item.polyline.material.lineBackAlpha = v
})
}
}
/**
* @description 编辑框
* @param state=false {boolean} 状态: true打开, false关闭
*/
async edit(state = false) {
let _this = this
this.originalOptions = this.deepCopyObj(this.options)
// let elms = this.sdk.viewer._container.getElementsByClassName('YJ-custom-base-dialog')
// for (let i = elms.length - 1; i >= 0; i--) {
// this.sdk.viewer._container.removeChild(elms[i])
// }
if (this._DialogObject && this._DialogObject.close) {
this._DialogObject.close()
this._DialogObject = null
}
if (state) {
this._DialogObject = await new Dialog(this.sdk, this.originalOptions, {
title: '飞线属性', left: '180px', top: '100px',
confirmCallBack: (options) => {
this.name = this.name.trim()
if (!this.name) {
// this.name = '未命名对象'
this.name = '飞线'
}
this.originalOptions = this.deepCopyObj(this.options)
this._DialogObject.close()
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(this.originalOptions)
syncData(this.sdk, this.options.id)
syncSplitData(this.sdk, this.options.id)
},
resetCallBack: () => {
this.reset()
this.Dialog.resetCallBack && this.Dialog.resetCallBack()
},
// removeCallBack: () => {
// this.Dialog.removeCallBack && this.Dialog.removeCallBack()
// },
closeCallBack: () => {
this.reset()
// this.entity.style = new Cesium.Cesium3DTileStyle({
// color: "color('rgba(255,255,255," + this.newData.transparency + ")')",
// show: true,
// });
this.Dialog.closeCallBack && this.Dialog.closeCallBack()
},
showCallBack: (show) => {
this.show = show
this.Dialog.showCallBack && this.Dialog.showCallBack()
}
}, true)
this._DialogObject._element.body.className = this._DialogObject._element.body.className + ' flow-line-surface'
let contentElm = document.createElement('div');
contentElm.innerHTML = html()
this._DialogObject.contentAppChild(contentElm)
// 颜色组件
let waterColorPicker = new ewPlugins('colorpicker', {
el: contentElm.getElementsByClassName("flowLine-color")[0],
size: 'mini',//颜色box类型
alpha: true,//是否开启透明度
defaultColor: this.color,
disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画
sure: (color) => {
this.color = color
},//点击确认按钮事件回调
clear: () => {
this.color = 'rgba(255,255,255,1)'
},//点击清空按钮事件回调
})
let all_elm = contentElm.getElementsByTagName("*")
this._EventBinding.on(this, all_elm)
this._elms = this._EventBinding.element
this._elms.color = [waterColorPicker]
} else {
// if (this._element_style) {
// document.getElementsByTagName('head')[0].removeChild(this._element_style)
// this._element_style = null
// }
// if (this._DialogObject && this._DialogObject.remove) {
// this._DialogObject.remove()
// this._DialogObject = null
// }
}
}
reset() {
if (!this.viewer.entities.getById(this.options.id)) {
return
}
this.name = this.originalOptions.name
this.pointNumber = this.originalOptions.pointNumber
this.height = this.originalOptions.height
this.heightDifference = this.originalOptions.heightDifference
this.width = this.originalOptions.width
this.duration = this.originalOptions.duration
this.color = this.originalOptions.color
this.lineBackAlpha = this.originalOptions.lineBackAlpha
}
/**
* 飞到对应实体
*/
async flyTo(options = {}) {
setActiveViewer(0)
closeRotateAround(this.sdk)
closeViewFollow(this.sdk)
if (this.options.customView && this.options.customView.relativePosition && this.options.customView.orientation) {
let orientation = {
heading: Cesium.Math.toRadians(this.options.customView.orientation.heading || 0.0),
pitch: Cesium.Math.toRadians(this.options.customView.orientation.pitch || -60.0),
roll: Cesium.Math.toRadians(this.options.customView.orientation.roll || 0.0)
}
let lng = this.options.customView.relativePosition.lng
let lat = this.options.customView.relativePosition.lat
let alt = this.options.customView.relativePosition.alt
let destination = Cesium.Cartesian3.fromDegrees(lng, lat, alt)
let position = { lng: 0, lat: 0 }
if (this.options.position) {
position = { ...this.options.position }
}
else if (this.options.positions) {
position = { ...this.options.positions[0] }
}
else if (this.options.center) {
position = { ...this.options.center }
}
else if (this.options.start) {
position = { ...this.options.start }
}
else {
if (this.options.hasOwnProperty('lng')) {
position.lng = this.options.lng
}
if (this.options.hasOwnProperty('lat')) {
position.lat = this.options.lat
}
if (this.options.hasOwnProperty('alt')) {
position.alt = this.options.alt
}
}
// 如果没有高度值,则获取紧贴高度计算
// if (!position.hasOwnProperty('alt')) {
// position.alt = await this.getClampToHeight(position)
// }
lng = this.options.customView.relativePosition.lng + position.lng
lat = this.options.customView.relativePosition.lat + position.lat
alt = this.options.customView.relativePosition.alt + position.alt
destination = Cesium.Cartesian3.fromDegrees(lng, lat, alt)
this.sdk.viewer.camera.flyTo({
destination: destination,
orientation: orientation
})
}
else {
let positionArray = []
for (let i = 0; i < this.positions.length; i++) {
let a = Cesium.Cartesian3.fromDegrees(
this.positions[i][0],
this.positions[i][1],
this.options.height + this.options.heightDifference / 2
)
positionArray.push(a.x, a.y, a.z)
}
let BoundingSphere = Cesium.BoundingSphere.fromVertices(positionArray)
this.viewer.camera.flyToBoundingSphere(BoundingSphere, {
offset: {
heading: Cesium.Math.toRadians(0.0),
pitch: Cesium.Math.toRadians(-20.0),
roll: Cesium.Math.toRadians(0.0)
}
})
}
}
getSphere() {
return new Promise((resolve) => {
// entity没有加载完成时 state 不会等于0 所以设置定时器直到获取到为止
const interval = setInterval(() => {
const sphere = new Cesium.BoundingSphere()
const state = this.sdk.viewer._dataSourceDisplay.getBoundingSphere(
this.viewer.entities.getById(this.options.id),
false,
sphere
)
if (state === Cesium.BoundingSphereState.DONE) {
clearInterval(interval)
}
}, 1000)
})
}
/**
* 删除
*/
async remove() {
if (this.viewer.entities.getById(this.options.id)) {
this.viewer.entities.getById(this.options.id)._children.forEach((item) => {
this.viewer.entities.remove(item);
});
this.viewer.entities.remove(this.viewer.entities.getById(this.options.id))
}
this.positions = []
this.entity = null
if (this._DialogObject && !this._DialogObject.isDestroy) {
this._DialogObject.close()
this._DialogObject = null
}
await this.sdk.removeIncetance(this.options.id)
await syncData(this.sdk, this.options.id)
}
flicker() { }
}
export default FlowLine

View File

@ -594,12 +594,13 @@ class GroundSvg extends Base {
} }
init() { init() {
let url = this.replaceHost(this.options.url, this.options.host)
syncData(this.sdk, this.options.id) syncData(this.sdk, this.options.id)
this.hierarchys = [] this.hierarchys = []
this.originalOptions = this.deepCopyObj(this.options) this.originalOptions = this.deepCopyObj(this.options)
let geometryArray = [] let geometryArray = []
const loader = new SVGLoader(); const loader = new SVGLoader();
loader.load(this.options.url, (data) => { loader.load(url, (data) => {
if (!this.sdk || !this.sdk.viewer || !this.sdk.viewer.entities) { if (!this.sdk || !this.sdk.viewer || !this.sdk.viewer.entities) {
return return
} }
@ -923,7 +924,9 @@ class GroundSvg extends Base {
this.text && (this.options.text.position = { lng: this.text.position[0], lat: this.text.position[1], alt: this.text.position[2] }) this.text && (this.options.text.position = { lng: this.text.position[0], lat: this.text.position[1], alt: this.text.position[2] })
this.originalOptions = this.deepCopyObj(this.options) this.originalOptions = this.deepCopyObj(this.options)
this._DialogObject.close() this._DialogObject.close()
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(this.originalOptions) let cdoptions = this.deepCopyObj(this.options)
cdoptions.host = ''
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(cdoptions)
syncData(this.sdk, this.options.id) syncData(this.sdk, this.options.id)
syncSplitData(this.sdk, this.options.id) syncSplitData(this.sdk, this.options.id)
}, },

View File

@ -34,10 +34,10 @@ class LabelObject extends Base {
} }
this.options.text = textArray.join('\n') this.options.text = textArray.join('\n')
this.options.fontFamily = options.fontFamily || 0 this.options.fontFamily = options.fontFamily || 0
this.font = getFontFamily(this.options.fontFamily) || 'Helvetica' this.font = getFontFamily(this.options.fontFamily) || 'SimHei'
this.options.fontSize = options.fontSize || 20 this.options.fontSize = options.fontSize || 20
this.options.lineWidth = options.lineWidth || 4 this.options.lineWidth = options.lineWidth || 4
this.options.lineColor = options.lineColor || '#fff000' this.options.lineColor = options.lineColor || '#00ffff80'
this.options.color = options.color || '#ffffff' this.options.color = options.color || '#ffffff'
this.options.ground = this.options.ground =
options.ground || options.ground === false ? options.ground : true options.ground || options.ground === false ? options.ground : true
@ -46,8 +46,8 @@ class LabelObject extends Base {
? options.pixelOffset ? options.pixelOffset
: 20 : 20
this.options.backgroundColor = options.backgroundColor || [ this.options.backgroundColor = options.backgroundColor || [
'#42c6ef', '#00ffff80',
'#42c6ef' '#00ffff80'
] ]
this.event = new MouseEvent(this.sdk) this.event = new MouseEvent(this.sdk)
this.entity this.entity
@ -407,7 +407,7 @@ class LabelObject extends Base {
set fontFamily(v) { set fontFamily(v) {
this.options.fontFamily = v || 0 this.options.fontFamily = v || 0
this.font = getFontFamily(this.options.fontFamily) || 'Helvetica' this.font = getFontFamily(this.options.fontFamily) || 'SimHei'
this.updateBillboardImage() this.updateBillboardImage()
} }
@ -415,7 +415,7 @@ class LabelObject extends Base {
return this.options.lineWidth return this.options.lineWidth
} }
set lineWidth(v) { set lineWidth(v) {
this.options.lineWidth = Number(v) this.options.lineWidth = ((Number(v) || Number(v) === 0) ? Number(v) : 4)
if (!this.entity) { if (!this.entity) {
return return
} }
@ -443,7 +443,7 @@ class LabelObject extends Base {
return this.options.pixelOffset return this.options.pixelOffset
} }
set lineColor(v) { set lineColor(v) {
this.options.lineColor = v this.options.lineColor = v || '#00ffff80'
if (!this.entity) { if (!this.entity) {
return return
} }

View File

@ -24,7 +24,7 @@ class PincerArrowObject extends Base {
* @param options {object} 属性 * @param options {object} 属性
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.color="#36c4ff" {string} 颜色 * @param options.color="#ff000080" {string} 颜色
* @param options.height {number} 高度 * @param options.height {number} 高度
* @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式
* @param {Array.<object>} options.positions 坐标数组 [{lon,lat,alt},...] * @param {Array.<object>} options.positions 坐标数组 [{lon,lat,alt},...]
@ -34,13 +34,13 @@ class PincerArrowObject extends Base {
constructor(sdk, options = {}, _Dialog = {}) { constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options); super(sdk, options);
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.color = options.color || "#36c4ff" this.options.color = options.color || "#ff000080"
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options.positions = options.positions || [] this.options.positions = options.positions || []
this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2 this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2
this.options.line = options.line || {} this.options.line = options.line || {}
this.options.line.width = this.options.line.width || 2 this.options.line.width = ((this.options.line.width || this.options.line.width === 0) ? this.options.line.width : 3)
this.options.line.color = this.options.line.color || 'rgba(155, 155, 124, 0.89)' this.options.line.color = this.options.line.color || '#ff000080'
this.options['area-unit'] = options['area-unit'] || '平方米' this.options['area-unit'] = options['area-unit'] || '平方米'
this.options.height = options.height this.options.height = options.height
this.options.loop = options.loop || false this.options.loop = options.loop || false
@ -62,8 +62,8 @@ class PincerArrowObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -122,14 +122,14 @@ class PincerArrowObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
let material = Cesium.Color.fromCssColorString(v) let material = Cesium.Color.fromCssColorString(this.options.color)
if (this.sdk.viewer.scene.mode === 2) { if (this.sdk.viewer.scene.mode === 2) {
material = new Cesium.CustomColorMaterialSource({ material = new Cesium.CustomColorMaterialSource({
color: v color: this.options.color
}) })
} }
this.entity.polygon.material = material this.entity.polygon.material = material
@ -139,14 +139,14 @@ class PincerArrowObject extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.color = c this.color = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -253,25 +253,25 @@ class PincerArrowObject extends Base {
return this.options.line.color return this.options.line.color
} }
set lineColor(v) { set lineColor(v) {
this.options.line.color = v this.options.line.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) {
return return
} }
this.entity.polyline.material = Cesium.Color.fromCssColorString(v) this.entity.polyline.material = Cesium.Color.fromCssColorString(this.options.line.color)
if (this._elms.lineColor) { if (this._elms.lineColor) {
this._elms.lineColor.forEach((item, i) => { this._elms.lineColor.forEach((item, i) => {
let lineColorPicker = new ewPlugins('colorpicker', { let lineColorPicker = new ewPlugins('colorpicker', {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.line.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.lineColor = c this.lineColor = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.lineColor = 'rgba(255,255,255,1)' this.lineColor = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.lineColor[i] = lineColorPicker this._elms.lineColor[i] = lineColorPicker
@ -283,10 +283,10 @@ class PincerArrowObject extends Base {
return this.options.line.width return this.options.line.width
} }
set lineWidth(v) { set lineWidth(v) {
this.options.line.width = v this.options.line.width = ((v || v === 0) ? v : 3)
this.entity.polyline.width = v this.entity.polyline.width = this.options.line.width
this._elms.lineWidth && this._elms.lineWidth.forEach((item) => { this._elms.lineWidth && this._elms.lineWidth.forEach((item) => {
item.value = v item.value = this.options.line.width
}) })
} }
@ -479,7 +479,7 @@ class PincerArrowObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -25,7 +25,7 @@ class PolygonObject extends Base {
* @param options.id {string} 唯一标识 * @param options.id {string} 唯一标识
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.color="#36c4ff" {string} 颜色 * @param options.color="#ff000080" {string} 颜色
* @param options.height {number} 高度 * @param options.height {number} 高度
* @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式
* @param options.line {object} 边框 * @param options.line {object} 边框
@ -39,15 +39,15 @@ class PolygonObject extends Base {
constructor(sdk, options = {}, _Dialog = {}) { constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options) super(sdk, options)
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.color = options.color || '#36c4ff' this.options.color = options.color || '#ff000080'
this.options.show = this.options.show =
options.show || options.show === false ? options.show : true options.show || options.show === false ? options.show : true
this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2 this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2
this.options.positions = options.positions || [] this.options.positions = options.positions || []
this.options.line = options.line || {} this.options.line = options.line || {}
this.options.line.width = this.options.line.width || 2 this.options.line.width = ((this.options.line.width || this.options.line.width === 0) ? this.options.line.width : 3)
this.options.line.color = this.options.line.color =
this.options.line.color || 'rgba(155, 155, 124, 0.89)' this.options.line.color || '#ff000080'
this.options['area-unit'] = options['area-unit'] || '平方米' this.options['area-unit'] = options['area-unit'] || '平方米'
this.entity this.entity
this.event = new MouseEvent(this.sdk) this.event = new MouseEvent(this.sdk)
@ -74,8 +74,8 @@ class PolygonObject extends Base {
options.label.pixelOffset || options.label.pixelOffset === 0 options.label.pixelOffset || options.label.pixelOffset === 0
? options.label.pixelOffset ? options.label.pixelOffset
: 20, : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: near:
options.label.near || options.label.near === 0 options.label.near || options.label.near === 0
@ -133,18 +133,18 @@ class PolygonObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
let material = Cesium.Color.fromCssColorString(v) let material = Cesium.Color.fromCssColorString(this.options.color)
if (this.sdk.viewer.scene.mode === 2) { if (this.sdk.viewer.scene.mode === 2) {
this.heightMode = 0 this.heightMode = 0
material = new Cesium.CustomColorMaterialSource({ material = new Cesium.CustomColorMaterialSource({
color: v color: this.options.color
}) })
} }
this.entity.polygon.material = material this.entity.polygon.material = material
@ -154,14 +154,14 @@ class PolygonObject extends Base {
el: item.el, el: item.el,
size: 'mini', //颜色box类型 size: 'mini', //颜色box类型
alpha: true, //是否开启透明度 alpha: true, //是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false, //是否禁止打开颜色选择器 disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画 openPickerAni: 'opacity', //打开颜色选择器动画
sure: c => { sure: c => {
this.color = c this.color = c
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,0.5)'
} //点击清空按钮事件回调 } //点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -269,25 +269,25 @@ class PolygonObject extends Base {
return this.options.line.color return this.options.line.color
} }
set lineColor(v) { set lineColor(v) {
this.options.line.color = v this.options.line.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) {
return return
} }
this.entity.polyline.material = Cesium.Color.fromCssColorString(v) this.entity.polyline.material = Cesium.Color.fromCssColorString(this.options.line.color)
if (this._elms.lineColor) { if (this._elms.lineColor) {
this._elms.lineColor.forEach((item, i) => { this._elms.lineColor.forEach((item, i) => {
let lineColorPicker = new ewPlugins('colorpicker', { let lineColorPicker = new ewPlugins('colorpicker', {
el: item.el, el: item.el,
size: 'mini', //颜色box类型 size: 'mini', //颜色box类型
alpha: true, //是否开启透明度 alpha: true, //是否开启透明度
defaultColor: v, defaultColor: this.options.line.color,
disabled: false, //是否禁止打开颜色选择器 disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画 openPickerAni: 'opacity', //打开颜色选择器动画
sure: c => { sure: c => {
this.lineColor = c this.lineColor = c
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
this.lineColor = 'rgba(255,255,255,1)' this.lineColor = 'rgba(255,0,0,0.5)'
} //点击清空按钮事件回调 } //点击清空按钮事件回调
}) })
this._elms.lineColor[i] = lineColorPicker this._elms.lineColor[i] = lineColorPicker
@ -299,8 +299,8 @@ class PolygonObject extends Base {
return this.options.line.width return this.options.line.width
} }
set lineWidth(v) { set lineWidth(v) {
this.options.line.width = v this.options.line.width = ((v || v === 0) ? v : 3)
this.entity.polyline.width = v this.entity.polyline.width = this.options.line.width
this._elms.lineWidth && this._elms.lineWidth &&
this._elms.lineWidth.forEach(item => { this._elms.lineWidth.forEach(item => {
item.value = v item.value = v
@ -504,7 +504,7 @@ class PolygonObject extends Base {
this.labelLineColor = color this.labelLineColor = color
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
} //点击清空按钮事件回调 } //点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -24,7 +24,7 @@ class PolyhedronObject extends Base {
* @param options.id {string} 唯一标识 * @param options.id {string} 唯一标识
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.color="#0df7f8" {string} 颜色 * @param options.color="#ff0000" {string} 颜色
* @param options.height=10 {number} 高 * @param options.height=10 {number} 高
* @param {Array.<object>} options.positions 经纬度和高度的列表,值交替 [{lon,lat,alt},...] * @param {Array.<object>} options.positions 经纬度和高度的列表,值交替 [{lon,lat,alt},...]
* @param _Dialog {object} 弹框事件 * @param _Dialog {object} 弹框事件
@ -32,7 +32,7 @@ class PolyhedronObject extends Base {
* */ * */
constructor(sdk, options = {}, _Dialog = {}) { constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options); super(sdk, options);
this.options.color = options.color || "#0df7f8" this.options.color = options.color || "#ff0000"
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options.height = (options.height || options.height === 0) ? options.height : 10 this.options.height = (options.height || options.height === 0) ? options.height : 10
if (this.options.height <= 0.01) { if (this.options.height <= 0.01) {
@ -54,8 +54,8 @@ class PolyhedronObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -381,7 +381,7 @@ class PolyhedronObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff0000'
if(!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if(!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
@ -398,7 +398,7 @@ class PolyhedronObject extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
@ -662,7 +662,7 @@ class PolyhedronObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -53,8 +53,8 @@ class PolyhedronObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -599,7 +599,7 @@ class PolyhedronObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -9,22 +9,15 @@ function html(that) {
<span class="label">名称</span> <span class="label">名称</span>
<input class="input" maxlength="40" type="text" @model="name"> <input class="input" maxlength="40" type="text" @model="name">
</div> </div>
<div class="col" style="flex: 0 0 54%;"> <div class="col" style="flex: 0 0 56%;">
<div> <div>
<div class="row"> <div class="row">
<div class="col input-select-unit-box"> <div class="col input-select-unit-box">
<span class="label">原始长度:</span> <div class="input-select-unit"></div>
<input class="input input-text" readonly="readonly" type="text" style="flex: 0 0 130px;" @model="length"> <input class="input input-text" readonly="readonly" type="text" style="flex: 0 0 130px;" @model="length">
<div class="input-select-unit"></div> <div class="input-select-unit"></div>
</div> </div>
</div> </div>
<div class="row">
<div class="col input-select-fit-unit-box">
<span class="label">拟合长度:</span>
<input class="input input-text" readonly="readonly" type="text" style="flex: 0 0 130px;" @model="fitLength">
<div class="input-select-fit-unit"></div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -48,7 +41,7 @@ function html(that) {
<span class="unit">m</span> <span class="unit">m</span>
<span class="arrow"></span> <span class="arrow"></span>
</div> </div>
<button class="confirm height-confirm" style="margin-left: 5px;">确认</button> <button class="confirm height-confirm" style="margin-left: 5px;">应用</button>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
@ -72,7 +65,7 @@ function html(that) {
<span class="label">线条颜色</span> <span class="label">线条颜色</span>
<div class="color"></div> <div class="color"></div>
</div> </div>
<div class="col"> <div class="col" style="flex: 0 0 33%;">
<span class="label">线条宽度</span> <span class="label">线条宽度</span>
<div class="input-number input-number-unit-1" style="width: 80px;"> <div class="input-number input-number-unit-1" style="width: 80px;">
<input class="input" type="number" title="" min="1" max="999" @model="lineWidth"> <input class="input" type="number" title="" min="1" max="999" @model="lineWidth">
@ -80,7 +73,7 @@ function html(that) {
<span class="arrow"></span> <span class="arrow"></span>
</div> </div>
</div> </div>
<div class="col input-select-line-type-box"> <div class="col input-select-line-type-box" style="flex: 0 0 37%;">
<span class="label">线条形式</span> <span class="label">线条形式</span>
<div class="input-select-line-type"></div> <div class="input-select-line-type"></div>
</div> </div>
@ -90,11 +83,33 @@ function html(that) {
<span class="label">首尾相连</span> <span class="label">首尾相连</span>
<input class="btn-switch" type="checkbox" @model="noseToTail"> <input class="btn-switch" type="checkbox" @model="noseToTail">
</div> </div>
<div class="col"> <div class="col" style="flex: 0 0 33%;">
<span class="label">线段圆滑</span> <span class="label">线段圆滑</span>
<input class="btn-switch" type="checkbox" @model="smooth"> <input class="btn-switch" type="checkbox" @model="smooth">
</div> </div>
<div class="col" style="flex: 0 0 37%;">
</div>
</div>
<div class="row" id="dashTextureDom">
<div class="col"> <div class="col">
<span class="label">动画顺向</span>
<input class="btn-switch" type="checkbox" @model="rotate">
</div>
<div class="col" style="flex: 0 0 33%;">
<span class="label">动画时长</span>
<div class="input-number input-number-unit-1" style="width: 80px;">
<input class="input" type="number" title="" min="0" max="999999" step="0.1" @model="speed">
<span class="unit">s</span>
<span class="arrow"></span>
</div>
</div>
<div class="col" style="flex: 0 0 37%;">
<span class="label lineSpace">间距</span>
<div class="input-number input-number-unit-1 lineSpace" style="width: 80px;">
<input class="input" type="number" title="" min="0" max="4.5" step="0.1" @model="space">
<span class="unit">倍</span>
<span class="arrow"></span>
</div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
@ -102,7 +117,7 @@ function html(that) {
<span class="label">线段缓冲</span> <span class="label">线段缓冲</span>
<input class="btn-switch" type="checkbox" @model="extend"> <input class="btn-switch" type="checkbox" @model="extend">
</div> </div>
<div class="col"> <div class="col" style="flex: 0 0 33%;">
<span class="label">缓冲宽度</span> <span class="label">缓冲宽度</span>
<div class="input-number input-number-unit-1" style="width: 80px;"> <div class="input-number input-number-unit-1" style="width: 80px;">
<input class="input" type="number" title="" min="0" data-min="0.01" max="999999" @model="extendWidth"> <input class="input" type="number" title="" min="0" data-min="0.01" max="999999" @model="extendWidth">
@ -110,7 +125,7 @@ function html(that) {
<span class="arrow"></span> <span class="arrow"></span>
</div> </div>
</div> </div>
<div class="col"> <div class="col" style="flex: 0 0 37%;">
<span class="label">缓冲颜色</span> <span class="label">缓冲颜色</span>
<div class="extendColor"></div> <div class="extendColor"></div>
</div> </div>

View File

@ -38,13 +38,15 @@ class eventBinding {
if (e.target.type == 'number') { if (e.target.type == 'number') {
if (e.data != '.' && (e.data != '-' || e.target.value)) { if (e.data != '.' && (e.data != '-' || e.target.value)) {
value = Number(value) value = Number(value)
if((e.target.max) && value>Number(e.target.max)) { if ((e.target.max) && value > Number(e.target.max)) {
value = Number(e.target.max) value = Number(e.target.max)
e.target.value = value
} }
if((e.target.min) && value<Number(e.target.min)) { if ((e.target.min) && value < Number(e.target.min)) {
value = Number(e.target.min) value = Number(e.target.min)
e.target.value = value
} }
if((e.target.dataset.min) && value<Number(e.target.dataset.min)) { if ((e.target.dataset.min) && value < Number(e.target.dataset.min)) {
value = Number(e.target.dataset.min) value = Number(e.target.dataset.min)
} }
that[m.value] = value that[m.value] = value
@ -54,14 +56,14 @@ class eventBinding {
that[m.value] = value that[m.value] = value
} }
}) })
if(elements[i].nodeName=='IMG') { if (elements[i].nodeName == 'IMG') {
elements[i].src = that[m.value] elements[i].src = that[m.value]
} }
else { else {
elements[i].value = that[m.value] elements[i].value = that[m.value]
} }
} }
if(this.element[m.value]) { if (this.element[m.value]) {
this.element[m.value].push(elements[i]) this.element[m.value].push(elements[i])
} }
else { else {
@ -84,7 +86,7 @@ class eventBinding {
isEvent = true isEvent = true
Event.push((e) => { Event.push((e) => {
let value = e.target.value let value = e.target.value
if(e.target.type == 'number' && value!='') { if (e.target.type == 'number' && value != '') {
value = Number(value) value = Number(value)
e.target.value = value e.target.value = value
} }
@ -97,7 +99,7 @@ class eventBinding {
} }
// elements[i].attributes[m] = undefined // elements[i].attributes[m] = undefined
} }
for(let n=0;n<removeName.length;n++) { for (let n = 0; n < removeName.length; n++) {
elements[i].attributes.removeNamedItem(removeName[n]) elements[i].attributes.removeNamedItem(removeName[n])
} }

View File

@ -13,7 +13,6 @@ import MouseTip from '../../../MouseTip'
import Controller from '../../../Controller/index' import Controller from '../../../Controller/index'
import { syncData } from '../../../Global/MultiViewportMode' import { syncData } from '../../../Global/MultiViewportMode'
import { legp } from '../../Element/datalist' import { legp } from '../../Element/datalist'
import { getFontList, getFontFamilyName } from '../../Element/fontSelect'
import { setSplitDirection, syncSplitData, setActiveId } from '../../../Global/SplitScreen' import { setSplitDirection, syncSplitData, setActiveId } from '../../../Global/SplitScreen'
import { setActiveViewer, closeRotateAround, closeViewFollow } from '../../../Global/global' import { setActiveViewer, closeRotateAround, closeViewFollow } from '../../../Global/global'
@ -24,8 +23,8 @@ class PolylineObject extends Base {
* @description 折线 * @description 折线
* @param options {object} 线属性 * @param options {object} 线属性
* @param options.name{string} 名称 * @param options.name{string} 名称
* @param options.width=5{number} 线宽 * @param options.width * @param options.width=3{number} 线宽
* @param options.color=#0df89e {string} 颜色 * @param options.color=#ff0000 {string} 颜色
* @param options.type=0 {number} 材质类型 0-实线 1-虚线 2-泛光 * @param options.type=0 {number} 材质类型 0-实线 1-虚线 2-泛光
* @param options.heightMode=2{number} 高度模式0海拔高度1相对高度2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对高度2依附模式
* @param options['nose-to-tail']=false {boolean} 首尾相连 * @param options['nose-to-tail']=false {boolean} 首尾相连
@ -52,14 +51,19 @@ class PolylineObject extends Base {
constructor(sdk, options = {}, _Dialog = {}) { constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options) super(sdk, options)
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.width = options.width || 10 this.options.width = ((options.width || options.width === 0) ? options.width : 3)
this.options.color = options.color || '#0df89e' this.options.color = options.color || '#ff0000'
this.options.type = options.type ? Number(options.type) : 0 this.options.type = options.type ? Number(options.type) : 0
this.options['nose-to-tail'] = options['nose-to-tail'] || false this.options['nose-to-tail'] = options['nose-to-tail'] || false
this.options.smooth = options.smooth || false this.options.smooth = options.smooth || false
this.options.extend = options.extend || false this.options.extend = options.extend || false
this.options.rotate = options.rotate || true
this.options.space = options.space || 1
this.options.speed = options.speed || 10
this.options.dashSize = options.dashSize || 0.03
this.options['length-unit'] = options['length-unit'] || '米' this.options['length-unit'] = options['length-unit'] || '米'
this.options['fit-length-unit'] = options['fit-length-unit'] || '米' this.options['fit-length-unit'] = options['fit-length-unit'] || '米'
this.options['words-name'] = options['words-name'] || '空间长度'
this.options['extend-width'] = this.options['extend-width'] =
options['extend-width'] || options['extend-width'] === 0 options['extend-width'] || options['extend-width'] === 0
? options['extend-width'] ? options['extend-width']
@ -78,7 +82,6 @@ class PolylineObject extends Base {
options.label.fontSize || options.label.fontSize === 0 options.label.fontSize || options.label.fontSize === 0
? options.label.fontSize ? options.label.fontSize
: 20, : 20,
fontFamily: options.label.fontFamily ? options.label.fontFamily : 0,
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: lineWidth:
options.label.lineWidth || options.label.lineWidth === 0 options.label.lineWidth || options.label.lineWidth === 0
@ -88,8 +91,8 @@ class PolylineObject extends Base {
options.label.pixelOffset || options.label.pixelOffset === 0 options.label.pixelOffset || options.label.pixelOffset === 0
? options.label.pixelOffset ? options.label.pixelOffset
: 20, : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: near:
options.label.near || options.label.near === 0 options.label.near || options.label.near === 0
@ -118,6 +121,7 @@ class PolylineObject extends Base {
this.options.attributeType = options.attributeType || 'richText' this.options.attributeType = options.attributeType || 'richText'
this.operate = {} this.operate = {}
this.nodePoints = [] this.nodePoints = []
this.unitNum = 0
this.Dialog = _Dialog this.Dialog = _Dialog
if (!this.options.positions || this.options.positions.length < 2) { if (!this.options.positions || this.options.positions.length < 2) {
this._error = '线段最少需要两个坐标!' this._error = '线段最少需要两个坐标!'
@ -145,22 +149,22 @@ class PolylineObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff0000'
this.entity.polyline.material = this.getMaterial(v, this.options.type) this.entity.polyline.material = this.getMaterial(this.options.color, this.options.type, this.entity, this.options)
if (this._elms.color) { if (this._elms.color) {
this._elms.color.forEach((item, i) => { this._elms.color.forEach((item, i) => {
let colorPicker = new ewPlugins('colorpicker', { let colorPicker = new ewPlugins('colorpicker', {
el: item.el, el: item.el,
size: 'mini', //颜色box类型 size: 'mini', //颜色box类型
alpha: true, //是否开启透明度 alpha: true, //是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false, //是否禁止打开颜色选择器 disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画 openPickerAni: 'opacity', //打开颜色选择器动画
sure: c => { sure: c => {
this.color = c this.color = c
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,1)'
} //点击清空按钮事件回调 } //点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -168,12 +172,56 @@ class PolylineObject extends Base {
} }
} }
get speed() {
return this.options.speed
}
set speed(v) {
this.options.speed = v
this.entity.polyline.material = this.getMaterial(this.options.color, this.options.type, this.entity, this.options)
}
get dashSize() {
return this.options.dashSize
}
set dashSize(v) {
this.options.dashSize = v
this.entity.polyline.material = this.getMaterial(this.options.color, this.options.type, this.entity, this.options)
}
get rotate() {
return this.options.rotate
}
set rotate(v) {
this.options.rotate = v
PolylineObject.closeNodeEdit(this)
this._elms.rotate &&
this._elms.rotate.forEach(item => {
item.checked = v
})
this.options.rotate = v
this.entity.polyline.material = this.getMaterial(this.options.color, this.options.type, this.entity, this.options)
}
get space() {
return this.options.space
}
set space(v) {
this.options.space = v
this.entity.polyline.material = this.getMaterial(this.options.color, this.options.type, this.entity, this.options)
}
get length() { get length() {
return this.options.length return this.options.length
} }
set length(v) { set length(v) {
this.options.length = v this.options.length = v
//判断数值是否大于1000m
this._elms.length && this._elms.length &&
this._elms.length.forEach(item => { this._elms.length.forEach(item => {
item.value = v item.value = v
@ -196,22 +244,59 @@ class PolylineObject extends Base {
return this.options['length-unit'] return this.options['length-unit']
} }
set lengthUnit(v) { set lengthUnit(v) {
this.unitNum++
this.options['length-unit'] = v this.options['length-unit'] = v
this._elms.lengthUnit && this._elms.lengthUnit &&
this._elms.lengthUnit.forEach(item => { this._elms.lengthUnit.forEach(item => {
item.value = v item.value = v
}) })
if (this.options.lengthByMeter) { if (this.options.lengthByMeter) {
if (this.unitNum > 2) {
switch (v) { switch (v) {
case '米': case '米':
this.length = this.options.lengthByMeter this.length = this.noseToTail ? this.options.fitLengthByMeter : this.options.lengthByMeter
break break
case '千米': case '千米':
this.length = (this.options.lengthByMeter / 1000).toFixed(5) this.length = this.noseToTail ? (this.options.fitLengthByMeter / 1000).toFixed(5) : (this.options.lengthByMeter / 1000).toFixed(5)
break break
default: default:
this.length = this.options.lengthByMeter this.length = this.noseToTail ? this.options.fitLengthByMeter : this.options.lengthByMeter
break
} }
} else {
let length = this.noseToTail ? this.options.fitLengthByMeter : this.options.lengthByMeter
this.lengthUnit = length > 1000 || length == 1000 ? '千米' : '米'
}
}
}
get wordsName() {
return this.options['words-name']
}
set wordsName(v) {
this.options['words-name'] = v
this._elms.wordsName &&
this._elms.wordsName.forEach(item => {
item.value = v
})
let _this = this
if (!this.noseToTail) {
this.computeDistance(
this.options.positions,
2,
v
).then(res => {
_this.options.lengthByMeter = res
if (res > 1000 || res == 1000) {
_this.length = (res / 1000).toFixed(5)
_this.lengthUnit = '千米'
} else {
_this.length = res
_this.lengthUnit = '米'
}
})
} else {
let fromDegreesArray = this.renewPositions(this.options.positions)
} }
} }
@ -245,14 +330,18 @@ class PolylineObject extends Base {
} }
set lineWidth(v) { set lineWidth(v) {
this.options.width = v this.options.width = (v || v == 0) ? v : 3
this._elms.lineWidth && this._elms.lineWidth &&
this._elms.lineWidth.forEach(item => { this._elms.lineWidth.forEach(item => {
item.value = v item.value = this.options.width
}) })
this.entity && if (this.entity && this.entity.polyline) {
this.entity.polyline && this.entity.polyline.width = this.entity.polyline.width + v - this.entity.polyline.oriWidth
(this.entity.polyline.width = this.options.width) this.entity.polyline.oriWidth = this.options.width
}
// this.entity &&
// this.entity.polyline &&
// (this.entity.polyline.width = this.options.width) && (this.entity.polyline.oriWidth = this.options.width)
} }
get lineType() { get lineType() {
@ -262,19 +351,82 @@ class PolylineObject extends Base {
set lineType(v) { set lineType(v) {
let lineTypeData = [ let lineTypeData = [
{ {
name: '实线', name: '<i class="icon line"></i>实线',
value: '实线', value: '实线',
key: 0 key: 0,
icon: 'line'
}, },
{ {
name: '虚线', name: '<i class="icon dash-line"></i>虚线',
value: '虚线', value: '虚线',
key: 1 key: 1,
icon: 'dash-line'
}, },
{ {
name: '泛光', name: '<i class="icon light-line"></i>泛光',
value: '泛光', value: '泛光',
key: 2 key: 2,
icon: 'light-line'
},
{
name: '<i class="icon tail-line"></i>尾迹光线',
value: '尾迹光线',
key: 3,
icon: 'tail-line'
},
{
name: '<i class="icon mult-tail-line"></i>多尾迹光线',
value: '多尾迹光线',
key: 4,
icon: 'mult-tail-line'
},
{
name: '<i class="icon flow-dash-line1"></i>流动虚线1',
value: '流动虚线1',
key: 5,
icon: 'flow-dash-line1'
},
{
name: '<i class="icon flow-dash-line2"></i>流动虚线2',
value: '流动虚线2',
key: 6,
icon: 'flow-dash-line2'
},
{
name: '<i class="icon pic-line1"></i>流动箭头1',
value: '流动箭头1',
key: 7,
icon: 'pic-line1'
},
{
name: '<i class="icon pic-line2"></i>流动箭头2',
value: '流动箭头2',
key: 8,
icon: 'pic-line2'
},
{
name: '<i class="icon pic-line3"></i>流动箭头3',
value: '流动箭头3',
key: 9,
icon: 'pic-line3'
},
{
name: '<i class="icon pic-line4"></i>流动箭头4',
value: '流动箭头4',
key: 10,
icon: 'pic-line4'
},
{
name: '<i class="icon pic-line5"></i>流动箭头5',
value: '流动箭头5',
key: 11,
icon: 'pic-line5'
},
{
name: '<i class="icon pic-line6"></i>流动箭头6',
value: '流动箭头6',
key: 12,
icon: 'pic-line6'
} }
] ]
this.options.type = Number(v) this.options.type = Number(v)
@ -283,6 +435,18 @@ class PolylineObject extends Base {
this._elms.lineType && this._elms.lineType &&
this._elms.lineType.forEach(item => { this._elms.lineType.forEach(item => {
item.value = lineTypeData[i].value item.value = lineTypeData[i].value
if (2 < item.value && item.value < 13) {//贴图参数
document.getElementById('dashTextureDom').style.display = 'flex'
} else {
document.getElementById('dashTextureDom').style.display = 'none'
}
if (2 < item.value && item.value < 5) {//尾迹参数
document.getElementsByClassName('lineSpace')[0].style.display = 'none'
document.getElementsByClassName('lineSpace')[1].style.display = 'none'
} else {
document.getElementsByClassName('lineSpace')[0].style.display = 'flex'
document.getElementsByClassName('lineSpace')[1].style.display = 'flex'
}
}) })
break break
} }
@ -291,7 +455,9 @@ class PolylineObject extends Base {
this.entity.polyline && this.entity.polyline &&
(this.entity.polyline.material = this.getMaterial( (this.entity.polyline.material = this.getMaterial(
this.options.color, this.options.color,
this.options.type this.options.type,
this.entity,
this.options
)) ))
} }
get noseToTail() { get noseToTail() {
@ -312,6 +478,24 @@ class PolylineObject extends Base {
) )
this.renewPolygon(fromDegreesArray) this.renewPolygon(fromDegreesArray)
} }
if (v) {
if (this.options.fitLengthByMeter > 1000 || this.options.fitLengthByMeter == 1000) {
let dom = document.getElementsByClassName('input-select-unit')[1]
dom && dom.querySelectorAll('dd')[1] && dom.querySelectorAll('dd')[1].click()
} else {
let dom = document.getElementsByClassName('input-select-unit')[1]
dom && dom.querySelectorAll('dd')[0] && dom.querySelectorAll('dd')[0].click()
}
} else {
if (this.options.lengthByMeter > 1000 || this.options.lengthByMeter == 1000) {
let dom = document.getElementsByClassName('input-select-unit')[1]
dom && dom.querySelectorAll('dd')[1] && dom.querySelectorAll('dd')[1].click()
} else {
let dom = document.getElementsByClassName('input-select-unit')[1]
dom && dom.querySelectorAll('dd')[0] && dom.querySelectorAll('dd')[0].click()
}
}
} }
get smooth() { get smooth() {
@ -371,12 +555,12 @@ class PolylineObject extends Base {
break break
} }
this.options.lengthByMeter = this.computeDistance( // this.options.lengthByMeter = this.computeDistance(
this.options.positions, // this.options.positions,
2, // 2,
ground // ground
) // )
this.lengthUnit = this.lengthUnit // this.lengthUnit = this.lengthUnit
this._elms.heightMode && (this._elms.heightMode.value = heightModeName) this._elms.heightMode && (this._elms.heightMode.value = heightModeName)
this._elms.heightModeObject && (this._elms.heightModeObject.legp_searchActive( this._elms.heightModeObject && (this._elms.heightModeObject.legp_searchActive(
heightModeName heightModeName
@ -445,6 +629,7 @@ class PolylineObject extends Base {
set extendWidth(v) { set extendWidth(v) {
this.options['extend-width'] = v this.options['extend-width'] = v
this.heightMode = this.heightMode
this._elms.extendWidth && this._elms.extendWidth &&
this._elms.extendWidth.forEach(item => { this._elms.extendWidth.forEach(item => {
item.value = v item.value = v
@ -507,21 +692,6 @@ class PolylineObject extends Base {
}) })
} }
get labelFontFamily() {
return this.options.label.fontFamily
}
set labelFontFamily(v) {
this.options.label.fontFamily = v || 0
this.label && (this.label.fontFamily = this.options.label.fontFamily)
let name = getFontFamilyName(this.labelFontFamily) || ''
this._elms.labelFontFamily &&
this._elms.labelFontFamily.forEach(item => {
item.value = name
})
}
get labelColor() { get labelColor() {
return this.options.label.color return this.options.label.color
} }
@ -645,30 +815,7 @@ class PolylineObject extends Base {
this.labelLineColor = color this.labelLineColor = color
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
} //点击清空按钮事件回调
})
this._elms.labelLineColor[i] = lineColorPicker
})
}
}
get labelBackgroundColorStart() {
return this.options.label.backgroundColor[0]
}
set labelBackgroundColorStart(v) {
this.options.label.backgroundColor[0] = v
this.label.backgroundColor = [v, this.label.backgroundColor[1]]
if (this._elms.labelBackgroundColorStart) {
this._elms.labelBackgroundColorStart.forEach((item, i) => {
let labelBackgroundColorStartPicker = new ewPlugins('colorpicker', {
el: item.el,
size: 'mini', //颜色box类型
alpha: true, //是否开启透明度
defaultColor: this.labelBackgroundColorStart,
disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画
sure: color => {
this.labelBackgroundColorStart = color this.labelBackgroundColorStart = color
}, //点击确认按钮事件回调 }, //点击确认按钮事件回调
clear: () => { clear: () => {
@ -1141,7 +1288,6 @@ class PolylineObject extends Base {
], ],
text: that.options.name, text: that.options.name,
fontSize: that.options.label.fontSize, fontSize: that.options.label.fontSize,
fontFamily: that.options.label.fontFamily,
color: that.options.label.color, color: that.options.label.color,
pixelOffset: that.options.label.pixelOffset, pixelOffset: that.options.label.pixelOffset,
backgroundColor: that.options.label.backgroundColor, backgroundColor: that.options.label.backgroundColor,
@ -1170,20 +1316,27 @@ class PolylineObject extends Base {
positions: Cesium.Cartesian3.fromDegreesArrayHeights(fromDegreesArray), positions: Cesium.Cartesian3.fromDegreesArrayHeights(fromDegreesArray),
width: that.options.width, width: that.options.width,
clampToGround: ground, clampToGround: ground,
material: that.getMaterial(that.options.color, that.options.type), material: that.getMaterial(that.options.color, that.options.type, that.entity, that.options),
zIndex: that.sdk._entityZIndex zIndex: that.sdk._entityZIndex
} }
}) })
that.entity.polyline.oriWidth = that.options.width
that.sdk._entityZIndex++ that.sdk._entityZIndex++
PolylineObject.createLabel(that) PolylineObject.createLabel(that)
// that.entity.polyline.positionsLngLat = positions // that.entity.polyline.positionsLngLat = positions
that.renewPolygon(fromDegreesArray) that.renewPolygon(fromDegreesArray)
that.options.lengthByMeter = that.computeDistance(positions, 2, ground) that.computeDistance(
positions,
2
).then(res => {
that.options.lengthByMeter = res
that.lengthUnit = that.options['length-unit'] that.lengthUnit = that.options['length-unit']
syncData(that.sdk, that.options.id) syncData(that.sdk, that.options.id)
if (that.options.show) { if (that.options.show) {
setSplitDirection(0, that.options.id) setSplitDirection(0, that.options.id)
} }
})
// if (this.options['nose-to-tail']) { // if (this.options['nose-to-tail']) {
// let array = [] // let array = []
@ -1411,6 +1564,50 @@ class PolylineObject extends Base {
}) })
} }
let nameData = [
{
name: '空间长度',
value: '空间长度'
},
{
name: '投影长度',
value: '投影长度'
},
{
name: '地表长度',
value: '地表长度'
}
]
let nameDataLegpObject = legp(
this._DialogObject._element.content.getElementsByClassName(
'input-select-unit-box'
)[0],
'.input-select-unit'
)
if (nameDataLegpObject) {
nameDataLegpObject.legp_search(nameData)
let nameDataLegpElm = this._DialogObject._element.content
.getElementsByClassName('input-select-unit')[0]
.getElementsByTagName('input')[0]
this._elms.wordsName = [nameDataLegpElm]
nameDataLegpElm.value = this.options['words-name']
for (let i = 0; i < nameData.length; i++) {
if (nameData[i].value === nameDataLegpElm.value) {
nameDataLegpObject.legp_searchActive(nameData[i].value)
break
}
}
nameDataLegpElm.addEventListener('input', () => {
for (let i = 0; i < nameData.length; i++) {
if (nameData[i].value === nameDataLegpElm.value) {
this.wordsName = nameData[i].value
break
}
}
})
}
// 原始长度单位 // 原始长度单位
let unitData = [ let unitData = [
{ {
@ -1427,12 +1624,13 @@ class PolylineObject extends Base {
this._DialogObject._element.content.getElementsByClassName( this._DialogObject._element.content.getElementsByClassName(
'input-select-unit-box' 'input-select-unit-box'
)[0], )[0],
'.input-select-unit' '.input-select-unit',
1
) )
if (unitDataLegpObject) { if (unitDataLegpObject) {
unitDataLegpObject.legp_search(unitData) unitDataLegpObject.legp_search(unitData)
let unitDataLegpElm = this._DialogObject._element.content let unitDataLegpElm = this._DialogObject._element.content
.getElementsByClassName('input-select-unit')[0] .getElementsByClassName('input-select-unit')[1]
.getElementsByTagName('input')[0] .getElementsByTagName('input')[0]
this._elms.lengthUnit = [unitDataLegpElm] this._elms.lengthUnit = [unitDataLegpElm]
unitDataLegpElm.value = this.options['length-unit'] unitDataLegpElm.value = this.options['length-unit']
@ -1451,63 +1649,128 @@ class PolylineObject extends Base {
} }
}) })
} }
//
// 拟合长度单位 // 拟合长度单位
let fitUnitData = [ // let fitUnitData = [
{ // {
name: '米', // name: '米',
value: '米' // value: '米'
}, // },
{ // {
name: '千米', // name: '千米',
value: '千米' // value: '千米'
} // }
] // ]
let fitUnitDataLegpObject = legp( // let fitUnitDataLegpObject = legp(
this._DialogObject._element.content.getElementsByClassName( // this._DialogObject._element.content.getElementsByClassName(
'input-select-fit-unit-box' // 'input-select-fit-unit-box'
)[0], // )[0],
'.input-select-fit-unit' // '.input-select-fit-unit'
) // )
if (fitUnitDataLegpObject) { // if (fitUnitDataLegpObject) {
fitUnitDataLegpObject.legp_search(fitUnitData) // fitUnitDataLegpObject.legp_search(fitUnitData)
let fitUnitDataLegpElm = this._DialogObject._element.content // let fitUnitDataLegpElm = this._DialogObject._element.content
.getElementsByClassName('input-select-fit-unit')[0] // .getElementsByClassName('input-select-fit-unit')[0]
.getElementsByTagName('input')[0] // .getElementsByTagName('input')[0]
this._elms.fitLengthUnit = [fitUnitDataLegpElm] // this._elms.fitLengthUnit = [fitUnitDataLegpElm]
fitUnitDataLegpElm.value = this.options['fit-length-unit'] // fitUnitDataLegpElm.value = this.options['fit-length-unit']
for (let i = 0; i < fitUnitData.length; i++) { // for (let i = 0; i < fitUnitData.length; i++) {
if (fitUnitData[i].value === fitUnitDataLegpElm.value) { // if (fitUnitData[i].value === fitUnitDataLegpElm.value) {
fitUnitDataLegpObject.legp_searchActive(fitUnitData[i].value) // fitUnitDataLegpObject.legp_searchActive(fitUnitData[i].value)
break // break
} // }
} // }
fitUnitDataLegpElm.addEventListener('input', () => { // fitUnitDataLegpElm.addEventListener('input', () => {
for (let i = 0; i < fitUnitData.length; i++) { // for (let i = 0; i < fitUnitData.length; i++) {
if (fitUnitData[i].value === fitUnitDataLegpElm.value) { // if (fitUnitData[i].value === fitUnitDataLegpElm.value) {
this.fitLengthUnit = fitUnitData[i].value // this.fitLengthUnit = fitUnitData[i].value
break // break
} // }
} // }
}) // })
} // }
let lineTypeData = [ let lineTypeData = [
{ {
name: '实线', name: '<i class="icon line"></i>实线',
value: '实线', value: '实线',
key: 0 key: 0,
icon: 'line'
}, },
{ {
name: '虚线', name: '<i class="icon dash-line"></i>虚线',
value: '虚线', value: '虚线',
key: 1 key: 1,
icon: 'dash-line'
}, },
{ {
name: '泛光', name: '<i class="icon light-line"></i>泛光',
value: '泛光', value: '泛光',
key: 2 key: 2,
icon: 'light-line'
},
{
name: '<i class="icon tail-line"></i>尾迹光线',
value: '尾迹光线',
key: 3,
icon: 'tail-line'
},
{
name: '<i class="icon mult-tail-line"></i>多尾迹光线',
value: '多尾迹光线',
key: 4,
icon: 'mult-tail-line'
},
{
name: '<i class="icon flow-dash-line1"></i>流动虚线1',
value: '流动虚线1',
key: 5,
icon: 'flow-dash-line1'
},
{
name: '<i class="icon flow-dash-line2"></i>流动虚线2',
value: '流动虚线2',
key: 6,
icon: 'flow-dash-line2'
},
{
name: '<i class="icon pic-line1"></i>流动箭头1',
value: '流动箭头1',
key: 7,
icon: 'pic-line1'
},
{
name: '<i class="icon pic-line2"></i>流动箭头2',
value: '流动箭头2',
key: 8,
icon: 'pic-line2'
},
{
name: '<i class="icon pic-line3"></i>流动箭头3',
value: '流动箭头3',
key: 9,
icon: 'pic-line3'
},
{
name: '<i class="icon pic-line4"></i>流动箭头4',
value: '流动箭头4',
key: 10,
icon: 'pic-line4'
},
{
name: '<i class="icon pic-line5"></i>流动箭头5',
value: '流动箭头5',
key: 11,
icon: 'pic-line5'
},
{
name: '<i class="icon pic-line6"></i>流动箭头6',
value: '流动箭头6',
key: 12,
icon: 'pic-line6'
} }
] ]
let lineTypeDataLegpObject = legp( let lineTypeDataLegpObject = legp(
@ -1518,6 +1781,11 @@ class PolylineObject extends Base {
) )
if (lineTypeDataLegpObject) { if (lineTypeDataLegpObject) {
lineTypeDataLegpObject.legp_search(lineTypeData) lineTypeDataLegpObject.legp_search(lineTypeData)
let iActiveElm2 = document.createElement('i')
iActiveElm2.className = 'icon icon-active'
this._DialogObject._element.content.getElementsByClassName('input-select-line-type')[0].getElementsByClassName('cy_datalist')[0].appendChild(iActiveElm2)
let lineTypeDataLegpElm = this._DialogObject._element.content let lineTypeDataLegpElm = this._DialogObject._element.content
.getElementsByClassName('input-select-line-type')[0] .getElementsByClassName('input-select-line-type')[0]
.getElementsByTagName('input')[0] .getElementsByTagName('input')[0]
@ -1526,6 +1794,7 @@ class PolylineObject extends Base {
if (lineTypeData[i].key === this.options.type) { if (lineTypeData[i].key === this.options.type) {
lineTypeDataLegpObject.legp_searchActive(lineTypeData[i].value) lineTypeDataLegpObject.legp_searchActive(lineTypeData[i].value)
lineTypeDataLegpElm.value = lineTypeData[i].value lineTypeDataLegpElm.value = lineTypeData[i].value
iActiveElm2.className = `icon icon-active ${lineTypeData[i].icon}`
break break
} }
} }
@ -1533,12 +1802,32 @@ class PolylineObject extends Base {
for (let i = 0; i < lineTypeData.length; i++) { for (let i = 0; i < lineTypeData.length; i++) {
if (lineTypeData[i].value === lineTypeDataLegpElm.value) { if (lineTypeData[i].value === lineTypeDataLegpElm.value) {
this.lineType = lineTypeData[i].key this.lineType = lineTypeData[i].key
iActiveElm2.className = `icon icon-active ${lineTypeData[i].icon}`
//控制参数显隐
if (2 < this.lineType && this.lineType < 13) {//贴图参数
document.getElementById('dashTextureDom').style.display = 'flex'
} else {
document.getElementById('dashTextureDom').style.display = 'none'
}
if (2 < this.lineType && this.lineType < 5) {//尾迹参数
document.getElementsByClassName('lineSpace')[0].style.display = 'none'
document.getElementsByClassName('lineSpace')[1].style.display = 'none'
} else {
document.getElementsByClassName('lineSpace')[0].style.display = 'flex'
document.getElementsByClassName('lineSpace')[1].style.display = 'flex'
}
break break
} }
} }
}) })
} }
let heightBoxElm = this._DialogObject._element.content.getElementsByClassName('height-box')[0] let heightBoxElm = this._DialogObject._element.content.getElementsByClassName('height-box')[0]
let heightElm = heightBoxElm.getElementsByClassName('height')[0] let heightElm = heightBoxElm.getElementsByClassName('height')[0]
let heightConfirmElm = this._DialogObject._element.content.getElementsByClassName('height-confirm')[0] let heightConfirmElm = this._DialogObject._element.content.getElementsByClassName('height-confirm')[0]
@ -1760,37 +2049,6 @@ class PolylineObject extends Base {
this._elms.altInput.push(altInput) this._elms.altInput.push(altInput)
tBodyElm.appendChild(tr) tBodyElm.appendChild(tr)
} }
let fontData = getFontList()
let fontObject = legp(
this._DialogObject._element.content.getElementsByClassName(
'font-select-box'
)[0],
'.font-select'
)
if (fontObject) {
fontObject.legp_search(fontData)
let fontDataLegpElm = this._DialogObject._element.content
.getElementsByClassName('font-select')[0]
.getElementsByTagName('input')[0]
fontDataLegpElm.value = fontData[this.labelFontFamily].value
for (let i = 0; i < fontData.length; i++) {
if (fontData[i].value == fontDataLegpElm.value) {
fontObject.legp_searchActive(fontData[i].value)
break
}
}
fontDataLegpElm.addEventListener('input', () => {
for (let i = 0; i < fontData.length; i++) {
if (fontData[i].value === fontDataLegpElm.value) {
this.labelFontFamily = fontData[i].key
break
}
}
})
this._elms.labelFontFamily = [fontDataLegpElm]
}
}, 0) }, 0)
} else { } else {
if (this._DialogObject && this._DialogObject.close) { if (this._DialogObject && this._DialogObject.close) {
@ -1893,21 +2151,41 @@ class PolylineObject extends Base {
alt: fromDegreesArray[i + 2] alt: fromDegreesArray[i + 2]
}) })
} }
this.options.fitLengthByMeter = this.computeDistance( // this.options.fitLengthByMeter = this.computeDistance(
// array,
// 2,
// ground
// )
let _this = this
this.computeDistance(
array, array,
2, 2,
ground this.options['words-name']
) ).then(res => {
_this.options.fitLengthByMeter = res
_this.lengthUnit = _this.options['length-unit']
})
} else { } else {
this.options.fitLengthByMeter = this.computeDistance( let _this = this
this.computeDistance(
positions, positions,
2, 2,
ground this.options['words-name']
) ).then(res => {
_this.options.fitLengthByMeter = res
_this.lengthUnit = _this.options['length-unit']
})
} }
this.fitLengthUnit = this.options['fit-length-unit']
this.options.lengthByMeter = this.computeDistance(positions, 2, ground) let _this = this
this.lengthUnit = this.options['length-unit'] this.computeDistance(
positions,
2,
this.options['words-name']
).then(res => {
_this.options.lengthByMeter = res
_this.lengthUnit = this.options['length-unit']
})
return fromDegreesArray return fromDegreesArray
} }
@ -1972,10 +2250,6 @@ class PolylineObject extends Base {
this.labelShow = this.originalOptions.label.show this.labelShow = this.originalOptions.label.show
this.labelColor = this.originalOptions.label.color this.labelColor = this.originalOptions.label.color
this.labelFontSize = this.originalOptions.label.fontSize this.labelFontSize = this.originalOptions.label.fontSize
this.labelFontFamily = this.originalOptions.label.fontFamily
this.labelScaleByDistance = this.originalOptions.label.scaleByDistance
this.labelNear = this.originalOptions.label.near
this.labelFar = this.originalOptions.label.far
this.labelLineWidth = this.originalOptions.label.lineWidth this.labelLineWidth = this.originalOptions.label.lineWidth
this.labelPixelOffset = this.originalOptions.label.pixelOffset this.labelPixelOffset = this.originalOptions.label.pixelOffset
this.labelLineColor = this.originalOptions.label.lineColor this.labelLineColor = this.originalOptions.label.lineColor
@ -1987,6 +2261,10 @@ class PolylineObject extends Base {
this.attributeVr = this.options.attribute.vr.content this.attributeVr = this.options.attribute.vr.content
this.attributeCamera = this.options.attribute.camera.content this.attributeCamera = this.options.attribute.camera.content
this.attributeGoods = this.options.attribute.goods.content this.attributeGoods = this.options.attribute.goods.content
this.rotate = this.originalOptions.rotate
this.speed = this.originalOptions.speed
this.dashSize = this.originalOptions.dashSize
this.space = this.originalOptions.space
this.cameraSelect && this.cameraSelect() this.cameraSelect && this.cameraSelect()
this.goodsSelect && this.goodsSelect() this.goodsSelect && this.goodsSelect()
@ -2039,7 +2317,7 @@ class PolylineObject extends Base {
.value .value
) { ) {
this.options.attribute.link.content.push({ this.options.attribute.link.content.push({
name: '链接', name: '链接' + (this.options.attribute.link.content.length + 1),
url: this._DialogObject._element.content.getElementsByClassName( url: this._DialogObject._element.content.getElementsByClassName(
'link_add' 'link_add'
)[0].value )[0].value
@ -2057,7 +2335,7 @@ class PolylineObject extends Base {
// input.addEventListener('change', (event) => { // input.addEventListener('change', (event) => {
// if (input.value) { // if (input.value) {
// this.options.attribute.link.content.push({ // this.options.attribute.link.content.push({
// name: '链接', // name: '链接' + (this.options.attribute.link.content.length + 1),
// url: input.value // url: input.value
// }) // })
// this.attributeLink = this.options.attribute.link.content // this.attributeLink = this.options.attribute.link.content
@ -2067,7 +2345,7 @@ class PolylineObject extends Base {
} }
addAttributeLink(link) { addAttributeLink(link) {
this.options.attribute.link.content.push({ this.options.attribute.link.content.push({
name: '链接', name: '链接' + (this.options.attribute.link.content.length + 1),
url: link url: link
}) })
this.attributeLink = this.options.attribute.link.content this.attributeLink = this.options.attribute.link.content
@ -2080,7 +2358,7 @@ class PolylineObject extends Base {
)[0].value )[0].value
) { ) {
this.options.attribute.vr.content.push({ this.options.attribute.vr.content.push({
name: '全景图' , name: '全景图' + (this.options.attribute.vr.content.length + 1),
url: this._DialogObject._element.content.getElementsByClassName( url: this._DialogObject._element.content.getElementsByClassName(
'vr_add' 'vr_add'
)[0].value )[0].value
@ -2096,7 +2374,7 @@ class PolylineObject extends Base {
addAttributeRr(vr) { addAttributeRr(vr) {
this.options.attribute.vr.content.push({ this.options.attribute.vr.content.push({
name: '全景图' , name: '全景图' + (this.options.attribute.vr.content.length + 1),
url: vr url: vr
}) })
this.attributeVr = this.options.attribute.vr.content this.attributeVr = this.options.attribute.vr.content

View File

@ -53,8 +53,8 @@ class RadarScan extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -594,7 +594,7 @@ class RadarScan extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -58,8 +58,8 @@ class RadarScanStereoscopic extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -86,6 +86,10 @@ class RadarScanStereoscopic extends Base {
RadarScanStereoscopic.radarSolidScan(this) RadarScanStereoscopic.radarSolidScan(this)
} }
get type() {
return 'RadarScanStereoscopic'
}
static radarSolidScan(that) { static radarSolidScan(that) {
let viewer = that.sdk.viewer let viewer = that.sdk.viewer
let options = that.options let options = that.options
@ -565,7 +569,7 @@ class RadarScanStereoscopic extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -23,7 +23,7 @@ class SectorObject extends Base {
* @param options.id {string} 标注id * @param options.id {string} 标注id
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.color="#36c4ff" {string} 颜色 * @param options.color="#ff000080" {string} 颜色
* @param options.center {object} 位置 * @param options.center {object} 位置
* @param options.center.lng {object} 经度 * @param options.center.lng {object} 经度
* @param options.center.lat {object} 维度 * @param options.center.lat {object} 维度
@ -31,7 +31,7 @@ class SectorObject extends Base {
* @param options.startAngle=10 {number} 起始方向 * @param options.startAngle=10 {number} 起始方向
* @param options.endAngle=0 {number} 结束方向 * @param options.endAngle=0 {number} 结束方向
* @param options.line {object} 边框 * @param options.line {object} 边框
* @param options.line.width=2 {string} 边框宽 * @param options.line.width=3 {string} 边框宽
* @param options.line.color="rgba(155, 155, 124, 0.89)" {string} 边框颜色 * @param options.line.color="rgba(155, 155, 124, 0.89)" {string} 边框颜色
* @param options.label {object} 标注 * @param options.label {object} 标注
* @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式
@ -39,15 +39,15 @@ class SectorObject extends Base {
constructor(sdk, options = {}) { constructor(sdk, options = {}) {
super(sdk, options); super(sdk, options);
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.color = options.color || "#36c4ff" this.options.color = options.color || "#ff000080"
this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2 this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2
this.options.semiMinorAxis = (options.semiMinorAxis || options.semiMinorAxis === 0) ? options.semiMinorAxis : 10 this.options.semiMinorAxis = (options.semiMinorAxis || options.semiMinorAxis === 0) ? options.semiMinorAxis : 10
this.options.semiMajorAxis = (options.semiMajorAxis || options.semiMajorAxis === 0) ? options.semiMajorAxis : 20 this.options.semiMajorAxis = (options.semiMajorAxis || options.semiMajorAxis === 0) ? options.semiMajorAxis : 20
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options.center = options.center || {} this.options.center = options.center || {}
this.options.line = options.line || {} this.options.line = options.line || {}
this.options.line.width = this.options.line.width || 2 this.options.line.width = ((this.options.line.width || this.options.line.width === 0) ? this.options.line.width : 3)
this.options.line.color = this.options.line.color || 'rgba(155, 155, 124, 0.89)' this.options.line.color = this.options.line.color || '#ff000080'
this.options['area-unit'] = options['area-unit'] || '平方米' this.options['area-unit'] = options['area-unit'] || '平方米'
options.label = options.label || {} options.label = options.label || {}
this._elms = {}; this._elms = {};
@ -60,8 +60,8 @@ class SectorObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -226,14 +226,14 @@ class SectorObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
let material = Cesium.Color.fromCssColorString(v) let material = Cesium.Color.fromCssColorString(this.options.color)
if (this.sdk.viewer.scene.mode === 2) { if (this.sdk.viewer.scene.mode === 2) {
material = new Cesium.CustomColorMaterialSource({ material = new Cesium.CustomColorMaterialSource({
color: v color: this.options.color
}) })
} }
this.entity.polygon.material = material this.entity.polygon.material = material
@ -244,14 +244,14 @@ class SectorObject extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.color = c this.color = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.color = 'rgba(255,255,255,1)' this.color = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.color[i] = colorPicker this._elms.color[i] = colorPicker
@ -263,25 +263,25 @@ class SectorObject extends Base {
return this.options.line.color return this.options.line.color
} }
set lineColor(v) { set lineColor(v) {
this.options.line.color = v this.options.line.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polyline) {
return return
} }
this.entity.polyline.material = Cesium.Color.fromCssColorString(v) this.entity.polyline.material = Cesium.Color.fromCssColorString(this.options.line.color)
if (this._elms.lineColor) { if (this._elms.lineColor) {
this._elms.lineColor.forEach((item, i) => { this._elms.lineColor.forEach((item, i) => {
let lineColorPicker = new ewPlugins('colorpicker', { let lineColorPicker = new ewPlugins('colorpicker', {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.line.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
this.lineColor = c this.lineColor = c
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.lineColor = 'rgba(255,255,255,1)' this.lineColor = 'rgba(255,0,0,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.lineColor[i] = lineColorPicker this._elms.lineColor[i] = lineColorPicker
@ -293,10 +293,10 @@ class SectorObject extends Base {
return this.options.line.width return this.options.line.width
} }
set lineWidth(v) { set lineWidth(v) {
this.options.line.width = v this.options.line.width = ((v || v === 0) ? v : 3)
this.entity.polyline.width = v this.entity.polyline.width = this.options.line.width
this._elms.lineWidth && this._elms.lineWidth.forEach((item) => { this._elms.lineWidth && this._elms.lineWidth.forEach((item) => {
item.value = v item.value = this.options.line.width
}) })
} }
@ -489,7 +489,7 @@ class SectorObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -24,7 +24,7 @@ class StraightArrowObject extends Base {
* @param options {object} 属性 * @param options {object} 属性
* @param options.show=true {boolean} 显示/隐藏 * @param options.show=true {boolean} 显示/隐藏
* @param options.name {string} 名称 * @param options.name {string} 名称
* @param options.color="#36c4ff" {string} 颜色 * @param options.color="#ff000080" {string} 颜色
* @param options.height {number} 高度 * @param options.height {number} 高度
* @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式 * @param options.heightMode=2{number} 高度模式0海拔高度1相对地表2依附模式
* @param {Array.<object>} options.positions 坐标数组 [{lon,lat,alt},...] * @param {Array.<object>} options.positions 坐标数组 [{lon,lat,alt},...]
@ -34,13 +34,13 @@ class StraightArrowObject extends Base {
constructor(sdk, options = {}, _Dialog = {}) { constructor(sdk, options = {}, _Dialog = {}) {
super(sdk, options); super(sdk, options);
this.options.name = options.name || '未命名对象' this.options.name = options.name || '未命名对象'
this.options.color = options.color || "#36c4ff" this.options.color = options.color || "#ff000080"
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2 this.options.heightMode = (options.heightMode || options.heightMode == 0) ? options.heightMode : 2
this.options.positions = options.positions || [] this.options.positions = options.positions || []
this.options.line = options.line || {} this.options.line = options.line || {}
this.options.line.width = this.options.line.width || 2 this.options.line.width = ((this.options.line.width || this.options.line.width === 0) ? this.options.line.width : 3)
this.options.line.color = this.options.line.color || 'rgba(155, 155, 124, 0.89)' this.options.line.color = this.options.line.color || '#ff000080'
this.options['area-unit'] = options['area-unit'] || '平方米' this.options['area-unit'] = options['area-unit'] || '平方米'
this.entity this.entity
this.event = new MouseEvent(this.sdk) this.event = new MouseEvent(this.sdk)
@ -60,8 +60,8 @@ class StraightArrowObject extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -109,14 +109,14 @@ class StraightArrowObject extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff000080'
if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) { if (!this.sdk || !this.sdk.viewer || !this.entity || !this.entity.polygon) {
return return
} }
let material = Cesium.Color.fromCssColorString(v) let material = Cesium.Color.fromCssColorString(this.options.color)
if (this.sdk.viewer.scene.mode === 2) { if (this.sdk.viewer.scene.mode === 2) {
material = new Cesium.CustomColorMaterialSource({ material = new Cesium.CustomColorMaterialSource({
color: v color: this.options.color
}) })
} }
this.entity.polygon.material = material this.entity.polygon.material = material
@ -126,7 +126,7 @@ class StraightArrowObject extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
@ -466,7 +466,7 @@ class StraightArrowObject extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -100,7 +100,7 @@ class TrajectoryMotion extends Base {
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -1305,9 +1305,10 @@ class TrajectoryMotion extends Base {
} }
// 创建模型 // 创建模型
static async addModel(that) { static async addModel(that) {
let url = that.replaceHost(that.options.model.url, that.options.host)
let options = { let options = {
id: that.options.id, id: that.options.id,
url: that.options.model.url, url: url,
show: that.options.show ? that.options.model.show : false, show: that.options.show ? that.options.model.show : false,
scale: that.options.model.scale, scale: that.options.model.scale,
// minimumPixelSize: that.options.model.pixelSize, // minimumPixelSize: that.options.model.pixelSize,
@ -1861,7 +1862,9 @@ class TrajectoryMotion extends Base {
// this.options.viewFollowOrientation.roll = Cesium.Math.toDegrees(this.sdk.viewer.camera.roll) // this.options.viewFollowOrientation.roll = Cesium.Math.toDegrees(this.sdk.viewer.camera.roll)
// this.options.viewFollowOrientation.direction = this.sdk.viewer.camera.direction // this.options.viewFollowOrientation.direction = this.sdk.viewer.camera.direction
this._DialogObject.close() this._DialogObject.close()
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(this.originalOptions) let cdoptions = this.deepCopyObj(this.options)
cdoptions.host = ''
this.Dialog.confirmCallBack && this.Dialog.confirmCallBack(cdoptions)
syncData(this.sdk, this.options.id) syncData(this.sdk, this.options.id)
syncSplitData(this.sdk, this.options.id) syncSplitData(this.sdk, this.options.id)
}, },
@ -2285,7 +2288,7 @@ class TrajectoryMotion extends Base {
async changeModelUrl(url) { async changeModelUrl(url) {
this.sdk.viewer.scene.primitives.remove(this.model) this.sdk.viewer.scene.primitives.remove(this.model)
this.options.model.url = url this.options.model.url = this.replaceHost(url, this.options.host)
let matrix = this.model.modelMatrix let matrix = this.model.modelMatrix
let position = this.model.position let position = this.model.position
let options = { let options = {

View File

@ -41,7 +41,7 @@ function html(that) {
<div class="corner-type"></div> <div class="corner-type"></div>
</div> </div>
<div class="col material-box"> <div class="col material-box">
<span class="label">材质样式</span> <span class="label">墙体样式</span>
<div class="material"></div> <div class="material"></div>
</div> </div>
</div> </div>

View File

@ -32,7 +32,7 @@ class WallRealStereoscopic extends Base {
* @param options['nose-to-tail']=false {boolean} 首尾相连 * @param options['nose-to-tail']=false {boolean} 首尾相连
* @param options.extrudedHeight=2.4 {number} 拉伸高度 * @param options.extrudedHeight=2.4 {number} 拉伸高度
* @param options.cornerType=0 {string} 拐角类型;0直角1斜角2圆角 * @param options.cornerType=0 {string} 拐角类型;0直角1斜角2圆角
* @param options.material=0 {number} 材质0纯色墙1砖墙12砖墙23砖墙3 * @param options.material=0 {number} 材质0纯色墙1红砖2黄砖3灰瓷
* @param {Array.<object>} positions 经纬度和高度的列表,值交替 [{lon,lat,alt},...] * @param {Array.<object>} positions 经纬度和高度的列表,值交替 [{lon,lat,alt},...]
* @param _Dialog {object} 弹框事件 * @param _Dialog {object} 弹框事件
* @param _Dialog.confirmCallBack {function} 弹框确认时的回调 * @param _Dialog.confirmCallBack {function} 弹框确认时的回调
@ -60,8 +60,8 @@ class WallRealStereoscopic extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -398,7 +398,7 @@ class WallRealStereoscopic extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker
@ -1368,20 +1368,20 @@ class WallRealStereoscopic extends Base {
icon: 'icon-wall' icon: 'icon-wall'
}, },
{ {
name: '<i class="icon icon-wall-brick1"></i>砖墙1', name: '<i class="icon icon-wall-brick1"></i>砖墙',
value: '砖墙1', value: '砖墙',
key: 1, key: 1,
icon: 'icon-wall-brick1' icon: 'icon-wall-brick1'
}, },
{ {
name: '<i class="icon icon-wall-brick2"></i>砖墙2', name: '<i class="icon icon-wall-brick2"></i>砖墙',
value: '砖墙2', value: '砖墙',
key: 2, key: 2,
icon: 'icon-wall-brick2' icon: 'icon-wall-brick2'
}, },
{ {
name: '<i class="icon icon-wall-brick3"></i>砖墙3', name: '<i class="icon icon-wall-brick3"></i>灰瓷墙',
value: '砖墙3', value: '灰瓷墙',
key: 3, key: 3,
icon: 'icon-wall-brick3' icon: 'icon-wall-brick3'
} }

View File

@ -47,8 +47,8 @@ class WallStereoscopic extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -287,7 +287,7 @@ class WallStereoscopic extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -58,8 +58,8 @@ class WallRealStereoscopic extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -373,7 +373,7 @@ class WallRealStereoscopic extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -47,8 +47,8 @@ class WallStereoscopic extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -287,7 +287,7 @@ class WallStereoscopic extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -32,10 +32,10 @@ class WallStereoscopic extends Base {
* */ * */
constructor(sdk, options, _Dialog = {}) { constructor(sdk, options, _Dialog = {}) {
super(sdk, options); super(sdk, options);
this.options.color = options.color || "#00d9ff" this.options.color = options.color || "#ff0000"
this.options.extrudedHeight = options.extrudedHeight || 2.4 this.options.extrudedHeight = options.extrudedHeight || 2.4
this.options.positions = options.positions this.options.positions = options.positions
this.options.material = Number(options.material) || 0 this.options.material = (Number(options.material) || Number(options.material) === 0) ? Number(options.material) : 3
this.options.duration = (options.duration || options.duration === 0) ? options.duration : 1000 this.options.duration = (options.duration || options.duration === 0) ? options.duration : 1000
this.options.show = (options.show || options.show === false) ? options.show : true this.options.show = (options.show || options.show === false) ? options.show : true
this.options['nose-to-tail'] = options['nose-to-tail'] || false this.options['nose-to-tail'] = options['nose-to-tail'] || false
@ -51,8 +51,8 @@ class WallStereoscopic extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -113,7 +113,7 @@ class WallStereoscopic extends Base {
return this.options.color return this.options.color
} }
set color(v) { set color(v) {
this.options.color = v this.options.color = v || '#ff0000'
this.entity.polylineVolume.material = this.getMaterial() this.entity.polylineVolume.material = this.getMaterial()
if (this._elms.color) { if (this._elms.color) {
this._elms.color.forEach((item, i) => { this._elms.color.forEach((item, i) => {
@ -121,7 +121,7 @@ class WallStereoscopic extends Base {
el: item.el, el: item.el,
size: 'mini',//颜色box类型 size: 'mini',//颜色box类型
alpha: true,//是否开启透明度 alpha: true,//是否开启透明度
defaultColor: v, defaultColor: this.options.color,
disabled: false,//是否禁止打开颜色选择器 disabled: false,//是否禁止打开颜色选择器
openPickerAni: 'opacity',//打开颜色选择器动画 openPickerAni: 'opacity',//打开颜色选择器动画
sure: (c) => { sure: (c) => {
@ -140,10 +140,10 @@ class WallStereoscopic extends Base {
return this.options.material return this.options.material
} }
set material(v) { set material(v) {
this.options.material = Number(v) this.options.material = (Number(v) || Number(v) === 0) ? Number(v) : 3
this.entity.polylineVolume.material = this.getMaterial() this.entity.polylineVolume.material = this.getMaterial()
this._elms.material && this._elms.material.forEach((item) => { this._elms.material && this._elms.material.forEach((item) => {
item.value = v item.value = this.options.material
}) })
} }
@ -336,7 +336,7 @@ class WallStereoscopic extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -47,8 +47,8 @@ class WallStereoscopic extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -287,7 +287,7 @@ class WallStereoscopic extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -47,8 +47,8 @@ class WallStereoscopic2 extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -306,7 +306,7 @@ class WallStereoscopic2 extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -47,8 +47,8 @@ class WallStereoscopic extends Base {
color: options.label.color || '#ffffff', color: options.label.color || '#ffffff',
lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4, lineWidth: (options.label.lineWidth || options.label.lineWidth === 0) ? options.label.lineWidth : 4,
pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20, pixelOffset: (options.label.pixelOffset || options.label.pixelOffset === 0) ? options.label.pixelOffset : 20,
backgroundColor: options.label.backgroundColor || ['#42c6ef', '#42c6ef'], backgroundColor: options.label.backgroundColor || ['#00ffff80', '#00ffff80'],
lineColor: options.label.lineColor || '#fff000', lineColor: options.label.lineColor || '#00ffff80',
scaleByDistance: options.label.scaleByDistance || false, scaleByDistance: options.label.scaleByDistance || false,
near: (options.label.near || options.label.near === 0) ? options.label.near : 2000, near: (options.label.near || options.label.near === 0) ? options.label.near : 2000,
far: (options.label.far || options.label.far === 0) ? options.label.far : 100000, far: (options.label.far || options.label.far === 0) ? options.label.far : 100000,
@ -287,7 +287,7 @@ class WallStereoscopic extends Base {
this.labelLineColor = color this.labelLineColor = color
},//点击确认按钮事件回调 },//点击确认按钮事件回调
clear: () => { clear: () => {
this.labelLineColor = 'rgba(255,255,255,1)' this.labelLineColor = 'rgba(0,255,255,0.5)'
},//点击清空按钮事件回调 },//点击清空按钮事件回调
}) })
this._elms.labelLineColor[i] = lineColorPicker this._elms.labelLineColor[i] = lineColorPicker

View File

@ -6,6 +6,7 @@
* @update: 2023-12-01 12:12 * @update: 2023-12-01 12:12
*/ */
import Tools from "../../Tools"; import Tools from "../../Tools";
import { getHost, getToken } from "../../on";
import { regLeftClickCallback, regRightClickCallback, regMoveCallback } from "../../Global/ClickCallback"; import { regLeftClickCallback, regRightClickCallback, regMoveCallback } from "../../Global/ClickCallback";
import { regLeftClickCallback as regLeftClickCallback2, regRightClickCallback as regRightClickCallback2, regMoveCallback as regMoveCallback2 } from "../../Global/SplitScreen/ClickCallback"; import { regLeftClickCallback as regLeftClickCallback2, regRightClickCallback as regRightClickCallback2, regMoveCallback as regMoveCallback2 } from "../../Global/SplitScreen/ClickCallback";
import { setSplitDirection, syncSplitData, getSdk } from "../../Global/SplitScreen"; import { setSplitDirection, syncSplitData, getSdk } from "../../Global/SplitScreen";
@ -27,6 +28,7 @@ class Base extends Tools {
this.clickCallBack = null this.clickCallBack = null
this.rightClickCallBack = null this.rightClickCallBack = null
this.picking = true this.picking = true
this.options.host = this.options.host || getHost()
this.setDefaultValue() this.setDefaultValue()
// this.sdk.addIncetance(this.options.id, this) // this.sdk.addIncetance(this.options.id, this)

View File

@ -1,4 +1,4 @@
var legp = function (parentElement, ele) { var legp = function (parentElement, ele, index = 0) {
let targetValue = null let targetValue = null
return ({ return ({
that: Array.prototype.slice.call(parentElement.querySelectorAll(ele), 0), that: Array.prototype.slice.call(parentElement.querySelectorAll(ele), 0),
@ -16,10 +16,14 @@ var legp = function (parentElement, ele) {
item.style.cssText += "display:none;"; item.style.cssText += "display:none;";
}); });
}, },
show: function () { show: function (num) {
if (num !== undefined) {
legp(parentElement, ele).that[num].style.cssText += "display:block;";
} else {
legp(parentElement, ele).that.forEach(function (item) { legp(parentElement, ele).that.forEach(function (item) {
item.style.cssText += "display:block;"; item.style.cssText += "display:block;";
}); });
}
}, },
legp_searchList: function (name) { legp_searchList: function (name) {
let arr = []; let arr = [];
@ -28,19 +32,20 @@ var legp = function (parentElement, ele) {
}); });
return arr; return arr;
}, },
legp_search: function (tagData, search=false) { legp_search: function (tagData, search = false) {
var domId = legp(parentElement, ele).that[0]; // var domId = legp(parentElement, ele).that[0];
var domId = legp(parentElement, ele).that[index];
if (!domId) { if (!domId) {
return return
} }
var html = `<div class="cy_datalist"><i class="yj-custom-icon-arrow-down"></i>\n ${search ? '<input type="text" placeholder="\u8F93\u5165\u6216\u9009\u62E9" autocomplete="off">' : '<input type="text" class="datalist" readonly="readonly" placeholder="\u8bf7\u9009\u62e9" autocomplete="off">'}\n <dl style="display: none;position: absolute;background: rgba(0, 0, 0, 0.5);color: rgba(var(--color-sdk-base-rgb), 1);border: 1px solid rgba(var(--color-sdk-base-rgb), 0.2);border-radius: 3px;margin: 2px 0px;max-height: 300px;overflow-x: hidden;white-space: nowrap; font-size: 12px;z-index: 8;">\n </dl>\n </div>`; var html = `<div class="cy_datalist"><i class="yj-custom-icon-arrow-down"></i>\n ${search ? '<input type="text" placeholder="\u8F93\u5165\u6216\u9009\u62E9" autocomplete="off">' : `<input type="text" class="datalist ${index}" readonly="readonly" placeholder="\u8bf7\u9009\u62e9" autocomplete="off">`}\n <dl style="display: none;position: absolute;background: rgba(0, 0, 0, 0.5);color: rgba(var(--color-sdk-base-rgb), 1);border: 1px solid rgba(var(--color-sdk-base-rgb), 0.2);border-radius: 3px;margin: 2px 0px;max-height: 300px;overflow-x: hidden;white-space: nowrap; font-size: 12px;z-index: 8;">\n </dl>\n </div>`;
domId.innerHTML = html; domId.innerHTML = html;
// domId.appendChild(dom); // domId.appendChild(dom);
//获取当前广告 //获取当前广告
function myClick() { function myClick() {
legp(parentElement, ".cy_datalist dl dd").that.forEach(function (item) { legp(parentElement, ".cy_datalist dl dd").that.forEach(function (item) {
item.onclick = function (e) { item.onclick = function (e) {
if(!this || !this.attributes) { if (!this || !this.attributes) {
return return
} }
let value = this.attributes.value.value; let value = this.attributes.value.value;
@ -68,39 +73,42 @@ var legp = function (parentElement, ele) {
} }
//筛选 //筛选
legp(parentElement, ".cy_datalist input").that[0].oninput = function () { legp(parentElement, ".cy_datalist input").that[index].oninput = function (e) {
var val = this.value; //获取input值 var val = this.value; //获取input值
legp(parentElement, ".cy_datalist dl").hide();
// legp(parentElement, ".cy_datalist dl").hide();
if (tagData.length > 0) { if (tagData.length > 0) {
legp(parentElement, ".cy_datalist dl").show(); legp(parentElement, ".cy_datalist dl").show();
var sear_1 = new RegExp(val); var sear_1 = new RegExp(val);
var judge_1 = false; var judge_1 = false;
legp(parentElement, ".cy_datalist dl").that[0].innerHTML = ""; legp(parentElement, ".cy_datalist dl").that[index].innerHTML = "";
tagData.forEach(function (item) { tagData.forEach(function (item) {
if (sear_1.test(item.name)) { if (sear_1.test(item.name)) {
judge_1 = true; judge_1 = true;
legp(parentElement, ".cy_datalist dl").that[0].innerHTML += "<dd class=\"" + ((targetValue === item.value) ? 'active' : '') + "\" style=\"margin: 0; padding: 5px 5px; color: #fff;cursor: pointer;\" value=\"" + item.value + "\">" + item.name + "</dd>"; legp(parentElement, ".cy_datalist dl").that[index].innerHTML += "<dd class=\"" + ((targetValue === item.value) ? 'active' : '') + "\" style=\"margin: 0; padding: 5px 5px; color: #fff;cursor: pointer;\" value=\"" + item.value + "\">" + item.name + "</dd>";
} }
}); });
if (!judge_1) { if (!judge_1) {
legp(parentElement, ".cy_datalist dl").that[0].innerHTML = "<dd style=\"padding: 10px 20px; color: #fff;\">\u6682\u65E0\u6570\u636E</dd>"; legp(parentElement, ".cy_datalist dl").that[index].innerHTML = "<dd style=\"padding: 10px 20px; color: #fff;\">\u6682\u65E0\u6570\u636E</dd>";
} }
myClick(); myClick();
} }
}; };
//显示没被选择的 //显示没被选择的
legp(parentElement, ".cy_datalist input").that[0].onclick = function (e) { legp(parentElement, ".cy_datalist input").that[index].onclick = function (e) {
if(legp(parentElement, ".cy_datalist dl").that[0].style.display === 'none') {
legp(parentElement, ".cy_datalist dl").hide();
let num = e.srcElement.classList[1] * 1
num = num || 0
if (legp(parentElement, ".cy_datalist dl").that[num].style.display === 'none') {
if (tagData.length == 0) { if (tagData.length == 0) {
this.innerHTML = "暂无数据"; this.innerHTML = "暂无数据";
} }
else { else {
legp(parentElement, ".cy_datalist dl").show(); legp(parentElement, ".cy_datalist dl").show(num);
} }
legp(parentElement, ".cy_datalist dl").that[0].innerHTML = ""; legp(parentElement, ".cy_datalist dl").that[num].innerHTML = "";
tagData.forEach(function (item) { tagData.forEach(function (item) {
legp(parentElement, ".cy_datalist dl").that[0].innerHTML += "<dd class=\"" + ((targetValue === item.value) ? 'active' : '') + "\" style=\"margin: 0; padding: 5px 5px; color: #fff;cursor: pointer;\" value=\"" + item.value + "\">" + item.name + "</dd>"; legp(parentElement, ".cy_datalist dl").that[num].innerHTML += "<dd class=\"" + ((targetValue === item.value) ? 'active' : '') + "\" style=\"margin: 0; padding: 5px 5px; color: #fff;cursor: pointer;\" value=\"" + item.value + "\">" + item.name + "</dd>";
}); });
myClick(); myClick();
} }

View File

@ -1,21 +1,27 @@
let fontData = [ let fontData = [
{
name: '黑体',
value: '黑体',
font: 'SimHei',
key: '0'
},
{ {
name: '思源黑体', name: '思源黑体',
value: '思源黑体', value: '思源黑体',
font: 'SourceHanSansTi', font: 'SourceHanSansTi',
key: '0' key: '1'
}, },
{ {
name: '庞门正道标题体', name: '庞门正道标题体',
value: '庞门正道标题体', value: '庞门正道标题体',
font: 'PMZDBTTi', font: 'PMZDBTTi',
key: '1' key: '2'
}, },
{ {
name: '数黑体', name: '数黑体',
value: '数黑体', value: '数黑体',
font: 'AlimamaShuHeiTi', font: 'AlimamaShuHeiTi',
key: '2' key: '3'
} }
] ]

View File

@ -1,4 +1,4 @@
let list = ['icon-py', 'icon-edit', 'icon-add', 'icon-add2', 'icon-minus', 'icon-play', 'icon-pause', 'icon-updateheight', 'icon-draw', 'icon-positions', 'icon-reset', 'icon-xj', 'icon-yj', 'icon-zj', 'icon-close', 'icon-query', 'icon-route', 'icon-copy', 'icon-load', 'icon-rubric'] let list = ['icon-py', 'icon-edit', 'icon-add', 'icon-add2', 'icon-minus', 'icon-play', 'icon-pause', 'icon-updateheight', 'icon-draw', 'icon-positions', 'icon-reset', 'icon-xj', 'icon-yj', 'icon-zj', 'icon-close', 'icon-query', 'icon-route', 'icon-copy', 'icon-load', 'icon-rubric', 'icon-pen', 'icon-cross']
function setSvg() { function setSvg() {
let svgElm = document.createElement('svg'); let svgElm = document.createElement('svg');
svgElm.xmlns = 'http://www.w3.org/2000/svg' svgElm.xmlns = 'http://www.w3.org/2000/svg'

View File

@ -0,0 +1,221 @@
class YJColorPicker {
constructor(options = {}) {
let _this = this
let pickAlphaInput
let config = {
el: options.el,
size: "mini",
isLog: false,
disabled: options.disabled || false, //是否禁止打开颜色选择器
alpha: false, //是否开启透明度
sure: (color) => {
if (pickAlphaInput) {
let c = Cesium.Color.fromCssColorString(color).withAlpha(pickAlphaInput.value / 100)
this.pickAlphaInputValue = pickAlphaInput.value
color = c.toCssHexString()
}
if (options.sure && typeof options.sure == 'function') {
options.sure(color)
}
setTimeout(() => {
customizeStyle()
}, this.colorPicker.config.pickerAnimationTime);
},
clear: () => {
options.clear()
},
close: () => {
pickAlphaInput.value = this.pickAlphaInputValue
},
clickDefineColor: clickDefineColor,
hasClear: false,
defaultColor: options.defaultColor || '#ffffff'
}
let CesiumColor = Cesium.Color.fromCssColorString(options.defaultColor)
if (!CesiumColor) {
config.defaultColor = '#ffffff'
CesiumColor = Cesium.Color.fromCssColorString(config.defaultColor)
}
if (options.predefineColor) {
config.predefineColor = ['rgba(255, 255, 255, 1)', 'rgba(255, 0, 0, 1)', 'rgba(208, 132, 209, 1)', 'rgba(100, 182, 217, 1)', 'rgba(42, 130, 228, 1)', 'rgba(214, 36, 36, 1)', 'rgba(252, 222, 111, 1)', 'rgba(67, 207, 124, 1)', 'rgba(176, 243, 143, 1)', 'rgba(121, 72, 234, 1)', 'rgba(255, 195, 0, 1)', 'rgba(0, 186, 173, 1)', 'rgba(165, 214, 63, 1)', 'rgba(0, 0, 0, 1)', 'rgba(46, 47, 51, 1)', 'rgba(172, 51, 193, 1)', 'rgba(130, 21, 21, 1)', 'rgba(255, 87, 51, 1)', 'rgba(255, 140, 0, 1)', 'rgba(125, 191, 255, 1)']
}
this.colorPicker = new ewColorPicker(config)
window.colorPicker = this.colorPicker
console.log('this.colorPicker', this.colorPicker, this.colorPicker.$Dom.pickerInput)
customizeStyle()
function customizeStyle() {
let isSubtract = false
let box = _this.colorPicker.$Dom.box
let picker = _this.colorPicker.$Dom.picker
picker.style.minWidth = '300px'
let pickerContent = picker.getElementsByClassName('ew-color-picker-content')[0]
let pickAlphaSliderBar = picker.getElementsByClassName('ew-alpha-slider-bar')[0]
if (pickAlphaSliderBar) {
pickAlphaSliderBar.parentNode.style.width = '16px'
pickAlphaSliderBar.parentNode.removeChild(pickAlphaSliderBar)
}
let customDivider = document.createElement('span')
customDivider.className = 'custom-divider'
pickerContent.parentNode.insertBefore(customDivider, pickerContent.nextSibling)
let pickPen = document.createElement('div')
pickPen.className = 'icon-pen-box'
pickPen.innerHTML = '<svg class="icon-pen"><use xlink:href="#yj-icon-pen"></use></svg>'
let pickerInput = _this.colorPicker.$Dom.pickerInput
pickerInput.parentNode.insertBefore(pickPen, pickerInput)
pickerInput.style.width = 'calc(77% - 24px)'
if (options.alpha) {
let pickAlpha = document.createElement('div')
pickAlpha.className = 'input-number input-number-unit-1 color-alpha'
pickAlpha.innerHTML = `
<input class="input" type="number" title="" step="0.01" min="0" max="100">
<span class="unit">%</span>
<span class="arrow"></span>`
pickerInput.parentNode.insertBefore(pickAlpha, pickerInput.nextSibling)
pickerInput.style.width = '39%'
pickAlpha.style.width = 'calc(32% - 12px)'
pickAlphaInput = pickAlpha.getElementsByClassName('input')[0]
if (_this.pickAlphaInputValue || _this.pickAlphaInputValue === 0 || _this.pickAlphaInputValue === '0') {
pickAlphaInput.value = Number(Number(_this.pickAlphaInputValue).toFixed(2))
}
else {
pickAlphaInput.value = Number((CesiumColor.alpha * 100).toFixed(2))
}
_this.pickAlphaInputValue = pickAlphaInput.value
box.style.background = Cesium.Color.fromCssColorString(_this.colorPicker._privateConfig.colorValue).withAlpha(pickAlphaInput.value / 100).toCssColorString()
}
else {
CesiumColor = CesiumColor.withAlpha(1)
}
let defineColorContainer = picker.getElementsByClassName('ew-pre-define-color-container')[0]
if (defineColorContainer) {
let colorList = localStorage.getItem('custom-color')
if (colorList) {
colorList = JSON.parse(colorList)
}
else {
colorList = {}
}
let customDivider2 = document.createElement('span')
customDivider2.className = 'custom-divider'
let customDivider3 = document.createElement('span')
customDivider3.className = 'custom-divider'
defineColorContainer.parentNode.insertBefore(customDivider2, defineColorContainer)
defineColorContainer.parentNode.insertBefore(customDivider3, defineColorContainer.nextSibling)
let collectColorContainer = document.createElement('div')
collectColorContainer.className = 'yj-pre-collect-color-container'
customDivider3.parentNode.insertBefore(collectColorContainer, customDivider3.nextSibling)
let addColorBtn = document.createElement('div')
addColorBtn.innerHTML = '<svg class="icon-add2"><use xlink:href="#yj-icon-add2"></use></svg>'
addColorBtn.className = 'yj-pre-collect-color add'
let subtractColorBtn = document.createElement('div')
subtractColorBtn.innerHTML = '<svg class="icon-minus"><use xlink:href="#yj-icon-minus"></use></svg>'
subtractColorBtn.className = 'yj-pre-collect-color subtract'
collectColorContainer.appendChild(addColorBtn)
collectColorContainer.appendChild(subtractColorBtn)
let subtractElmList = []
for (let key in colorList) {
let colorElm = document.createElement('div')
colorElm.className = 'yj-pre-collect-color'
let colorItemElm = document.createElement('div')
colorItemElm.className = 'yj-pre-define-color-item'
colorElm.appendChild(colorItemElm)
colorItemElm.className = 'yj-pre-define-color-item'
let c = Cesium.Color.fromCssColorString(colorList[key])
let colorString = c.toCssHexString()
colorItemElm.style.backgroundColor = colorString
colorItemElm.addEventListener('click', () => {
_this.colorPicker.updateColor(c.toCssColorString())
clickDefineColor(colorString)
})
let subtractElm = document.createElement('div')
subtractElm.className = 'yj-pre-define-color-item subtract-btn'
subtractElm.innerHTML = '<svg class="icon-cross"><use xlink:href="#yj-icon-cross"></use></svg>'
subtractElm.style.display = 'none'
colorElm.appendChild(subtractElm)
collectColorContainer.appendChild(colorElm)
subtractElm.addEventListener('click', () => {
delete colorList[key]
localStorage.setItem('custom-color', JSON.stringify(colorList))
collectColorContainer.removeChild(colorElm)
})
subtractElmList.push(subtractElm)
}
addColorBtn.addEventListener('click', () => {
if (isSubtract) {
isSubtract = false
for (let i = 0; i < subtractElmList.length; i++) {
subtractElmList[i].style.display = 'none'
}
}
let colorElm = document.createElement('div')
colorElm.className = 'yj-pre-collect-color'
let colorItemElm = document.createElement('div')
colorItemElm.className = 'yj-pre-define-color-item'
colorElm.appendChild(colorItemElm)
let c = Cesium.Color.fromCssColorString(_this.colorPicker.prevInputValue)
if (pickAlphaInput) {
c = c.withAlpha(pickAlphaInput.value / 100)
}
let colorString = c.toCssHexString()
colorItemElm.style.backgroundColor = colorString
colorItemElm.addEventListener('click', () => {
_this.colorPicker.updateColor(c.toCssColorString())
clickDefineColor(colorString)
})
collectColorContainer.appendChild(colorElm)
let subtractElm = document.createElement('div')
subtractElm.className = 'yj-pre-define-color-item subtract-btn'
subtractElm.innerHTML = '<svg class="icon-cross"><use xlink:href="#yj-icon-cross"></use></svg>'
subtractElm.style.display = 'none'
colorElm.appendChild(subtractElm)
subtractElmList.push(subtractElm)
let key = Cesium.createGuid()
colorList[key] = colorString
localStorage.setItem('custom-color', JSON.stringify(colorList))
subtractElm.addEventListener('click', () => {
delete colorList[key]
localStorage.setItem('custom-color', JSON.stringify(colorList))
collectColorContainer.removeChild(colorElm)
})
})
subtractColorBtn.addEventListener('click', () => {
isSubtract = !isSubtract
if (isSubtract) {
for (let i = 0; i < subtractElmList.length; i++) {
subtractElmList[i].style.display = 'block'
}
}
else {
for (let i = 0; i < subtractElmList.length; i++) {
subtractElmList[i].style.display = 'none'
}
}
})
}
}
function clickDefineColor(color) {
if (pickAlphaInput) {
let c = Cesium.Color.fromCssColorString(color)
pickAlphaInput.value = c.alpha * 100
}
}
}
}
export default YJColorPicker

View File

@ -0,0 +1,148 @@
/*
* @Description: 流动线
*/
function FlowDashedLine() {
class FlowDashedLineFlowMaterialProperty {
constructor(options) {
this._definitionChanged = new Cesium.Event();
this._color = undefined;
this._speed = undefined;
this._uType = undefined;
this._space = undefined;
this._dashSize = undefined;
this.color = new Cesium.Color.fromCssColorString(options.color || "rgba(255,255,255,1)");
this.speed = options.speed != undefined ? options.speed : 1.0;//速度
this.space = options.space || 0.0;//速度
this.dashSize = options.dashSize || 0.03;//速度
this.uType = options.uType === undefined ? 1 : options.uType;//类型0普通流动线 1虚化虚线
this.lineBackAlpha = options.lineBackAlpha || 0.05;
}
get isConstant() {
return false;
}
get definitionChanged() {
return this._definitionChanged;
}
getType(time) {
return Cesium.Material.FlowDashedLineMaterialType;
}
getValue(time, result) {
if (!Cesium.defined(result)) {
result = {};
}
result.color = Cesium.Property.getValueOrDefault(
this._color,
time,
Cesium.Color.RED,
result.color
);
result.speed = Cesium.Property.getValueOrDefault(
this._speed,
time,
10,
result.speed
);
result.space = Cesium.Property.getValueOrDefault(
this._space,
time,
10,
result.space
);
result.dashSize = Cesium.Property.getValueOrDefault(
this._dashSize,
time,
10,
result.dashSize
);
result.uType = Cesium.Property.getValueOrDefault(
this._uType,
time,
1,
result.uType
);
result.lineBackAlpha = this.lineBackAlpha;
result.frameNumber = Cesium.getTimestamp();
return result;
}
equals(other) {
return (
this === other ||
(other instanceof FlowDashedLineFlowMaterialProperty &&
Cesium.Property.equals(this._color, other._color) &&
Cesium.Property.equals(this._speed, other.speed) &&
Cesium.Property.equals(this._uType, other.uType) &&
Cesium.Property.equals(this.lineBackAlpha, other.lineBackAlpha))
);
}
}
Object.defineProperties(FlowDashedLineFlowMaterialProperty.prototype, {
color: Cesium.createPropertyDescriptor("color"),
speed: Cesium.createPropertyDescriptor("speed"),
space: Cesium.createPropertyDescriptor("space"),
dashSize: Cesium.createPropertyDescriptor("dashSize"),
uType: Cesium.createPropertyDescriptor("uType"),
transparency: Cesium.createPropertyDescriptor("lineBackAlpha"),
});
Cesium.FlowDashedLineFlowMaterialProperty = FlowDashedLineFlowMaterialProperty;
Cesium.Material.FlowDashedLineFlowMaterialProperty = "FlowDashedLineFlowMaterialProperty";
Cesium.Material.FlowDashedLineMaterialType = "FlowDashedLineMaterialType";
Cesium.Material.FlowDashedLineMaterialSource = `
uniform vec4 color;
uniform float speed;
// uniform int uType;
uniform float lineBackAlpha;
czm_material czm_getMaterial(czm_materialInput materialInput)
{
czm_material material = czm_getDefaultMaterial(materialInput);
vec2 st = materialInput.st;
float dashSize = 0.1;
float gapSize = space;
// speed现在表示完成一次完整动画循环的秒数
float progress = speed==0.0 ? 0.0 : fract(frameNumber / 1000.0 / speed);
float pattern = fract(st.x / dashSize * (1.0 + gapSize) + progress / dashSize * (1.0 + gapSize));
float dash1 = step(0.0, pattern) - step(1.0/(1.0 + gapSize), pattern);
float dash2 = smoothstep(0.0, 0.2, pattern) -
smoothstep(1.0/(1.0 + gapSize),
1.0/(1.0 + gapSize) + 0.2,
pattern);
float dash = (float(uType) != 1.0)?dash1:dash2;
material.alpha = dash;
material.diffuse = color.rgb;
return material;
}
`;
Cesium.Material._materialCache.addMaterial(
Cesium.Material.FlowDashedLineMaterialType,
{
fabric: {
type: Cesium.Material.FlowDashedLineMaterialType,
uniforms: {
color: new Cesium.Color(1.0, 1.0, 1.0, 1.0),
speed: 1,
space: 0.0,
dashSize: 0.03,
frameNumber: Cesium.getTimestamp(),
uType: 1,
lineBackAlpha: 0.05,
},
source: Cesium.Material.FlowDashedLineMaterialSource,
},
translucent: function (material) {
return true;
},
}
);
}
export { FlowDashedLine }

View File

@ -0,0 +1,113 @@
/*
* @Description: 流动线
*/
function FlowLine() {
class FlowLineMaterialProperty {
constructor(options) {
this._definitionChanged = new Cesium.Event();
this._color = undefined;
this._duration = undefined;
this.color = new Cesium.Color.fromCssColorString(options.color || "rgba(255,255,255,1)");
this.duration = options.duration || 10.0;
this.lineBackAlpha = options.lineBackAlpha || 0.05;
}
get isConstant() {
return false;
}
get definitionChanged() {
return this._definitionChanged;
}
getType(time) {
return Cesium.Material.FlowLineMaterialType;
}
getValue(time, result) {
if (!Cesium.defined(result)) {
result = {};
}
result.color = Cesium.Property.getValueOrDefault(
this._color,
time,
Cesium.Color.RED,
result.color
);
result.duration = Cesium.Property.getValueOrDefault(
this._duration,
time,
10,
result.duration
);
result.lineBackAlpha = this.lineBackAlpha;
result.frameNumber = Cesium.getTimestamp();
return result;
}
equals(other) {
return (
this === other ||
(other instanceof FlowLineMaterialProperty &&
Cesium.Property.equals(this._color, other._color) &&
Cesium.Property.equals(this._duration, other.duration) &&
Cesium.Property.equals(this.lineBackAlpha, other.lineBackAlpha))
);
}
}
Object.defineProperties(FlowLineMaterialProperty.prototype, {
color: Cesium.createPropertyDescriptor("color"),
duration: Cesium.createPropertyDescriptor("duration"),
transparency: Cesium.createPropertyDescriptor("lineBackAlpha"),
});
Cesium.FlowLineMaterialProperty = FlowLineMaterialProperty;
Cesium.Material.FlowLineMaterialProperty = "FlowLineMaterialProperty";
Cesium.Material.FlowLineMaterialType = "FlowLineMaterialType";
Cesium.Material.FlowLineMaterialSource = `
uniform vec4 color;
uniform float duration;
uniform float lineBackAlpha;
czm_material czm_getMaterial(czm_materialInput materialInput)
{
//生成默认的基础材质
czm_material material = czm_getDefaultMaterial(materialInput);
//获取stuv
vec2 st = materialInput.st;
//获取当前帧数10秒内变化0-1
float time = fract(czm_frameNumber / (60.0*duration));
//长度1/10
time = time * (1.0 + 0.1);
//平滑过渡函数
float alpha = smoothstep(time-0.1,time,st.s) * step(-time,-st.s);
//光带轨迹(不会完全透明)
alpha += lineBackAlpha;
material.alpha = alpha;
material.diffuse = color.rgb;
return material;
}
`;
Cesium.Material._materialCache.addMaterial(
Cesium.Material.FlowLineMaterialType,
{
fabric: {
type: Cesium.Material.FlowLineMaterialType,
uniforms: {
color: new Cesium.Color(1.0, 1.0, 1.0, 1.0),
duration: 10.0,
lineBackAlpha: 0.05,
},
source: Cesium.Material.FlowLineMaterialSource,
},
translucent: function (material) {
return true;
},
}
);
}
export { FlowLine }

View File

@ -0,0 +1,123 @@
/*
* @Description: 流动线
*/
function LineTexture() {
class LineTextureMaterialProperty {
constructor(options) {
this._definitionChanged = new Cesium.Event();
this._image = undefined;
this._color = undefined;
this._speed = undefined;
this._repeat = undefined;
this.image = options.image || "";
this.color = new Cesium.Color.fromCssColorString(options.color || "rgba(255,255,255,1)");
this.speed = options.speed != undefined ? options.speed : 1.0;
this.repeat = options.repeat || new Cesium.Cartesian2(1.0, 1.0);
}
get isConstant() {
return false;
}
get definitionChanged() {
return this._definitionChanged;
}
getType(time) {
return Cesium.Material.LineTextureMaterialType;
}
getValue(time, result) {
if (!Cesium.defined(result)) {
result = {};
}
result.image = Cesium.Property.getValueOrDefault(
this._image,
time,
"",
result.image
);
result.color = Cesium.Property.getValueOrDefault(
this._color,
time,
Cesium.Color.RED,
result.color
);
result.speed = Cesium.Property.getValueOrDefault(
this._speed,
time,
1.0,
result.speed
);
result.repeat = Cesium.Property.getValueOrDefault(
this._repeat,
time,
new Cesium.Cartesian2(1.0, 1.0),
result.repeat
);
result.frameNumber = Cesium.getTimestamp();
return result;
}
equals(other) {
return (
this === other ||
(other instanceof LineTextureMaterialProperty &&
Cesium.Property.equals(this._image, other._image) &&
Cesium.Property.equals(this._color, other._color) &&
Cesium.Property.equals(this._imageW, other._imageW) &&
Cesium.Property.equals(this._speed, other._speed))
);
}
}
Object.defineProperties(LineTextureMaterialProperty.prototype, {
image: Cesium.createPropertyDescriptor("image"),
color: Cesium.createPropertyDescriptor("color"),
speed: Cesium.createPropertyDescriptor("speed"),
repeat: Cesium.createPropertyDescriptor("repeat"),
});
Cesium.LineTextureMaterialProperty = LineTextureMaterialProperty;
Cesium.Material.LineTextureMaterialProperty = "LineTextureMaterialProperty";
Cesium.Material.LineTextureMaterialType = "LineTextureMaterialType";
Cesium.Material.LineTextureMaterialSource = `
uniform vec4 color;
uniform sampler2D image;
uniform float speed;
// uniform float repeat;
czm_material czm_getMaterial(czm_materialInput materialInput)
{
czm_material material = czm_getDefaultMaterial(materialInput);
vec2 st = materialInput.st;
st.s *= repeat.x; // 关键通过repeat控制纹理密度
// vec4 colorImage = texture2D(image, vec2(fract(st.s + speed*czm_frameNumber* 0.01), st.t));
vec4 colorImage = speed==0.0?texture2D(image, vec2(fract(st.s), st.t)):texture2D(image, vec2(fract(st.s + frameNumber / 1000.0 / speed * repeat.x / repeat.y ), st.t));
material.alpha = colorImage.a * color.a;
material.diffuse = color.rgb;
return material;
}
`;
Cesium.Material._materialCache.addMaterial(
Cesium.Material.LineTextureMaterialType,
{
fabric: {
type: Cesium.Material.LineTextureMaterialType,
uniforms: {
color: new Cesium.Color(1.0, 1.0, 1.0, 1.0),
image: '',
repeat: new Cesium.Cartesian2(1.0, 1.0),
speed: 1.0,
frameNumber: Cesium.getTimestamp(),
uTime: 1
},
source: Cesium.Material.LineTextureMaterialSource,
},
translucent: function (material) {
return true;
},
}
);
}
export { LineTexture }

View File

@ -0,0 +1,131 @@
/*
* @Description: 流动线
*/
function PolylineFlow() {
class PolylineFlowMaterialProperty {
constructor(options) {
this._definitionChanged = new Cesium.Event();
this._color = undefined;
this._speed = undefined;
this._rotate = undefined;
this.color = new Cesium.Color.fromCssColorString(options.color || "rgba(255,255,255,1)");
this.speed = options.speed != undefined ? options.speed : 1.0;//速度
this.lineBackAlpha = options.lineBackAlpha || 0.05;
this.rotate = options.rotate;
}
get isConstant() {
return false;
}
get definitionChanged() {
return this._definitionChanged;
}
getType(time) {
return Cesium.Material.PolylineFlowMaterialType;
}
getValue(time, result) {
if (!Cesium.defined(result)) {
result = {};
}
result.color = Cesium.Property.getValueOrDefault(
this._color,
time,
Cesium.Color.RED,
result.color
);
result.speed = Cesium.Property.getValueOrDefault(
this._speed,
time,
10,
result.speed
);
result.rotate = Cesium.Property.getValueOrDefault(
this._rotate,
time,
true,
result.rotate
);
result.lineBackAlpha = this.lineBackAlpha;
result.frameTime = Cesium.getTimestamp();
// result.frameNumber = Cesium.getTimestamp();
return result;
}
equals(other) {
return (
this === other ||
(other instanceof PolylineFlowMaterialProperty &&
Cesium.Property.equals(this._color, other._color) &&
Cesium.Property.equals(this._speed, other.speed) &&
Cesium.Property.equals(this.lineBackAlpha, other.lineBackAlpha))
);
}
}
Object.defineProperties(PolylineFlowMaterialProperty.prototype, {
color: Cesium.createPropertyDescriptor("color"),
speed: Cesium.createPropertyDescriptor("speed"),
rotate: Cesium.createPropertyDescriptor("rotate"),
transparency: Cesium.createPropertyDescriptor("lineBackAlpha"),
});
Cesium.PolylineFlowMaterialProperty = PolylineFlowMaterialProperty;
Cesium.Material.PolylineFlowMaterialProperty = "PolylineFlowMaterialProperty";
Cesium.Material.PolylineFlowMaterialType = "PolylineFlowMaterialType";
Cesium.Material.PolylineFlowMaterialSource = `
uniform vec4 color;
uniform float speed;
uniform float lineBackAlpha;
czm_material czm_getMaterial(czm_materialInput materialInput)
{
//生成默认的基础材质
czm_material material = czm_getDefaultMaterial(materialInput);
//获取stuv
vec2 st = materialInput.st;
//获取当前帧数10秒内变化0-1
// float time = fract(czm_frameNumber * speed / 60.0);
// float time = fract(abs(speed) * czm_frameNumber * 0.01);
float time = fract(frameTime / 1000.0 / abs(speed));
//长度1/10
// time = time * (1.0 + 0.1);
float staticAlpha = rotate?smoothstep(0.0,1.0, 1.0-st.s) * step(-1.0,-(1.0-st.s)):smoothstep(0.0,1.0, st.s) * step(-1.0,-st.s);
//平滑过渡函数
float alpha1 = smoothstep(time-0.1,time,1.0-st.s) * step(-time,- (1.0-st.s));
float alpha2 = smoothstep(time-0.1,time,st.s) * step(-time,- st.s);
float alpha =(speed== 0.0)? staticAlpha:(speed < 0.0)?alpha2:alpha1;
//光带轨迹(不会完全透明)
alpha += lineBackAlpha;
material.alpha = alpha;
material.diffuse = color.rgb;
return material;
}
`;
Cesium.Material._materialCache.addMaterial(
Cesium.Material.PolylineFlowMaterialType,
{
fabric: {
type: Cesium.Material.PolylineFlowMaterialType,
uniforms: {
color: new Cesium.Color(1.0, 1.0, 1.0, 1.0),
speed: 0.1,
rotate: true,
frameTime: Cesium.getTimestamp(),
lineBackAlpha: 0.05,
},
source: Cesium.Material.PolylineFlowMaterialSource,
},
translucent: function (material) {
return true;
},
}
);
}
export { PolylineFlow }

View File

@ -0,0 +1,167 @@
/*
* @Description: 流动线
*/
function PolylineFlowMult() {
class PolylineFlowMultMaterialProperty {
constructor(options) {
this._definitionChanged = new Cesium.Event();
this._color = undefined;
this._speed = undefined;
this._rotate = undefined;
this.color = new Cesium.Color.fromCssColorString(options.color || "rgba(255,255,255,1)");
this.speed = options.speed != undefined ? options.speed : 1.0;//速度
this.lineBackAlpha = options.lineBackAlpha || 0.05;
this.rotate = options.rotate;
}
get isConstant() {
return false;
}
get definitionChanged() {
return this._definitionChanged;
}
getType(time) {
return Cesium.Material.PolylineFlowMultMaterialType;
}
getValue(time, result) {
if (!Cesium.defined(result)) {
result = {};
}
result.color = Cesium.Property.getValueOrDefault(
this._color,
time,
Cesium.Color.RED,
result.color
);
result.speed = Cesium.Property.getValueOrDefault(
this._speed,
time,
10,
result.speed
);
result.rotate = Cesium.Property.getValueOrDefault(
this._rotate,
time,
true,
result.rotate
);
result.lineBackAlpha = this.lineBackAlpha;
result.frameTime = Cesium.getTimestamp();
return result;
}
equals(other) {
return (
this === other ||
(other instanceof PolylineFlowMultMaterialProperty &&
Cesium.Property.equals(this._color, other._color) &&
Cesium.Property.equals(this._speed, other.speed) &&
Cesium.Property.equals(this._rotate, other.rotate) &&
Cesium.Property.equals(this.lineBackAlpha, other.lineBackAlpha))
);
}
}
Object.defineProperties(PolylineFlowMultMaterialProperty.prototype, {
color: Cesium.createPropertyDescriptor("color"),
speed: Cesium.createPropertyDescriptor("speed"),
rotate: Cesium.createPropertyDescriptor("rotate"),
transparency: Cesium.createPropertyDescriptor("lineBackAlpha"),
});
Cesium.PolylineFlowMultMaterialProperty = PolylineFlowMultMaterialProperty;
Cesium.Material.PolylineFlowMultMaterialProperty = "PolylineFlowMultMaterialProperty";
Cesium.Material.PolylineFlowMultMaterialType = "PolylineFlowMultMaterialType";
Cesium.Material.PolylineFlowMaterialSource = `
uniform vec4 color;
uniform float speed;
uniform float lineBackAlpha;
czm_material czm_getMaterial(czm_materialInput materialInput)
{
czm_material material = czm_getDefaultMaterial(materialInput);
vec2 st = materialInput.st;
// 基础时间轴(控制主光带)
float baseTime = fract(czm_frameNumber * speed / 60.0) * 1.1;
// 高频时间轴(控制高光点)
// float highlightTime = fract(czm_frameNumber * speed * 3.0 / 60.0);
// float highlightTime = fract(abs(speed) * czm_frameNumber * 0.01);
float highlightTime = fract(frameTime / 1000.0 / abs(speed));
float highlightSpacing = 0.3; // 高光点间隔
// 主光带透明度计算
float mainAlpha = smoothstep(baseTime-0.1, baseTime, st.s) * step(-baseTime, -st.s);
// 多高光点计算3个周期性光斑
float highlight11 = smoothstep(highlightTime-0.05, highlightTime, st.s) *
step(-highlightTime, -st.s) *
(1.0 - smoothstep(0.0, highlightSpacing, abs(st.s - highlightTime)));
float highlight21 = smoothstep(highlightTime+highlightSpacing-0.05,
highlightTime+highlightSpacing, st.s) *
step(-(highlightTime+highlightSpacing), -st.s) *
(1.0 - smoothstep(0.0, highlightSpacing, abs(st.s - (highlightTime+highlightSpacing))));
float highlight31 = smoothstep(highlightTime+2.0*highlightSpacing-0.05,
highlightTime+2.0*highlightSpacing, st.s) *
step(-(highlightTime+2.0*highlightSpacing), -st.s) *
(1.0 - smoothstep(0.0, highlightSpacing, abs(st.s - (highlightTime+2.0*highlightSpacing))));
float highlight12 = smoothstep(highlightTime-0.05, highlightTime, 1.0 - st.s) *
step(-highlightTime, -(1.0-st.s)) *
(1.0 - smoothstep(0.0, highlightSpacing, abs(1.0 - st.s - highlightTime)));
float highlight22 = smoothstep(highlightTime+highlightSpacing-0.05,
highlightTime+highlightSpacing, 1.0 - st.s) *
step(-(highlightTime+highlightSpacing),-(1.0 - st.s)) *
(1.0 - smoothstep(0.0, highlightSpacing, abs(1.0-st.s - (highlightTime+highlightSpacing))));
float highlight32 = smoothstep(highlightTime+2.0*highlightSpacing-0.05,
highlightTime+2.0*highlightSpacing, 1.0 - st.s) *
step(-(highlightTime+2.0*highlightSpacing), -(1.0-st.s)) *
(1.0 - smoothstep(0.0, highlightSpacing, abs(1.0 - st.s - (highlightTime+2.0*highlightSpacing))));
float highlight1 = !rotate?highlight11:highlight12;
float highlight2 = !rotate?highlight21:highlight22;
float highlight3 = !rotate?highlight31:highlight32;
// 合并效果
// material.alpha = mainAlpha * 0.7 +
// (highlight1 + highlight2 + highlight3) * 0.5 +
// lineBackAlpha;
material.alpha = (highlight1 + highlight2 + highlight3) * 0.5 +
lineBackAlpha;
material.diffuse = color.rgb; // 高光区变亮
return material;
}
`;
Cesium.Material._materialCache.addMaterial(
Cesium.Material.PolylineFlowMultMaterialType,
{
fabric: {
type: Cesium.Material.PolylineFlowMultMaterialType,
uniforms: {
color: new Cesium.Color(1.0, 1.0, 1.0, 1.0),
speed: 0.1,
rotate: true,
frameTime: Cesium.getTimestamp(),
lineBackAlpha: 0.05,
},
source: Cesium.Material.PolylineFlowMaterialSource,
},
translucent: function (material) {
return true;
},
}
);
}
export { PolylineFlowMult }

View File

@ -2,6 +2,11 @@ import { StreamWall1, StreamWall2 } from './WallMaterialProperty'
import { RadarScan } from './RadarScanMaterialProperty' import { RadarScan } from './RadarScanMaterialProperty'
import { CustomColorMaterialSource } from './CustomColorMaterialSource' import { CustomColorMaterialSource } from './CustomColorMaterialSource'
import { CustomImageMaterialSource } from './CustomImageMaterialSource' import { CustomImageMaterialSource } from './CustomImageMaterialSource'
import { FlowLine } from './FlowLineMaterialProperty'
import { PolylineFlow } from './PolylineFlowMaterialProperty'
import { PolylineFlowMult } from './PolylineFlowMultMaterialProperty'
import { FlowDashedLine } from './FlowDashedLineFlowMaterialProperty'
import { LineTexture } from './LineTextureMaterialProperty'
function init_material() { function init_material() {
StreamWall1() StreamWall1()
@ -9,6 +14,11 @@ function init_material() {
RadarScan() RadarScan()
CustomColorMaterialSource() CustomColorMaterialSource()
CustomImageMaterialSource() CustomImageMaterialSource()
FlowLine()
PolylineFlow()
PolylineFlowMult()
FlowDashedLine()
LineTexture()
} }
export { init_material } export { init_material }

View File

@ -10,6 +10,7 @@ import { Proj } from './proj'
import { open as projConvertOpen, close as projConvertClose } from './projConvert' import { open as projConvertOpen, close as projConvertClose } from './projConvert'
import { open as projectionConvertOpen, close as projectionConvertClose } from './projectionConvert' import { open as projectionConvertOpen, close as projectionConvertClose } from './projectionConvert'
import { setActiveViewer, closeRotateAround, closeViewFollow } from '../Global/global' import { setActiveViewer, closeRotateAround, closeViewFollow } from '../Global/global'
import FlowPictureMaterialProperty from '../Obj/Materail/FlowPictureMaterialProperty'
class Tools { class Tools {
/** /**
@ -123,6 +124,7 @@ class Tools {
var lat = Cesium.Math.toDegrees(cartographic.latitude) var lat = Cesium.Math.toDegrees(cartographic.latitude)
var lng = Cesium.Math.toDegrees(cartographic.longitude) var lng = Cesium.Math.toDegrees(cartographic.longitude)
var alt = cartographic.height < 0 ? 0 : cartographic.height var alt = cartographic.height < 0 ? 0 : cartographic.height
// var alt = cartographic.height
return { return {
lng: lng, lng: lng,
lat: lat, lat: lat,
@ -138,30 +140,97 @@ class Tools {
* @param [fractionDigits=2] 保留小数点位数 * @param [fractionDigits=2] 保留小数点位数
* @param [ground=true] 是否贴地 * @param [ground=true] 是否贴地
* */ * */
computeDistance(positions = [], fractionDigits = 2, ground = true) { // computeDistance(positions = [], fractionDigits = 2, ground = true) {
// if (positions.length < 2) {
// return 0
// } else {
// let length = 0
// if (ground) {
// let lineString = []
// positions.forEach((item) => {
// lineString.push([item.lng, item.lat, item.alt])
// })
// let line = turf.lineString(lineString)
// length = turf.length(line) * 1000
// }
// else {
// for (let i = 0; i < positions.length - 1; i++) {
// const position1 = Cesium.Cartesian3.fromDegrees(positions[i].lng, positions[i].lat, positions[i].alt);
// const position2 = Cesium.Cartesian3.fromDegrees(positions[i + 1].lng, positions[i + 1].lat, positions[i + 1].alt);
// const distance = Cesium.Cartesian3.distance(position1, position2);
// length = length + distance
// }
// }
// return length.toFixed(fractionDigits)
// }
// }
async computeDistance(positions = [], fractionDigits = 2, type = '空间长度') {
if (positions.length < 2) { if (positions.length < 2) {
return 0 return 0
} else { } else {
let length = 0 let length = 0
if (ground) { switch (type) {
let lineString = [] case '空间长度':
positions.forEach((item) => {
lineString.push([item.lng, item.lat, item.alt])
})
let line = turf.lineString(lineString)
length = turf.length(line) * 1000
}
else {
for (let i = 0; i < positions.length - 1; i++) { for (let i = 0; i < positions.length - 1; i++) {
const position1 = Cesium.Cartesian3.fromDegrees(positions[i].lng, positions[i].lat, positions[i].alt); const position1 = Cesium.Cartesian3.fromDegrees(positions[i].lng, positions[i].lat, positions[i].alt);
const position2 = Cesium.Cartesian3.fromDegrees(positions[i + 1].lng, positions[i + 1].lat, positions[i + 1].alt); const position2 = Cesium.Cartesian3.fromDegrees(positions[i + 1].lng, positions[i + 1].lat, positions[i + 1].alt);
const distance = Cesium.Cartesian3.distance(position1, position2); const distance = Cesium.Cartesian3.distance(position1, position2);
length = length + distance length = length + distance
} }
break
case '投影长度':
for (let i = 0; i < positions.length - 1; i++) {
const position1 = Cesium.Cartesian3.fromDegrees(positions[i].lng, positions[i].lat, 0);
const position2 = Cesium.Cartesian3.fromDegrees(positions[i + 1].lng, positions[i + 1].lat, 0);
const distance = Cesium.Cartesian3.distance(position1, position2);
length = length + distance
}
break
case '地表长度':
let meters
let lineString2 = []
positions.forEach((item) => {
lineString2.push([item.lng, item.lat, item.alt])
})
let line2 = turf.lineString(lineString2)
let d = turf.length(line2) * 1000
meters = d > 20 ? d / 20 : d
let res = this.chunkLine(positions, meters)
let coordinates = []
res.forEach((Feature, index) => {
if (index === 0) {
coordinates = [...Feature.geometry.coordinates]
} else {
coordinates.push(Feature.geometry.coordinates[1])
}
})
let arr = []
for (const item of coordinates) {
const index = coordinates.indexOf(item);
let r = await this.sampleHeight({ lng: item[0], lat: item[1], alt: 0 }, index)
r.position.alt = r.position.alt < 0 ? 0 : r.position.alt
arr.push(r)
}
let l = arr.length - 1
for (let i = 0; i < arr.length - 1; i++) {
const position1 = Cesium.Cartesian3.fromDegrees(arr[i].position.lng, arr[i].position.lat, 0);
const position2 = Cesium.Cartesian3.fromDegrees(arr[i + 1].position.lng, arr[i + 1].position.lat, 0);
const distance = Cesium.Cartesian3.distance(position1, position2);
length = length + distance
}
break
default:
break;
} }
return length.toFixed(fractionDigits) return length.toFixed(fractionDigits)
} }
} }
async sampleHeight(p1, index) {
let p2 = await this.sampleHeightMostDetailed([p1])
p1.alt = p2[0].height
return { position: p1, index }
}
/**@description 计算多边形面积 /**@description 计算多边形面积
* @method computeArea * @method computeArea
@ -513,8 +582,9 @@ class Tools {
return res return res
} }
getMaterial(color = '#2ab0c2', type = 0) { getMaterial(color = '#2ab0c2', type = 0, entity = null, newParam = {}) {
let material = '' let material = ''
switch (Number(type)) { switch (Number(type)) {
case 1: //虚线 case 1: //虚线
@ -528,6 +598,65 @@ class Tools {
glowPower: 0.2, glowPower: 0.2,
color: Cesium.Color.fromCssColorString(color), color: Cesium.Color.fromCssColorString(color),
}) })
break
case 3: //尾迹光线
material = new Cesium.PolylineFlowMaterialProperty({
color: color,
speed: newParam.rotate ? newParam.speed : 0 - newParam.speed,
rotate: newParam.rotate
})
break
case 4: //多尾迹光线
material = new Cesium.PolylineFlowMultMaterialProperty({
color: color,
speed: newParam.rotate ? newParam.speed : 0 - newParam.speed,
rotate: newParam.rotate
})
break
case 5: //普通流动虚线
material = new Cesium.FlowDashedLineFlowMaterialProperty({
color: color,
uType: 0,
speed: newParam.rotate ? newParam.speed : 0 - newParam.speed,
// dashSize: newParam.dashSize,
space: newParam.space
})
break
case 6: //流动虚线2
material = new Cesium.FlowDashedLineFlowMaterialProperty({
color: color,
uType: 1,
speed: newParam.rotate ? newParam.speed : 0 - newParam.speed,
// dashSize: newParam.dashSize,
space: newParam.space
})
break
case 7: //流动箭头1
case 8: //流动箭头2
case 9: //流动箭头3
case 10: //流动箭头4
case 11: //流动箭头5
case 12: //流动箭头6
let param = {
color: color,
image: this.getSourceRootPath() + `/img/arrow/${type - 6}.png`,
space: newParam.space,
speed: newParam.speed
}
let arr = {
'7': 10,
'8': 3,
'9': 4,
'10': 4,
'11': 4,
'12': 2
}
param.speed = newParam.rotate ? param.speed : 0 - param.speed
console.log(entity.polyline.oriWidth, arr[type + ''], type, 'oriWidth')
entity.polyline.width = entity.polyline.oriWidth + arr[type + '']
this.getFlowTexture(this, param, entity)
break break
default: default:
material = Cesium.Color.fromCssColorString(color) material = Cesium.Color.fromCssColorString(color)
@ -535,6 +664,90 @@ class Tools {
} }
return material return material
} }
getFlowTexture(that, options, entity) {
const canvasEle = document.createElement('canvas');
const ctx = canvasEle.getContext('2d')
const myImg = new Image()
// myImg.src = that.getSourceRootPath() + '/img/arrow/1.png'
myImg.src = options.image
myImg.onload = function () {
options.space = Math.max(0.1, options.space);
if (options.speed > 0 || options.speed == 0) {
canvasEle.width = myImg.width * (options.space + 1)
canvasEle.height = myImg.height
ctx.drawImage(myImg, myImg.width * (options.space / 2), 0)
} else {
ctx.clearRect(0, 0, canvasEle.width, canvasEle.height);
canvasEle.width = myImg.width * (options.space + 1)
canvasEle.height = myImg.height
ctx.save(); // 保存当前状态
ctx.translate(canvasEle.width / 2, canvasEle.height / 2); // 移动原点至中心
ctx.rotate(Math.PI); // (弧度制)
ctx.translate(-canvasEle.width / 2, -canvasEle.height / 2); // 移回原点
ctx.drawImage(myImg, myImg.width * (options.space / 2), 0)
ctx.restore(); // 恢复状态
}
// let repeat = getRepeat()
// }, false)
entity.polyline.material.oriRepeat = undefined
entity.polyline.material.oriSpeed = undefined
entity.polyline.material = new Cesium.LineTextureMaterialProperty(
{
color: options.color,
// image: options.image,
image: canvasEle,
speed: options.speed,
// repeat: repeat
repeat: new Cesium.CallbackProperty(function () {
// function getRepeat() {
var positionProperty = entity.polyline.positions;
var positions = positionProperty.getValue(that.sdk.viewer.clock.currentTime);
if (!Cesium.defined(positions)) {
return new Cesium.Cartesian2(1.0, 1.0);
// return 1.0;
}
var distance = 0;
for (var i = 0; i < positions.length - 1; ++i) {
distance += Cesium.Cartesian3.distance(positions[i], positions[i + 1]);
}
var repeatX = distance / entity.polyline.width.getValue();
// 根据地图缩放程度调整repeatX
var cameraHeight = that.sdk.viewer.camera.positionCartographic.height;
var boundingSphere = new Cesium.BoundingSphere(
new Cesium.Cartesian3(-1000000, 0, 0), // 中心点坐标
500000 // 半径(距离)
);
// 获取绘图缓冲区的宽度和高度(通常是屏幕的分辨率)
var drawingBufferWidth = that.sdk.viewer.canvas.clientWidth;
var drawingBufferHeight = that.sdk.viewer.canvas.clientHeight;
// 使用 getPixelSize 方法获取包围球在屏幕上的像素大小
var groundResolution = that.sdk.viewer.scene.camera.getPixelSize(boundingSphere, drawingBufferWidth, drawingBufferHeight)
// repeatX *= groundResolution / cameraHeight / ((myImg.width / myImg.height * 5) + 1);
repeatX *= groundResolution / cameraHeight / (options.space * (canvasEle.width / canvasEle.height * 5) + 1);
let speed
if (entity.polyline.material.oriRepeat) {
speed = repeatX / entity.polyline.material.oriRepeat
} else {
entity.polyline.material.oriRepeat = repeatX
}
// if (repeatX < 3) {
// repeatX = 3
// }
return new Cesium.Cartesian2(repeatX, speed || 1.0);
// return repeatX;
})
}
)
entity.polyline.material.oriSpeed = options.speed
}
}
/*创建直箭头图片*/ /*创建直箭头图片*/
create_arrow1_picture(color) { create_arrow1_picture(color) {
@ -1067,6 +1280,55 @@ class Tools {
return `${year}${month}${day}${hours}${minutes}${seconds}${milliseconds}`; return `${year}${month}${day}${hours}${minutes}${seconds}${milliseconds}`;
} }
replaceHost(url, host) {
let newUrl = url
if (!url || !host) {
return url
}
try {
if (!url.startsWith("http")) {
//说明是本地的json在磁盘中存在的
if (!url.includes(":")) {
if (this.options.host) {
let o = new URL(url, this.options.host)
newUrl = o.href
}
}
return newUrl
}
else {
// 移除可能的用户名:密码前缀
const authRegex = /^[^@]+@/;
if (authRegex.test(url)) {
url = url.replace(authRegex, '');
}
// 添加协议前缀(如果没有)
if (!/^[a-z]+:\/\//i.test(url)) {
url = 'http://' + url;
}
const parsedUrl = new URL(url);
const parsedUrl2 = new URL(host);
let hostname = parsedUrl.hostname;
let port = parsedUrl.port;
// 处理IPv6地址如果有括号
if (hostname.startsWith('[') && hostname.endsWith(']')) {
hostname = hostname.slice(1, -1);
}
if ((hostname === 'localhost' || hostname === '127.0.0.1') && parseInt(port, 10) !== 55110) {
parsedUrl.port = parsedUrl2.port
parsedUrl.protocol = parsedUrl2.protocol
newUrl = parsedUrl.toString()
}
return newUrl
}
} catch (error) {
return newUrl
}
}
} }

View File

@ -270,7 +270,7 @@ class YJEarth {
this.viewer.scene.screenSpaceCameraController.enableCollisionDetection = true //true 禁止 false 允许 this.viewer.scene.screenSpaceCameraController.enableCollisionDetection = true //true 禁止 false 允许
createCluster(this.viewer) createCluster(this.viewer)
keyboardMapRoamingInit(this.viewer) keyboardMapRoamingInit(this.viewer)
Cesium.viewerCesiumNavigationMixin(this.viewer, { let a = Cesium.viewerCesiumNavigationMixin(this.viewer, {
// 修改重置视图的tooltip // 修改重置视图的tooltip
resetTooltip: '重置视图', resetTooltip: '重置视图',
// 修改放大按钮的tooltip // 修改放大按钮的tooltip

View File

@ -1515,6 +1515,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
height: 32px; height: 32px;
line-height: 32px;
} }
.YJ-custom-base-dialog>.content .cy_datalist dl dd:hover { .YJ-custom-base-dialog>.content .cy_datalist dl dd:hover {
@ -1784,6 +1785,89 @@
.YJ-custom-base-dialog.water-surface>.content>div .row .label { .YJ-custom-base-dialog.water-surface>.content>div .row .label {
flex: 0 0 60px; flex: 0 0 60px;
} }
/* 流光飞线 */
.YJ-custom-base-dialog.flow-line-surface>.content {
width: 586px;
}
.YJ-custom-base-dialog.flow-line-surface>.content>div .row .label {
flex: 0 0 60px;
}
/* 光照 */
.YJ-custom-base-dialog.sun-shine-surface>.content {
width: 586px;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .row .label {
flex: 0 0 60px;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .timeline-container {
width: 100%;
padding: 20px 0;
position: relative;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .timeline {
height: 8px;
background: #f0f0f0;
border-radius: 15px;
position: relative;
cursor: pointer;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .progress {
height: 100%;
width: 0;
background: rgba(var(--color-sdk-base-rgb), 1);
border-radius: 15px;
position: relative;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .handle {
width: 16px;
height: 16px;
background: white;
/* border: 3px solid #4285f4; */
background: rgba(var(--color-sdk-base-rgb), 1);
border-radius: 50%;
position: absolute;
right: -8px;
top: 50%;
transform: translateY(-50%);
cursor: grab;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .time-marks {
display: flex;
justify-content: space-between;
margin-top: 5px;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .time-mark {
font-size: 12px;
color: #fff;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .controls {
margin: 15px 0;
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div .current-time {
font-size: 12px;
position: absolute;
width: 50px;
text-align: center;
right: -25px;
top: -200%;
transform: translateY(-50%);
}
.YJ-custom-base-dialog.sun-shine-surface>.content>div #timePause {
margin-top: 10px;
}
/* 电子围墙 */ /* 电子围墙 */
.YJ-custom-base-dialog.wall-stereoscopic>.content { .YJ-custom-base-dialog.wall-stereoscopic>.content {
@ -2515,7 +2599,9 @@
.YJ-custom-base-dialog.polyline>.content { .YJ-custom-base-dialog.polyline>.content {
width: 580px; width: 580px;
} }
.YJ-custom-base-dialog.polyline>.content>div #dashTextureDom {
display: none;
}
.YJ-custom-base-dialog.polyline>.content>div .row .col { .YJ-custom-base-dialog.polyline>.content>div .row .col {
margin: 0 10px; margin: 0 10px;
} }
@ -2564,6 +2650,117 @@
max-height: 185px; max-height: 185px;
} }
.YJ-custom-base-dialog.polyline>.content>div .input-select-unit-box textarea {
border-radius: unset!important;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-unit .datalist {
background-color:rgba(var(--color-sdk-base-rgb), 0.1)!important;
border-radius: 4px 0px 0px 4px !important;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(1) .datalist {
background-color:rgba(var(--color-sdk-base-rgb), 0.1)!important;
border-radius: 4px 0px, 0px, 4px!important;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(2) .datalist {
background-color:rgba(var(--color-sdk-base-rgb), 0.1)!important;
border-radius: 0px 4px 4px 0px!important;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(1) input {
border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5)!important;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(2) input {
border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5)!important;
}
.YJ-custom-base-dialog.polyline>.content input.input-text{
background-color: rgba(0, 0, 0, 0.5)!important;
border-radius: unset!important;
border-top: 1px solid rgba(var(--color-sdk-base-rgb), 0.5)!important;
border-bottom: 1px solid rgba(var(--color-sdk-base-rgb), 0.5) !important;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist input {
padding-left: 35px;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .icon-active {
position: absolute;
top: 11px;
left: 10px;
-webkit-pointer-events: none;
-moz-pointer-events: none;
-ms-pointer-events: none;
-o-pointer-events: none;
pointer-events: none;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.icon {
display: inline-block;
width: 22px;
height: 10px;
margin-right: 5px;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.line {
border: 1px solid rgba(255, 255, 255, 1);
height: 0px;
margin-top: 4px;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.dash-line {
border: 1px dashed rgba(255, 255, 255, 1);
height: 0px;
margin-top: 4px;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.light-line {
border: 1px solid rgba(255, 255, 255, 1);
height: 0px;
margin-top: 4px;
box-shadow: 0 0 3px #fff
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.tail-line {
background: url(../../img/arrow/tail.png) 100% 100% no-repeat;
background-size: 100% 100%;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.mult-tail-line {
background: url(../../img/arrow/tail.png) 100% 100% no-repeat;
background-size: 100% 100%;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.flow-dash-line1 {
border: 1px dashed rgba(255, 255, 255, 1);
height: 0px;
margin-top: 4px;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.flow-dash-line2 {
border: 1px dashed rgba(255, 255, 255, 1);
height: 0px;
margin-top: 4px;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line1 {
background: url(../../img/arrow/1.png) 100% 100% no-repeat;
background-size: 100% 100%;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line2 {
background: url(../../img/arrow/2.png) 100% 100% no-repeat;
background-size: 100% 100%;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line3 {
background: url(../../img/arrow/3.png) 100% 100% no-repeat;
background-size: 100% 100%;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line4 {
background: url(../../img/arrow/4.png) 100% 100% no-repeat;
background-size: 100% 100%;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line5 {
background: url(../../img/arrow/5.png) 100% 100% no-repeat;
background-size: 100% 100%;
}
.YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line6 {
background: url(../../img/arrow/6.png) 100% 100% no-repeat;
background-size: 100% 100%;
}
/* 贴地图片 */ /* 贴地图片 */
.YJ-custom-base-dialog.ground-image>.content { .YJ-custom-base-dialog.ground-image>.content {
width: 500px; width: 500px;
@ -2982,9 +3179,9 @@
/* 等高线 */ /* 等高线 */
.YJ-custom-base-dialog.contour>.content { .YJ-custom-base-dialog.contour>.content {
width: 350px; width: 525px;
} }
.YJ-custom-base-dialog.contour>.content .label { .YJ-custom-base-dialog.contour>.content .label {
flex: 0 0 56px; flex: unset;
} }

View File

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
<path d="M11.0843 0.555313L11.0843 0.555313C10.6784 0.149383 10.0203 0.149383 9.61434 0.555313L5.81934 4.35031L2.02434 0.555313C1.61841 0.149383 0.960265 0.149383 0.554336 0.555313L0.554336 0.555313C0.148407 0.961242 0.148407 1.61938 0.554336 2.02531L4.34934 5.82031L0.554336 9.61531C0.148407 10.0212 0.148407 10.6794 0.554336 11.0853L0.554336 11.0853C0.960265 11.4912 1.61841 11.4912 2.02434 11.0853L5.81934 7.29031L9.61434 11.0853C10.0203 11.4912 10.6784 11.4912 11.0843 11.0853L11.0843 11.0853C11.4903 10.6794 11.4903 10.0212 11.0843 9.61531L7.28934 5.82031L11.0843 2.02531C11.4903 1.61938 11.4903 0.961242 11.0843 0.555313Z">
</path>
<path fill="rgba(0, 0, 0, 0.5)" d="M10.9076 0.732089M10.9076 0.732089Q10.6763 0.500866 10.3493 0.500866Q10.0223 0.500866 9.79111 0.732089L5.81934 4.70387L1.84756 0.732089C1.53926 0.423791 1.03941 0.423791 0.731113 0.732089C0.422814 1.04039 0.422814 1.54024 0.731113 1.84854L4.70289 5.82031L0.731113 9.79209Q0.499889 10.0233 0.499889 10.3503Q0.499889 10.6773 0.731113 10.9085Q0.962336 11.1398 1.28934 11.1398Q1.61634 11.1398 1.84756 10.9085L5.81934 6.93676L9.79111 10.9085Q10.0223 11.1398 10.3493 11.1398Q10.6763 11.1398 10.9076 10.9085Q11.1388 10.6773 11.1388 10.3503Q11.1388 10.0233 10.9076 9.79209L6.93578 5.82031L10.9076 1.84854Q11.1388 1.61731 11.1388 1.29031Q11.1388 0.963312 10.9076 0.732089ZM11.2611 0.378536Q11.6388 0.756205 11.6388 1.29031Q11.6388 1.82442 11.2611 2.20209L7.46611 5.99709L7.28934 5.82031L7.46611 5.64354L11.2611 9.43854Q11.6388 9.8162 11.6388 10.3503Q11.6388 10.8844 11.2611 11.2621Q10.8834 11.6398 10.3493 11.6398Q9.81523 11.6398 9.43756 11.2621L5.64256 7.46709L5.81934 7.29031L5.99611 7.46709L2.20111 11.2621Q1.82344 11.6398 1.28934 11.6398Q0.755229 11.6398 0.377559 11.2621Q-0.000110999 10.8844 -0.000111014 10.3503Q-0.000110984 9.81621 0.377559 9.43854L4.17256 5.64354L4.34934 5.82031L4.17256 5.99709L0.377559 2.20209C-0.126001 1.69853 -0.126001 0.882096 0.377559 0.378536C0.88112 -0.125024 1.69755 -0.125025 2.20111 0.378536L5.99611 4.17354L5.81934 4.35031L5.64256 4.17354L9.43756 0.378536Q9.81523 0.000865549 10.3493 0.000865549Q10.8834 0.000865579 11.2611 0.378536L11.2611 0.378536Z">
</path>
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 16 16" >
<path d="M15.5219 2.5188L13.4796 0.476487C13.1732 0.170059 12.7657 0 12.3309 0C11.8977 0 11.4886 0.168455 11.1822 0.476487L1.60273 10.0864L1.57866 10.1105L0 16L5.92801 14.4117L15.5219 4.81781C15.8299 4.50978 16 4.10228 16 3.66911C15.9984 3.23433 15.8299 2.82683 15.5219 2.5188ZM2.79154 14.2818L1.71824 13.2085L2.24125 11.2576L4.74401 13.7604L2.79154 14.2818ZM5.66169 13.3529L2.65998 10.3511L9.72546 3.2584L12.7416 6.27294L5.66169 13.3529ZM14.8593 4.15361L13.9208 5.09215L10.9046 2.07761L11.8448 1.13747C11.9667 1.01394 12.1448 0.943347 12.3293 0.943347C12.5154 0.943347 12.6935 1.01394 12.8154 1.13747L14.8577 3.18139C14.9877 3.31134 15.0599 3.48461 15.0599 3.6675C15.0615 3.8504 14.9909 4.02366 14.8593 4.15361Z" >
</path>
</svg>

After

Width:  |  Height:  |  Size: 837 B

BIN
static/img/arrow/1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
static/img/arrow/11.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

BIN
static/img/arrow/2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
static/img/arrow/222.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
static/img/arrow/3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

BIN
static/img/arrow/33.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

BIN
static/img/arrow/4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
static/img/arrow/44.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
static/img/arrow/5.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
static/img/arrow/55.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.9 KiB

BIN
static/img/arrow/6.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

BIN
static/img/arrow/tail.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 511 B