Visitar URL original
feat: add picker size · ThatOpen/engine_components@f294f04 · GitHub
Skip to content

Commit f294f04

Browse files
committed
feat: add picker size
1 parent 6edfa7c commit f294f04

5 files changed

Lines changed: 61 additions & 5 deletions

File tree

‎packages/front/src/measurement/AngleMeasurement/example.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -259,6 +259,13 @@ const panel = BUI.Component.create<BUI.PanelSection>(() => {
259259
}}">
260260
</bim-checkbox>
261261
262+
<bim-number-input
263+
slider step="1" label="Picker Size" value="${measurer.pickerSize}" min="2" max="20"
264+
@change="${({ target }: { target: BUI.NumberInput }) => {
265+
measurer.pickerSize = target.value;
266+
}}">
267+
</bim-number-input>
268+
262269
<bim-color-input
263270
label="Color" color=#${measurer.linesMaterial.color.getHexString()}
264271
@input="${({ target }: { target: BUI.ColorInput }) => {

‎packages/front/src/measurement/AreaMeasurement/example.ts‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -272,8 +272,15 @@ const panel = BUI.Component.create<BUI.PanelSection>(() => {
272272
@change="${({ target }: { target: BUI.Checkbox }) => {
273273
makeSynchronous(target.value);
274274
}}">
275-
</bim-checkbox>
276-
275+
</bim-checkbox>
276+
277+
<bim-number-input
278+
slider step="1" label="Picker Size" value="${measurer.pickerSize}" min="2" max="20"
279+
@change="${({ target }: { target: BUI.NumberInput }) => {
280+
measurer.pickerSize = target.value;
281+
}}">
282+
</bim-number-input>
283+
277284
<bim-color-input
278285
label="Color" color=#${measurer.linesMaterial.color.getHexString()}
279286
@input="${({ target }: { target: BUI.ColorInput }) => {

‎packages/front/src/measurement/LengthMeasurement/example.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -305,9 +305,16 @@ const panel = BUI.Component.create<BUI.PanelSection>(() => {
305305
@change="${({ target }: { target: BUI.Checkbox }) => {
306306
makeSynchronous(target.value);
307307
}}">
308-
</bim-checkbox>
309-
310-
<bim-color-input
308+
</bim-checkbox>
309+
310+
<bim-number-input
311+
slider step="1" label="Picker Size" value="${measurer.pickerSize}" min="2" max="20"
312+
@change="${({ target }: { target: BUI.NumberInput }) => {
313+
measurer.pickerSize = target.value;
314+
}}">
315+
</bim-number-input>
316+
317+
<bim-color-input
311318
label="Color" color=#${measurer.linesMaterial.color.getHexString()}
312319
@input="${({ target }: { target: BUI.ColorInput }) => {
313320
measurer.color = new THREE.Color(target.color);

‎packages/front/src/measurement/Measurement/index.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -327,6 +327,14 @@ export abstract class Measurement<
327327
this._vertexPicker.maxDistance = value;
328328
}
329329

330+
get pickerSize() {
331+
return this._vertexPicker.pickerSize;
332+
}
333+
334+
set pickerSize(value: number) {
335+
this._vertexPicker.pickerSize = value;
336+
}
337+
330338
protected _vertexPicker = new GraphicVertexPicker(this.components);
331339

332340
constructor(components: OBC.Components, measureType: U) {

‎packages/front/src/utils/graphic-vertex-picker.ts‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,23 @@ export class GraphicVertexPicker implements OBC.Disposable {
2424

2525
maxDistance = 1;
2626

27+
private _pickerSize = 6;
28+
29+
get pickerSize() {
30+
return this._pickerSize;
31+
}
32+
33+
set pickerSize(value: number) {
34+
this._pickerSize = value;
35+
const size = `${value}px`;
36+
this._preview.style.width = size;
37+
this._preview.style.height = size;
38+
if (this.marker) {
39+
this.marker.three.element.style.width = size;
40+
this.marker.three.element.style.height = size;
41+
}
42+
}
43+
2744
private _enabled = false;
2845
set enabled(value: boolean) {
2946
this._enabled = value;
@@ -186,12 +203,14 @@ export class GraphicVertexPicker implements OBC.Disposable {
186203
// Apply marker position
187204
}
188205

206+
this.applyMarkerSize();
189207
this.marker.three.position.copy(point);
190208
} else {
191209
Object.assign(
192210
this.marker.three.element.style,
193211
GraphicVertexPicker.baseSnappingStyle,
194212
);
213+
this.applyMarkerSize();
195214
}
196215
} else if (this.marker) {
197216
this.marker.visible = false;
@@ -255,6 +274,7 @@ export class GraphicVertexPicker implements OBC.Disposable {
255274
GraphicVertexPicker.baseSnappingStyle,
256275
);
257276
}
277+
this.applyMarkerSize();
258278
} else if (this.marker) {
259279
this.marker.visible = false;
260280
}
@@ -298,6 +318,13 @@ export class GraphicVertexPicker implements OBC.Disposable {
298318
domElement.parentElement?.removeChild(this._preview);
299319
}
300320

321+
private applyMarkerSize() {
322+
if (!this.marker) return;
323+
const size = `${this._pickerSize}px`;
324+
this.marker.three.element.style.width = size;
325+
this.marker.three.element.style.height = size;
326+
}
327+
301328
private applySnapping(
302329
intersects: THREE.Intersection,
303330
snappingClass: FRAGS.SnappingClass,

0 commit comments

Comments
 (0)