diff --git a/src/Obj/Base/AttackArrowObject/index.js b/src/Obj/Base/AttackArrowObject/index.js index f1ca715..278e654 100644 --- a/src/Obj/Base/AttackArrowObject/index.js +++ b/src/Obj/Base/AttackArrowObject/index.js @@ -324,7 +324,7 @@ class AttackArrowObject extends Base { } set labelShow(v) { this.options.label.show = v - if (this.show &&!this.showView || this.showView == 3) { + if (this.show && !this.showView || this.showView == 3) { this.label.show = v } else { diff --git a/src/Obj/Base/LabelObject/index.js b/src/Obj/Base/LabelObject/index.js index 5b127cd..322dd8a 100644 --- a/src/Obj/Base/LabelObject/index.js +++ b/src/Obj/Base/LabelObject/index.js @@ -14,6 +14,8 @@ import { class LabelObject extends Base { #updateBillboardImageTimeout + #canvas = document.createElement('canvas') + #canvas2 = document.createElement('canvas') constructor(sdk, options = {}, model) { super(sdk, options) this.model = model @@ -438,11 +440,12 @@ class LabelObject extends Base { this.updateBillboardImage() } updateBillboardImage() { - clearTimeout(this.#updateBillboardImageTimeout) - this.#updateBillboardImageTimeout = setTimeout(() => { - clearTimeout(this.#updateBillboardImageTimeout) - this.entity && (this.entity.billboard.image = this.getcanvas()) - }, 500) + this.entity.billboard.image = this.getcanvas() + // clearTimeout(this.#updateBillboardImageTimeout) + // this.#updateBillboardImageTimeout = setTimeout(() => { + // clearTimeout(this.#updateBillboardImageTimeout) + // this.entity.billboard.image = this.getcanvas() + // }, 500) } get lineColor() { return this.options.pixelOffset @@ -489,9 +492,8 @@ class LabelObject extends Base { // } getcanvas() { - const canvas = document.createElement('canvas') - const ctx = canvas.getContext('2d') - + const ctx = this.#canvas.getContext('2d') + ctx.clearRect(0, 0, this.#canvas.width, this.#canvas.height); ctx.font = this.options.fontSize + 'px ' + this.font let texts = this.options.text.split('\n') let canvasWidth = 0 @@ -509,9 +511,8 @@ class LabelObject extends Base { if (canvasWidth < this.options.lineWidth) { canvasWidth = this.options.lineWidth } - canvas.width = canvasWidth - - canvas.height = this.options.pixelOffset + canvasHeight + this.#canvas.width = canvasWidth + this.#canvas.height = this.options.pixelOffset + canvasHeight const linearGradient = ctx.createLinearGradient( 0, 0, @@ -558,15 +559,14 @@ class LabelObject extends Base { ctx.stroke() ctx.closePath() - const canvas2 = document.createElement('canvas') - const ctx2 = canvas2.getContext('2d') - canvas2.width = canvas.width + 10 - canvas2.height = canvas.height + 10 - ctx2.drawImage(canvas, 5, 5); + const ctx2 = this.#canvas2.getContext('2d') + this.#canvas2.width = this.#canvas.width + 10 + this.#canvas2.height = this.#canvas.height + 10 + ctx2.drawImage(this.#canvas, 5, 5); // const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height); // ctx.putImageData(imageData, 40, 40); - return canvas2 + return this.#canvas2.toDataURL("image/png") } remove() { diff --git a/src/Obj/Base/WallRealStereoscopic/index2.js b/src/Obj/Base/WallRealStereoscopic/index2.js index bb12e89..9583344 100644 --- a/src/Obj/Base/WallRealStereoscopic/index2.js +++ b/src/Obj/Base/WallRealStereoscopic/index2.js @@ -157,7 +157,7 @@ class WallStereoscopic extends Base { } set labelShow(v) { this.options.label.show = v - if (this.show) { + if (this.show && !this.showView || this.showView == 3) { this.label.show = v } else { diff --git a/src/Obj/Base/WallRealStereoscopic2/index.js b/src/Obj/Base/WallRealStereoscopic2/index.js index bd5ee5d..225c6d5 100644 --- a/src/Obj/Base/WallRealStereoscopic2/index.js +++ b/src/Obj/Base/WallRealStereoscopic2/index.js @@ -243,7 +243,7 @@ class WallRealStereoscopic extends Base { } set labelShow(v) { this.options.label.show = v - if (this.show) { + if (this.show && !this.showView || this.showView == 3) { this.label.show = v } else { diff --git a/src/Obj/Element/cy_html_tabs.js b/src/Obj/Element/cy_html_tabs.js index 1270e29..464c37b 100644 --- a/src/Obj/Element/cy_html_tabs.js +++ b/src/Obj/Element/cy_html_tabs.js @@ -1,6 +1,13 @@ class cy_tabs { - constructor(id, clickTabCallBack, sdk) { - let elm = document.getElementById(id); + constructor(boxElm, clickTabCallBack, sdk) { + let elm + if(typeof boxElm === 'string') { + elm = document.getElementById(boxElm); + } + else { + elm = boxElm + } + // let elm = document.getElementById(id); let pane = elm.getElementsByTagName('DIV-cy-tab-pane') let tabTop = `
` @@ -37,7 +44,9 @@ tabContent = tabContent + `
` let BoxElm = document.createElement('div'); - BoxElm.setAttribute('id', id) + if(typeof boxElm === 'string') { + BoxElm.setAttribute('id', boxElm) + } BoxElm.setAttribute('class', 'DIV-cy-tabs') BoxElm.innerHTML = tabTop + tabContent elm.parentNode.insertBefore(BoxElm, elm); diff --git a/src/Obj/Materail/RoadTextureMaterialProperty.js b/src/Obj/Materail/RoadTextureMaterialProperty.js new file mode 100644 index 0000000..8f759b2 --- /dev/null +++ b/src/Obj/Materail/RoadTextureMaterialProperty.js @@ -0,0 +1,113 @@ +/* + * @Description: 流动线 + */ +function RoadTexture() { + class RoadTextureMaterialProperty { + constructor(options) { + this._definitionChanged = new Cesium.Event(); + this._image = undefined; + this._repeat = undefined; + this._stRotation = undefined; + this._repeatLength = undefined; + this.image = options.image || ""; + this.repeat = options.repeat || 1.0; + this.stRotation = options.stRotation || 0.0; + // this.rotations = options.rotations || new Array(100).fill(0.0); + } + + get isConstant() { + return false; + } + + get definitionChanged() { + return this._definitionChanged; + } + + getType(time) { + return Cesium.Material.RoadTextureMaterialType; + } + + getValue(time, result) { + if (!Cesium.defined(result)) { + result = {}; + } + result.image = Cesium.Property.getValueOrDefault( + this._image, + time, + "", + result.image + ); + result.repeat = Cesium.Property.getValueOrDefault( + this._repeat, + time, + 1.0, + result.repeat + ); + result.stRotation = Cesium.Property.getValueOrDefault( + this._stRotation, + time, + 0.0, + result.stRotation + ); + console.log(result, 'result') + return result; + } + + equals(other) { + return ( + this === other || + (other instanceof RoadTextureMaterialProperty && + Cesium.Property.equals(this._image, other._image) && + Cesium.Property.equals(this._repeat, other._repeat) && + // Cesium.Property.equals(this._rotations, other._rotations) && + Cesium.Property.equals(this._stRotation, other._stRotation) + ) + ); + } + } + + Object.defineProperties(RoadTextureMaterialProperty.prototype, { + image: Cesium.createPropertyDescriptor("image"), + repeat: Cesium.createPropertyDescriptor("repeat"), + repeatLength: Cesium.createPropertyDescriptor("stRotation"), + }); + + Cesium.RoadTextureMaterialProperty = RoadTextureMaterialProperty; + Cesium.Material.RoadTextureMaterialProperty = "RoadTextureMaterialProperty"; + Cesium.Material.RoadTextureMaterialType = "RoadTextureMaterialType"; + Cesium.Material.RoadTextureMaterialSource = ` + uniform sampler2D image; + uniform float repeat; + czm_material czm_getMaterial(czm_materialInput materialInput) + { + czm_material material = czm_getDefaultMaterial(materialInput); + vec2 st = materialInput.st; + st.s *= repeat; + mat2 rot = mat2(cos(stRotation), -sin(stRotation), sin(stRotation), cos(stRotation)); + vec2 newSt = rot * (st - 0.5) + 0.5; + + vec4 colorImage = texture2D(image, newSt); + material.diffuse = colorImage.rgb; + return material; + } + `; + Cesium.Material._materialCache.addMaterial( + Cesium.Material.RoadTextureMaterialType, + { + fabric: { + type: Cesium.Material.RoadTextureMaterialType, + uniforms: { + image: '', + repeat: 1.0, + stRotation: 0.0, + }, + source: Cesium.Material.RoadTextureMaterialSource, + }, + translucent: function (material) { + return true; + }, + } + ); +} + +export { RoadTexture } diff --git a/src/Obj/Materail/index.js b/src/Obj/Materail/index.js index e7fff6b..324d41c 100644 --- a/src/Obj/Materail/index.js +++ b/src/Obj/Materail/index.js @@ -7,6 +7,7 @@ import { PolylineFlow } from './PolylineFlowMaterialProperty' import { PolylineFlowMult } from './PolylineFlowMultMaterialProperty' import { FlowDashedLine } from './FlowDashedLineFlowMaterialProperty' import { LineTexture } from './LineTextureMaterialProperty' +import { RoadTexture } from './RoadTextureMaterialProperty' function init_material() { StreamWall1() @@ -19,6 +20,7 @@ function init_material() { PolylineFlowMult() FlowDashedLine() LineTexture() + RoadTexture() } export { init_material } diff --git a/src/YJEarth/index.js b/src/YJEarth/index.js index 6fc9060..775f153 100644 --- a/src/YJEarth/index.js +++ b/src/YJEarth/index.js @@ -62,9 +62,9 @@ class YJEarth { removeIncetance(id) { this.entityMap.delete(id) - unRegLeftClickCallback(this,id) - unRegRightClickCallback(this,id) - unregMoveCallback(this,id) + unRegLeftClickCallback(this, id) + unRegRightClickCallback(this, id) + unregMoveCallback(this, id) syncSplitData(this, id) } @@ -436,6 +436,7 @@ class YJEarth { textList[i].style['pointer-events'] = 'all' textList[i].querySelector('textarea').focus() _this.isLeftClick = true + _this.entityMap.get(_this.clickTextDom.id).isClick(movement.position, _this.clickTextDom.id) break; } } diff --git a/static/custom/css/index.css b/static/custom/css/index.css index ed413e2..0ea4bcf 100644 --- a/static/custom/css/index.css +++ b/static/custom/css/index.css @@ -1429,6 +1429,24 @@ margin-bottom: 10px; display: flex; position: relative; + overflow-y: auto; +} + +.DIV-cy-tabs .DIV-cy-tab-top::-webkit-scrollbar { + width: 4px; + height: 4px; +} + +.DIV-cy-tabs .DIV-cy-tab-top::-webkit-scrollbar-thumb { + border-radius: 5px; + -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); + background-color: rgba(var(--color-sdk-base-rgb)); +} + +.DIV-cy-tabs .DIV-cy-tab-top::-webkit-scrollbar-track { + -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); + border-radius: 5px; + background-color: rgba(var(--color-sdk-base-rgb), 0.1); } .DIV-cy-tabs .DIV-cy-tab-top::after { @@ -1473,7 +1491,14 @@ border-bottom: 2px solid #dddddd00; position: relative; z-index: 2; + white-space: nowrap; + user-select: none; cursor: pointer; + -webkit-pointer-events: auto; + -moz-pointer-events: auto; + -ms-pointer-events: auto; + -o-pointer-events: auto; + pointer-events: auto; } .DIV-cy-tabs .DIV-cy-tab-pane-title-p span { @@ -3097,9 +3122,9 @@ /* 文本框 */ .popup-textarea { /* width: 212px; */ - width: 161.6px; + width: 161px; /* height: 154px; */ - height: 119.2px; + height: 119px; display: block; pointer-events: none; position: absolute; @@ -3108,10 +3133,11 @@ background-size: 100% 100%; padding: 5px 5px 0px 5px; } - -.popup-textarea textarea { - background-color: unset !important; - border: unset !important; +.popup-textarea textarea{ + width: 158px; + height: 95px; + background-color: unset!important; + border: unset!important; color: #fff; } @@ -3588,12 +3614,21 @@ border: 1.5px solid; border-image: linear-gradient(to bottom, var(--color-sdk-gradual)) 1; color: #fff; + min-width: 200px; + min-height: 120px; + box-sizing: border-box; + /* -webkit-pointer-events: none; + -moz-pointer-events: none; + -ms-pointer-events: none; + -o-pointer-events: none; + pointer-events: none; */ } .billboard-attribute-box .DIV-cy-tabs { height: 100%; display: flex; flex-direction: column; + backdrop-filter: blur(2px); } .billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-top .DIV-cy-tab-pane-title { @@ -3616,9 +3651,120 @@ padding: 0 5px 5px 5px; box-sizing: border-box; flex: 1; + overflow: auto; +} + +.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content::-webkit-scrollbar { + width: 8px; + height: 8px; +} + +.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content::-webkit-scrollbar-thumb { + border-radius: 5px; + -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); + background-color: rgba(var(--color-sdk-base-rgb)); +} + +.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content::-webkit-scrollbar-track { + -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); + border-radius: 5px; + background-color: rgba(var(--color-sdk-base-rgb), 0.1); +} + +.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content-pane { + width: 100%; + height: 100%; +} + +.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content-pane iframe { + border: none; +} + +.billboard-attribute-box .billboard-attribute-box-line { + position: absolute; + width: 0px; + /* border-left: 1px solid rgba(var(--color-sdk-base-rgb), 0.5); */ + border-left: 1px solid rgba(var(--color-sdk-base-rgb), 1); + /* transform: rotate(45deg); */ + transform-origin: 0px 0px; + -webkit-pointer-events: none; + -moz-pointer-events: none; + -ms-pointer-events: none; + -o-pointer-events: none; + pointer-events: none; +} + +.billboard-attribute-box .drag-nook { + position: absolute; + width: 12px; + height: 12px; + display: block; + user-select: none; + -webkit-pointer-events: auto; + -moz-pointer-events: auto; + -ms-pointer-events: auto; + -o-pointer-events: auto; + pointer-events: auto; + z-index: 3; + clip-path: polygon(0% 100%, 100% 100%, 50% 50%); + background-image: linear-gradient(to top, #ffffff 1px, #00000000 1px); + background-size: 100% 3px; + /* background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAJRJREFUWEftltsJgFAMQ5NNdBJ1Eh3NTdRJdJPIBQXF50/p/WgHSNNDCSGch877EQbyIyCpBtAa/cZEsj9qXwhImgEURgZA8rTzzkAiYGVgITm+ErC6/Ek3vycMAkHAnYCkAUDKAosZSTaeSZiCqIwgCgJBIG8CWyXzKySSZBGBu+afStYBqIxMfJdSo8WPslHJgsAKWjkmIRBy/c8AAAAASUVORK5CYII='); */ +} + +.billboard-attribute-box .drag-nook.left-top { + top: -6px; + left: -6px; + cursor: se-resize; + transform: rotate(-45deg); + display: none; +} + +.billboard-attribute-box .drag-nook.right-top { + top: -6px; + right: -6px; + cursor: ne-resize; + transform: rotate(45deg); + display: none; +} + +.billboard-attribute-box .table { + background-color: #ffffff00; + color: #ffffff; + overflow: hidden; + border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5); +} + +.billboard-attribute-box .table .table-head .tr { + border-top: none; + border-left: none; + border-right: none; +} + +.billboard-attribute-box .table .tr { + display: flex; + border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5); + border-right: none; +} +.billboard-attribute-box .table .tr .th, .billboard-attribute-box .table .tr .td { + border-right: 1px solid rgba(var(--color-sdk-base-rgb), 0.5); + display: flex; + justify-content: center; +} +.billboard-attribute-box .table .tr .th:last-child, .billboard-attribute-box .table .tr .td:last-child { + border-right: none; +} + + +.billboard-attribute-box .table .table-body .tr { + border-bottom: none; + border-left: none; +} + +.billboard-attribute-box .table .table-body .tr:first-child { + border-top: none; } -/* 自定义提示 */ #YJ-custom-message { /* 固定在顶部中央 */ position: fixed; @@ -3669,4 +3815,4 @@ top: -200px /* 移回顶部外 */ } -} \ No newline at end of file +} diff --git a/static/img/roadPhoto.png b/static/img/roadPhoto.png new file mode 100644 index 0000000..8000eb9 Binary files /dev/null and b/static/img/roadPhoto.png differ diff --git a/static/img/roadTexture.png b/static/img/roadTexture.png new file mode 100644 index 0000000..407266c Binary files /dev/null and b/static/img/roadTexture.png differ diff --git a/static/img/sidePhoto.png b/static/img/sidePhoto.png new file mode 100644 index 0000000..d6218a4 Binary files /dev/null and b/static/img/sidePhoto.png differ