@inweb/viewer-three 26.5.1 → 26.5.3
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/viewer-three.js +73 -55
- package/dist/viewer-three.js.map +1 -1
- package/dist/viewer-three.min.js +2 -2
- package/package.json +5 -5
package/dist/viewer-three.js
CHANGED
|
@@ -78540,7 +78540,7 @@ void main() {
|
|
|
78540
78540
|
|
|
78541
78541
|
class KonvaEllipse {
|
|
78542
78542
|
constructor(params, ref = null, worldTransformer = new WorldTransform) {
|
|
78543
|
-
var _a, _b;
|
|
78543
|
+
var _a, _b, _c;
|
|
78544
78544
|
this._worldTransformer = worldTransformer;
|
|
78545
78545
|
if (ref) {
|
|
78546
78546
|
this._ref = ref;
|
|
@@ -78573,6 +78573,10 @@ void main() {
|
|
|
78573
78573
|
y: 0
|
|
78574
78574
|
};
|
|
78575
78575
|
if (params.position2) {
|
|
78576
|
+
(_a = params.radius) !== null && _a !== undefined ? _a : params.radius = {
|
|
78577
|
+
x: 0,
|
|
78578
|
+
y: 0
|
|
78579
|
+
};
|
|
78576
78580
|
params.radius.x = getDistanceIn2D(params.position, params.position2);
|
|
78577
78581
|
if (params.position3) params.radius.y = getDistanceIn2D(params.position, params.position3); else params.radius.x = params.radius.y;
|
|
78578
78582
|
} else {
|
|
@@ -78582,8 +78586,8 @@ void main() {
|
|
|
78582
78586
|
};
|
|
78583
78587
|
}
|
|
78584
78588
|
this._ref = new Konva.Ellipse({
|
|
78585
|
-
stroke: (
|
|
78586
|
-
strokeWidth: (
|
|
78589
|
+
stroke: (_b = params.color) !== null && _b !== undefined ? _b : "#ff0000",
|
|
78590
|
+
strokeWidth: (_c = params.lineWidth) !== null && _c !== undefined ? _c : 4,
|
|
78587
78591
|
globalCompositeOperation: "source-over",
|
|
78588
78592
|
lineCap: "round",
|
|
78589
78593
|
lineJoin: "round",
|
|
@@ -79019,13 +79023,13 @@ void main() {
|
|
|
79019
79023
|
this._ref.width(params.maxHeight / this._ratio);
|
|
79020
79024
|
this._ref.height(params.maxHeight);
|
|
79021
79025
|
}
|
|
79022
|
-
const wcsEnd = this._worldTransformer.screenToWorld({
|
|
79023
|
-
x: params.position.x + this._ref.width(),
|
|
79024
|
-
y: params.position.y + this._ref.height()
|
|
79025
|
-
});
|
|
79026
|
-
this._ref.setAttr("wcsEnd", wcsEnd);
|
|
79027
79026
|
}
|
|
79028
79027
|
}
|
|
79028
|
+
const wcsEnd = this._worldTransformer.screenToWorld({
|
|
79029
|
+
x: params.position.x + this._ref.width(),
|
|
79030
|
+
y: params.position.y + this._ref.height()
|
|
79031
|
+
});
|
|
79032
|
+
this._ref.setAttr("wcsEnd", wcsEnd);
|
|
79029
79033
|
};
|
|
79030
79034
|
this._canvasImage.onerror = () => {
|
|
79031
79035
|
this._canvasImage.onerror = function() {};
|
|
@@ -79244,7 +79248,10 @@ void main() {
|
|
|
79244
79248
|
};
|
|
79245
79249
|
}
|
|
79246
79250
|
}
|
|
79247
|
-
const ARC_RADIUS =
|
|
79251
|
+
const ARC_RADIUS = 8;
|
|
79252
|
+
const ARC_LENGTH = 15;
|
|
79253
|
+
const MIN_CLOUD_WIDTH = 50;
|
|
79254
|
+
const MIN_CLOUD_HEIGHT = 50;
|
|
79248
79255
|
this._ref = new Konva.Shape({
|
|
79249
79256
|
x: params.position.x,
|
|
79250
79257
|
y: params.position.y,
|
|
@@ -79256,63 +79263,76 @@ void main() {
|
|
|
79256
79263
|
strokeScaleEnabled: false,
|
|
79257
79264
|
globalCompositeOperation: "source-over",
|
|
79258
79265
|
sceneFunc: (context, shape) => {
|
|
79259
|
-
|
|
79260
|
-
|
|
79261
|
-
const midY = position.y + height / 2;
|
|
79262
|
-
return {
|
|
79263
|
-
x: midX,
|
|
79264
|
-
y: midY
|
|
79265
|
-
};
|
|
79266
|
-
}
|
|
79266
|
+
const width = this._ref.width();
|
|
79267
|
+
const height = this._ref.height();
|
|
79267
79268
|
const points = [ {
|
|
79268
79269
|
x: 0,
|
|
79269
79270
|
y: 0
|
|
79270
79271
|
}, {
|
|
79271
|
-
x: 0 +
|
|
79272
|
+
x: 0 + width,
|
|
79272
79273
|
y: 0
|
|
79273
79274
|
}, {
|
|
79274
|
-
x: 0 +
|
|
79275
|
-
y: 0 +
|
|
79275
|
+
x: 0 + width,
|
|
79276
|
+
y: 0 + height
|
|
79276
79277
|
}, {
|
|
79277
79278
|
x: 0,
|
|
79278
|
-
y: 0 +
|
|
79279
|
+
y: 0 + height
|
|
79279
79280
|
}, {
|
|
79280
79281
|
x: 0,
|
|
79281
79282
|
y: 0
|
|
79282
79283
|
} ];
|
|
79283
|
-
|
|
79284
|
-
|
|
79285
|
-
|
|
79286
|
-
|
|
79287
|
-
|
|
79288
|
-
|
|
79289
|
-
|
|
79290
|
-
|
|
79291
|
-
|
|
79292
|
-
|
|
79293
|
-
const
|
|
79294
|
-
|
|
79295
|
-
|
|
79296
|
-
|
|
79297
|
-
|
|
79298
|
-
let
|
|
79299
|
-
|
|
79300
|
-
|
|
79301
|
-
|
|
79302
|
-
|
|
79303
|
-
|
|
79304
|
-
|
|
79305
|
-
|
|
79306
|
-
|
|
79307
|
-
|
|
79308
|
-
|
|
79284
|
+
if (width >= MIN_CLOUD_WIDTH - 1 || height >= MIN_CLOUD_HEIGHT - 1) drawCloud(ARC_RADIUS, ARC_LENGTH); else if (width >= MIN_CLOUD_WIDTH / 2 || height >= MIN_CLOUD_HEIGHT / 2) drawCloud(ARC_RADIUS / 2, ARC_LENGTH / 2); else drawRectangle();
|
|
79285
|
+
function calculateMidpoint(position) {
|
|
79286
|
+
const midX = position.x + width / 2;
|
|
79287
|
+
const midY = position.y + height / 2;
|
|
79288
|
+
return {
|
|
79289
|
+
x: midX,
|
|
79290
|
+
y: midY
|
|
79291
|
+
};
|
|
79292
|
+
}
|
|
79293
|
+
function drawCloud(arcRadius, arcLength) {
|
|
79294
|
+
const midPoint = calculateMidpoint({
|
|
79295
|
+
x: 0,
|
|
79296
|
+
y: 0
|
|
79297
|
+
});
|
|
79298
|
+
context.beginPath();
|
|
79299
|
+
for (let iPoint = 0; iPoint < points.length - 1; iPoint++) {
|
|
79300
|
+
let approxArcLength = arcLength;
|
|
79301
|
+
const dx = points[iPoint + 1].x - points[iPoint].x;
|
|
79302
|
+
const dy = points[iPoint + 1].y - points[iPoint].y;
|
|
79303
|
+
const length = Math.sqrt(dx * dx + dy * dy);
|
|
79304
|
+
const arcCount = Math.floor(length / approxArcLength);
|
|
79305
|
+
const lengthMod = length % approxArcLength;
|
|
79306
|
+
approxArcLength = arcLength + arcCount / lengthMod;
|
|
79307
|
+
let pX = points[iPoint].x + dx / arcCount / 2;
|
|
79308
|
+
let pY = points[iPoint].y + dy / arcCount / 2;
|
|
79309
|
+
const pEndX = points[iPoint + 1].x;
|
|
79310
|
+
const pEndY = points[iPoint + 1].y;
|
|
79311
|
+
const endAngle = Math.atan((pEndY - pY) / (pEndX - pX));
|
|
79312
|
+
const startAngle = endAngle + Math.PI;
|
|
79313
|
+
const counterClockwise = pX > midPoint.x && pY > midPoint.y;
|
|
79314
|
+
for (let iArc = 0; iArc < arcCount; iArc++) {
|
|
79315
|
+
if (counterClockwise) {
|
|
79316
|
+
context.arc(pX, pY, arcRadius, endAngle, startAngle);
|
|
79317
|
+
} else {
|
|
79318
|
+
context.arc(pX, pY, arcRadius, startAngle, endAngle);
|
|
79319
|
+
}
|
|
79320
|
+
pX += dx / arcCount;
|
|
79321
|
+
pY += dy / arcCount;
|
|
79309
79322
|
}
|
|
79310
|
-
pX += dx / arcCount;
|
|
79311
|
-
pY += dy / arcCount;
|
|
79312
79323
|
}
|
|
79324
|
+
context.closePath();
|
|
79325
|
+
context.fillStrokeShape(shape);
|
|
79326
|
+
}
|
|
79327
|
+
function drawRectangle() {
|
|
79328
|
+
context.beginPath();
|
|
79329
|
+
context.lineTo(points[1].x, points[1].y);
|
|
79330
|
+
context.lineTo(points[2].x, points[2].y);
|
|
79331
|
+
context.lineTo(points[3].x, points[3].y);
|
|
79332
|
+
context.lineTo(points[4].x, points[4].y);
|
|
79333
|
+
context.closePath();
|
|
79334
|
+
context.fillStrokeShape(shape);
|
|
79313
79335
|
}
|
|
79314
|
-
context.closePath();
|
|
79315
|
-
context.fillStrokeShape(shape);
|
|
79316
79336
|
}
|
|
79317
79337
|
});
|
|
79318
79338
|
this._ref.className = "Cloud";
|
|
@@ -79332,10 +79352,8 @@ void main() {
|
|
|
79332
79352
|
if (scaleByX) newWidth *= attrs.scaleX;
|
|
79333
79353
|
let newHeight = this._ref.height();
|
|
79334
79354
|
if (scaleByY) newHeight *= attrs.scaleY;
|
|
79335
|
-
|
|
79336
|
-
|
|
79337
|
-
if (newWidth < minWidth) newWidth = minWidth;
|
|
79338
|
-
if (newHeight < minHeight) newHeight = minHeight;
|
|
79355
|
+
if (newWidth < MIN_CLOUD_WIDTH) newWidth = MIN_CLOUD_WIDTH;
|
|
79356
|
+
if (newHeight < MIN_CLOUD_HEIGHT) newHeight = MIN_CLOUD_HEIGHT;
|
|
79339
79357
|
if (scaleByX) {
|
|
79340
79358
|
this._ref.width(newWidth);
|
|
79341
79359
|
}
|