@soonspacejs/plugin-drawing-shape 2.5.0-alpha.1 → 2.5.0-rc.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.esm.js +1 -1
- package/dist/index.js +1 -1
- package/example/index.html +5 -5
- package/package.json +2 -2
- package/src/index.ts +24 -5
package/dist/index.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const s="drawingCanvas",i="drawingPoint",t="drawingLine",e="drawingPolygon",n="drawingCircle";class a{constructor(s){this.ssp=s,this.viewport=s.viewport}drawingPoint(t,e){return new Promise((n=>{this.clearDrawingCanvas3D();const a=new this.ssp.library.Canvas3D({id:s,points:[Object.assign(Object.assign({},t),{id:i})]});this.ssp.manager.store.canvas3DManager.scene.add(a);const o=a.getPoint(i),
|
|
1
|
+
const s="drawingCanvas",i="drawingPoint",t="drawingLine",e="drawingPolygon",n="drawingCircle";class a{constructor(s){this.ssp=s,this.viewport=s.viewport}drawingPoint(t,e){return new Promise((n=>{this.clearDrawingCanvas3D();const a=new this.ssp.library.Canvas3D({id:s,points:[Object.assign(Object.assign({},t),{id:i})]});this.ssp.manager.store.canvas3DManager.scene.add(a);const o=a.getPoint(i),l=s=>{if(!o)return;const i=this.ssp.viewport.getIntersects(s),t=i.length>0?i[0].point.clone():this.ssp.getPositionByOffset(s);o.setOptions({position:t})},c=s=>{if(p(),!o)return;const i=this.ssp.viewport.getIntersects(s),e=i.length>0?i[0].point.clone():this.ssp.getPositionByOffset(s);o.setOptions({position:e}),n(Object.assign(Object.assign({},t),{position:e.clone()}))},r=()=>{var s;this.clearDrawingCanvas3D(),p(),null===(s=null==e?void 0:e.onCancel)||void 0===s||s.call(e)},g=s=>{switch(s.code){case"Escape":r()}},p=()=>{this.ssp.signals.mouseMove.remove(l),this.ssp.signals.click.remove(c),this.ssp.signals.rightClick.remove(r),this.ssp.signals.keyUp.remove(g)};this.ssp.signals.mouseMove.add(l),this.ssp.signals.click.add(c),this.ssp.signals.rightClick.add(r),this.ssp.signals.keyUp.add(g)}))}drawingLine(i,e){return new Promise((n=>{this.clearDrawingCanvas3D();const a=new this.ssp.library.Canvas3D({id:s,lines:[Object.assign(Object.assign({},i),{points:[],id:t})]});this.ssp.manager.store.canvas3DManager.scene.add(a);const o=a.getLine(t),l=[],c=s=>{const t=this.ssp.viewport.getIntersects(s),e=t.length>0?t[0].point.clone():this.ssp.getPositionByOffset(s);o&&o.setOptions(Object.assign(Object.assign({},i),{points:[...l,e.clone().setY(e.y+1)]}))},r=s=>{const t=this.ssp.viewport.getIntersects(s),e=t.length>0?t[0].point.clone():this.ssp.getPositionByOffset(s);l.push(e.clone().setY(e.y+1)),o&&o.setOptions(Object.assign(Object.assign({},i),{points:l}))},g=()=>{var s;l.pop(),o&&(o.setOptions(Object.assign(Object.assign({},i),{points:l})),null===(s=null==e?void 0:e.onCancelPrev)||void 0===s||s.call(e))},p=()=>{d(),n(Object.assign(Object.assign({},i),{points:l}))},h=s=>{var i;switch(s.code){case"Backspace":g();break;case"Escape":this.clearDrawingCanvas3D(),d(),null===(i=null==e?void 0:e.onCancel)||void 0===i||i.call(e)}},d=()=>{this.ssp.signals.mouseMove.remove(c),this.ssp.signals.click.remove(r),this.ssp.signals.rightClick.remove(g),this.ssp.signals.dblClick.remove(p),this.ssp.signals.keyUp.remove(h)};this.ssp.signals.mouseMove.add(c),this.ssp.signals.click.add(r),this.ssp.signals.rightClick.add(g),this.ssp.signals.dblClick.add(p),this.ssp.signals.keyUp.add(h)}))}drawingPolygon(i,n){return new Promise((a=>{this.clearDrawingCanvas3D();const o=new this.ssp.library.Canvas3D({id:s,polygons:[Object.assign(Object.assign({},i),{points:[],yHeight:0,id:e})],lines:[Object.assign(Object.assign({},i),{points:[],id:t,width:2})]});this.ssp.manager.store.canvas3DManager.scene.add(o);const l=o.getPolygon(e),c=o.getLine(t),r=[],g=s=>{var i;const e=this.ssp.viewport.getIntersects(s),n=e.length>0?e[0].point.clone():this.ssp.getPositionByOffset(s);if(!l)return;const a=[...r,n];a.length>2?o.removeLine(t):null==c||c.setOptions({points:a}),l.setOptions({yHeight:((null===(i=r[0])||void 0===i?void 0:i.y)||n.y)+1,points:a})},p=s=>{var t;const e=this.ssp.viewport.getIntersects(s),n=e.length>0?e[0].point.clone():this.ssp.getPositionByOffset(s);r.push(n.clone().setY(n.y+1)),l&&l.setOptions(Object.assign(Object.assign({},i),{yHeight:((null===(t=r[0])||void 0===t?void 0:t.y)||0)+1,points:r}))},h=()=>{var s,t;r.pop(),l&&(l.setOptions(Object.assign(Object.assign({},i),{yHeight:((null===(s=r[0])||void 0===s?void 0:s.y)||0)+1,points:r})),null===(t=null==n?void 0:n.onCancelPrev)||void 0===t||t.call(n))},d=()=>{var s;O(),a(Object.assign(Object.assign({},i),{yHeight:((null===(s=r[0])||void 0===s?void 0:s.y)||0)+1,points:r}))},v=s=>{var i;switch(s.code){case"Backspace":h();break;case"Escape":this.clearDrawingCanvas3D(),O(),null===(i=null==n?void 0:n.onCancel)||void 0===i||i.call(n)}},O=()=>{this.ssp.signals.mouseMove.remove(g),this.ssp.signals.click.remove(p),this.ssp.signals.rightClick.remove(h),this.ssp.signals.dblClick.remove(d),this.ssp.signals.keyUp.remove(v)};this.ssp.signals.mouseMove.add(g),this.ssp.signals.click.add(p),this.ssp.signals.rightClick.add(h),this.ssp.signals.dblClick.add(d),this.ssp.signals.keyUp.add(v)}))}drawingCircle(i,t){return new Promise((e=>{this.clearDrawingCanvas3D();const a=new this.ssp.library.Canvas3D({id:s,circles:[Object.assign(Object.assign({},i),{id:n})]});this.ssp.manager.store.canvas3DManager.scene.add(a);const o=a.getCircle(n);let l,c=100;const r=s=>{if(!o||!l)return;const i=this.ssp.viewport.getIntersects(s),t=i.length>0?i[0].point.clone():this.ssp.getPositionByOffset(s);c=t.distanceTo(l),o.setOptions({position:l,radius:c})},g=s=>{if(!o)return;const t=this.ssp.viewport.getIntersects(s),n=t.length>0?t[0].point.clone():this.ssp.getPositionByOffset(s);l?(d(),c=n.distanceTo(this.ssp.utils.IVector3ToVector3(l)),o.setOptions({position:l,radius:c}),e(Object.assign(Object.assign({},i),{position:l,radius:c}))):l=n.clone().setY(n.y+1)},p=()=>{var s;this.clearDrawingCanvas3D(),d(),null===(s=null==t?void 0:t.onCancel)||void 0===s||s.call(t)},h=s=>{switch(s.code){case"Escape":p()}},d=()=>{this.ssp.signals.mouseMove.remove(r),this.ssp.signals.click.remove(g),this.ssp.signals.rightClick.remove(p),this.ssp.signals.keyUp.remove(h)};this.ssp.signals.mouseMove.add(r),this.ssp.signals.click.add(g),this.ssp.signals.rightClick.add(p),this.ssp.signals.keyUp.add(h)}))}clearDrawingCanvas3D(){this.ssp.removeObjectById(s)}}export{a as default};
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(s,i){"object"==typeof exports&&"undefined"!=typeof module?module.exports=i():"function"==typeof define&&define.amd?define(i):(s="undefined"!=typeof globalThis?globalThis:s||self).DrawingShapePlugin=i()}(this,(function(){"use strict";const s="drawingCanvas",i="drawingPoint",e="drawingLine",t="drawingPolygon",n="drawingCircle";return class{constructor(s){this.ssp=s,this.viewport=s.viewport}drawingPoint(e,t){return new Promise((n=>{this.clearDrawingCanvas3D();const a=new this.ssp.library.Canvas3D({id:s,points:[Object.assign(Object.assign({},e),{id:i})]});this.ssp.manager.store.canvas3DManager.scene.add(a);const o=a.getPoint(i),
|
|
1
|
+
!function(s,i){"object"==typeof exports&&"undefined"!=typeof module?module.exports=i():"function"==typeof define&&define.amd?define(i):(s="undefined"!=typeof globalThis?globalThis:s||self).DrawingShapePlugin=i()}(this,(function(){"use strict";const s="drawingCanvas",i="drawingPoint",e="drawingLine",t="drawingPolygon",n="drawingCircle";return class{constructor(s){this.ssp=s,this.viewport=s.viewport}drawingPoint(e,t){return new Promise((n=>{this.clearDrawingCanvas3D();const a=new this.ssp.library.Canvas3D({id:s,points:[Object.assign(Object.assign({},e),{id:i})]});this.ssp.manager.store.canvas3DManager.scene.add(a);const o=a.getPoint(i),l=s=>{if(!o)return;const i=this.ssp.viewport.getIntersects(s),e=i.length>0?i[0].point.clone():this.ssp.getPositionByOffset(s);o.setOptions({position:e})},c=s=>{if(p(),!o)return;const i=this.ssp.viewport.getIntersects(s),t=i.length>0?i[0].point.clone():this.ssp.getPositionByOffset(s);o.setOptions({position:t}),n(Object.assign(Object.assign({},e),{position:t.clone()}))},r=()=>{var s;this.clearDrawingCanvas3D(),p(),null===(s=null==t?void 0:t.onCancel)||void 0===s||s.call(t)},g=s=>{switch(s.code){case"Escape":r()}},p=()=>{this.ssp.signals.mouseMove.remove(l),this.ssp.signals.click.remove(c),this.ssp.signals.rightClick.remove(r),this.ssp.signals.keyUp.remove(g)};this.ssp.signals.mouseMove.add(l),this.ssp.signals.click.add(c),this.ssp.signals.rightClick.add(r),this.ssp.signals.keyUp.add(g)}))}drawingLine(i,t){return new Promise((n=>{this.clearDrawingCanvas3D();const a=new this.ssp.library.Canvas3D({id:s,lines:[Object.assign(Object.assign({},i),{points:[],id:e})]});this.ssp.manager.store.canvas3DManager.scene.add(a);const o=a.getLine(e),l=[],c=s=>{const e=this.ssp.viewport.getIntersects(s),t=e.length>0?e[0].point.clone():this.ssp.getPositionByOffset(s);o&&o.setOptions(Object.assign(Object.assign({},i),{points:[...l,t.clone().setY(t.y+1)]}))},r=s=>{const e=this.ssp.viewport.getIntersects(s),t=e.length>0?e[0].point.clone():this.ssp.getPositionByOffset(s);l.push(t.clone().setY(t.y+1)),o&&o.setOptions(Object.assign(Object.assign({},i),{points:l}))},g=()=>{var s;l.pop(),o&&(o.setOptions(Object.assign(Object.assign({},i),{points:l})),null===(s=null==t?void 0:t.onCancelPrev)||void 0===s||s.call(t))},p=()=>{h(),n(Object.assign(Object.assign({},i),{points:l}))},d=s=>{var i;switch(s.code){case"Backspace":g();break;case"Escape":this.clearDrawingCanvas3D(),h(),null===(i=null==t?void 0:t.onCancel)||void 0===i||i.call(t)}},h=()=>{this.ssp.signals.mouseMove.remove(c),this.ssp.signals.click.remove(r),this.ssp.signals.rightClick.remove(g),this.ssp.signals.dblClick.remove(p),this.ssp.signals.keyUp.remove(d)};this.ssp.signals.mouseMove.add(c),this.ssp.signals.click.add(r),this.ssp.signals.rightClick.add(g),this.ssp.signals.dblClick.add(p),this.ssp.signals.keyUp.add(d)}))}drawingPolygon(i,n){return new Promise((a=>{this.clearDrawingCanvas3D();const o=new this.ssp.library.Canvas3D({id:s,polygons:[Object.assign(Object.assign({},i),{points:[],yHeight:0,id:t})],lines:[Object.assign(Object.assign({},i),{points:[],id:e,width:2})]});this.ssp.manager.store.canvas3DManager.scene.add(o);const l=o.getPolygon(t),c=o.getLine(e),r=[],g=s=>{var i;const t=this.ssp.viewport.getIntersects(s),n=t.length>0?t[0].point.clone():this.ssp.getPositionByOffset(s);if(!l)return;const a=[...r,n];a.length>2?o.removeLine(e):null==c||c.setOptions({points:a}),l.setOptions({yHeight:((null===(i=r[0])||void 0===i?void 0:i.y)||n.y)+1,points:a})},p=s=>{var e;const t=this.ssp.viewport.getIntersects(s),n=t.length>0?t[0].point.clone():this.ssp.getPositionByOffset(s);r.push(n.clone().setY(n.y+1)),l&&l.setOptions(Object.assign(Object.assign({},i),{yHeight:((null===(e=r[0])||void 0===e?void 0:e.y)||0)+1,points:r}))},d=()=>{var s,e;r.pop(),l&&(l.setOptions(Object.assign(Object.assign({},i),{yHeight:((null===(s=r[0])||void 0===s?void 0:s.y)||0)+1,points:r})),null===(e=null==n?void 0:n.onCancelPrev)||void 0===e||e.call(n))},h=()=>{var s;u(),a(Object.assign(Object.assign({},i),{yHeight:((null===(s=r[0])||void 0===s?void 0:s.y)||0)+1,points:r}))},v=s=>{var i;switch(s.code){case"Backspace":d();break;case"Escape":this.clearDrawingCanvas3D(),u(),null===(i=null==n?void 0:n.onCancel)||void 0===i||i.call(n)}},u=()=>{this.ssp.signals.mouseMove.remove(g),this.ssp.signals.click.remove(p),this.ssp.signals.rightClick.remove(d),this.ssp.signals.dblClick.remove(h),this.ssp.signals.keyUp.remove(v)};this.ssp.signals.mouseMove.add(g),this.ssp.signals.click.add(p),this.ssp.signals.rightClick.add(d),this.ssp.signals.dblClick.add(h),this.ssp.signals.keyUp.add(v)}))}drawingCircle(i,e){return new Promise((t=>{this.clearDrawingCanvas3D();const a=new this.ssp.library.Canvas3D({id:s,circles:[Object.assign(Object.assign({},i),{id:n})]});this.ssp.manager.store.canvas3DManager.scene.add(a);const o=a.getCircle(n);let l,c=100;const r=s=>{if(!o||!l)return;const i=this.ssp.viewport.getIntersects(s),e=i.length>0?i[0].point.clone():this.ssp.getPositionByOffset(s);c=e.distanceTo(l),o.setOptions({position:l,radius:c})},g=s=>{if(!o)return;const e=this.ssp.viewport.getIntersects(s),n=e.length>0?e[0].point.clone():this.ssp.getPositionByOffset(s);l?(h(),c=n.distanceTo(this.ssp.utils.IVector3ToVector3(l)),o.setOptions({position:l,radius:c}),t(Object.assign(Object.assign({},i),{position:l,radius:c}))):l=n.clone().setY(n.y+1)},p=()=>{var s;this.clearDrawingCanvas3D(),h(),null===(s=null==e?void 0:e.onCancel)||void 0===s||s.call(e)},d=s=>{switch(s.code){case"Escape":p()}},h=()=>{this.ssp.signals.mouseMove.remove(r),this.ssp.signals.click.remove(g),this.ssp.signals.rightClick.remove(p),this.ssp.signals.keyUp.remove(d)};this.ssp.signals.mouseMove.add(r),this.ssp.signals.click.add(g),this.ssp.signals.rightClick.add(p),this.ssp.signals.keyUp.add(d)}))}clearDrawingCanvas3D(){this.ssp.removeObjectById(s)}}}));
|
package/example/index.html
CHANGED
|
@@ -55,8 +55,8 @@
|
|
|
55
55
|
绘制点: function () {
|
|
56
56
|
drawingShapePlugin.drawingPoint(
|
|
57
57
|
{
|
|
58
|
-
color: '
|
|
59
|
-
opacity:
|
|
58
|
+
color: 'blue',
|
|
59
|
+
opacity: 1
|
|
60
60
|
},
|
|
61
61
|
{
|
|
62
62
|
onCancel() {
|
|
@@ -69,8 +69,8 @@
|
|
|
69
69
|
绘制线: function () {
|
|
70
70
|
drawingShapePlugin.drawingLine(
|
|
71
71
|
{
|
|
72
|
-
color: '
|
|
73
|
-
opacity: 0.
|
|
72
|
+
color: 'green',
|
|
73
|
+
opacity: 0.8
|
|
74
74
|
},
|
|
75
75
|
{
|
|
76
76
|
onCancel() {
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
{
|
|
89
89
|
yHeight: 200,
|
|
90
90
|
color: 'blue',
|
|
91
|
-
opacity: 0.
|
|
91
|
+
opacity: 0.5
|
|
92
92
|
},
|
|
93
93
|
{
|
|
94
94
|
onCancel() {
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@soonspacejs/plugin-drawing-shape",
|
|
3
3
|
"pluginName": "DrawingShapePlugin",
|
|
4
|
-
"version": "2.5.0-
|
|
4
|
+
"version": "2.5.0-rc.2",
|
|
5
5
|
"description": "DrawingShapePlugin plugin for SoonSpace.js",
|
|
6
6
|
"main": "dist/index.js",
|
|
7
7
|
"module": "dist/index.esm.js",
|
|
@@ -13,5 +13,5 @@
|
|
|
13
13
|
],
|
|
14
14
|
"author": "xuek",
|
|
15
15
|
"license": "UNLICENSED",
|
|
16
|
-
"gitHead": "
|
|
16
|
+
"gitHead": "79cba0e2f5f973678555ef2876e11b0162b4112f"
|
|
17
17
|
}
|
package/src/index.ts
CHANGED
|
@@ -261,12 +261,18 @@ export default class DrawIngShapePlugin {
|
|
|
261
261
|
yHeight: 0,
|
|
262
262
|
id: DrawingIds.polygon,
|
|
263
263
|
} ],
|
|
264
|
+
lines: [ {
|
|
265
|
+
...options,
|
|
266
|
+
points: [],
|
|
267
|
+
id: DrawingIds.line,
|
|
268
|
+
width: 2,
|
|
269
|
+
} ],
|
|
264
270
|
} )
|
|
265
271
|
|
|
266
272
|
this.ssp.manager.store.canvas3DManager.scene.add( canvas )
|
|
267
273
|
|
|
268
274
|
const polygon = canvas.getPolygon( DrawingIds.polygon )
|
|
269
|
-
|
|
275
|
+
const line = canvas.getLine( DrawingIds.line )
|
|
270
276
|
const polygonPoints: Position[] = []
|
|
271
277
|
|
|
272
278
|
const omMouseMove = ( event: MouseEvent ) => {
|
|
@@ -276,12 +282,25 @@ export default class DrawIngShapePlugin {
|
|
|
276
282
|
|
|
277
283
|
if ( !polygon ) return
|
|
278
284
|
|
|
285
|
+
const movingPolygonPoints = [ ...polygonPoints, position ]
|
|
286
|
+
|
|
287
|
+
if ( movingPolygonPoints.length > 2 ) {
|
|
288
|
+
|
|
289
|
+
canvas.removeLine( DrawingIds.line )
|
|
290
|
+
|
|
291
|
+
} else {
|
|
292
|
+
|
|
293
|
+
line?.setOptions( {
|
|
294
|
+
points: movingPolygonPoints,
|
|
295
|
+
} )
|
|
296
|
+
|
|
297
|
+
}
|
|
298
|
+
|
|
279
299
|
polygon.setOptions( {
|
|
280
|
-
...options,
|
|
281
300
|
yHeight: ( polygonPoints[ 0 ]?.y || position.y ) + 1,
|
|
282
|
-
points:
|
|
301
|
+
points: movingPolygonPoints,
|
|
283
302
|
} )
|
|
284
|
-
|
|
303
|
+
|
|
285
304
|
}
|
|
286
305
|
|
|
287
306
|
const onClick = ( event: MouseEvent ) => {
|
|
@@ -289,7 +308,7 @@ export default class DrawIngShapePlugin {
|
|
|
289
308
|
const intersects = this.ssp.viewport.getIntersects( event )
|
|
290
309
|
const position = intersects.length > 0 ? intersects[ 0 ].point.clone() : this.ssp.getPositionByOffset( event )
|
|
291
310
|
|
|
292
|
-
polygonPoints.push( position )
|
|
311
|
+
polygonPoints.push( position.clone().setY( position.y + 1 ) )
|
|
293
312
|
|
|
294
313
|
if ( !polygon ) return
|
|
295
314
|
|