plotboilerplate 1.27.1 → 1.28.1
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 +135 -36
- package/dist/index.esm.js.map +1 -1
- package/dist/index.esm.min.js +1 -1
- package/dist/index.esm.min.js.map +1 -1
- package/dist/plotboilerplate.browser.min.js +1 -1
- package/dist/plotboilerplate.browser.min.js.map +1 -1
- package/dist/plotboilerplate.js +96 -17
- package/dist/plotboilerplate.min.js +1 -1
- package/package.json +2 -1
- package/src/cjs/PlotBoilerplate.d.ts +11 -1
- package/src/cjs/PlotBoilerplate.js +23 -7
- package/src/cjs/PlotBoilerplate.js.map +1 -1
- package/src/cjs/VertexListeners.d.ts +2 -1
- package/src/cjs/VertexListeners.js +5 -1
- package/src/cjs/VertexListeners.js.map +1 -1
- package/src/cjs/draw.d.ts +18 -2
- package/src/cjs/draw.js +21 -2
- package/src/cjs/draw.js.map +1 -1
- package/src/cjs/drawgl.d.ts +18 -3
- package/src/cjs/drawgl.js +19 -2
- package/src/cjs/drawgl.js.map +1 -1
- package/src/cjs/drawutilssvg.d.ts +19 -1
- package/src/cjs/drawutilssvg.js +28 -5
- package/src/cjs/drawutilssvg.js.map +1 -1
- package/src/cjs/interfaces/DrawLib.d.ts +18 -1
- package/src/cjs/interfaces/DrawLib.js +2 -0
- package/src/cjs/interfaces/DrawLib.js.map +1 -1
- package/src/cjs/utils/Params.d.ts +3 -2
- package/src/cjs/utils/Params.js +11 -3
- package/src/cjs/utils/Params.js.map +1 -1
- package/src/cjs/utils/WebColors.d.ts +2 -1
- package/src/cjs/utils/WebColors.js +15 -2
- package/src/cjs/utils/WebColors.js.map +1 -1
- package/src/cjs/utils/algorithms/HobbyPath.js +13 -16
- package/src/cjs/utils/algorithms/HobbyPath.js.map +1 -1
- package/src/cjs/utils/helpers/BezierResizeHelper.d.ts +144 -0
- package/src/cjs/utils/helpers/BezierResizeHelper.js +319 -0
- package/src/cjs/utils/helpers/BezierResizeHelper.js.map +1 -0
- package/src/esm/PlotBoilerplate.d.ts +11 -1
- package/src/esm/PlotBoilerplate.js +23 -7
- package/src/esm/PlotBoilerplate.js.map +1 -1
- package/src/esm/VertexListeners.d.ts +2 -1
- package/src/esm/VertexListeners.js +5 -1
- package/src/esm/VertexListeners.js.map +1 -1
- package/src/esm/draw.d.ts +18 -2
- package/src/esm/draw.js +21 -2
- package/src/esm/draw.js.map +1 -1
- package/src/esm/drawgl.d.ts +18 -3
- package/src/esm/drawgl.js +19 -2
- package/src/esm/drawgl.js.map +1 -1
- package/src/esm/drawutilssvg.d.ts +19 -1
- package/src/esm/drawutilssvg.js +28 -5
- package/src/esm/drawutilssvg.js.map +1 -1
- package/src/esm/interfaces/DrawLib.d.ts +18 -1
- package/src/esm/interfaces/DrawLib.js +2 -0
- package/src/esm/interfaces/DrawLib.js.map +1 -1
- package/src/esm/utils/Params.d.ts +3 -2
- package/src/esm/utils/Params.js +11 -3
- package/src/esm/utils/Params.js.map +1 -1
- package/src/esm/utils/WebColors.d.ts +2 -1
- package/src/esm/utils/WebColors.js +15 -2
- package/src/esm/utils/WebColors.js.map +1 -1
- package/src/esm/utils/algorithms/HobbyPath.js +13 -16
- package/src/esm/utils/algorithms/HobbyPath.js.map +1 -1
- package/src/esm/utils/helpers/BezierResizeHelper.d.ts +144 -0
- package/src/esm/utils/helpers/BezierResizeHelper.js +314 -0
- package/src/esm/utils/helpers/BezierResizeHelper.js.map +1 -0
- package/src/ts/PlotBoilerplate.ts +37 -11
- package/src/ts/VertexListeners.ts +5 -1
- package/src/ts/draw.ts +32 -2
- package/src/ts/drawgl.ts +38 -3
- package/src/ts/drawutilssvg.ts +33 -6
- package/src/ts/interfaces/DrawLib.ts +19 -1
- package/src/ts/utils/Params.ts +11 -3
- package/src/ts/utils/WebColors.ts +15 -2
- package/src/ts/utils/algorithms/HobbyPath.ts +248 -272
- package/src/ts/utils/helpers/BezierResizeHelper.ts +390 -0
- package/src/cjs/utils/_gup.js_ +0 -13
package/dist/plotboilerplate.js
CHANGED
|
@@ -272,7 +272,9 @@ exports.Vector = Vector;
|
|
|
272
272
|
* @modified 2024-09-13 Remoed the scaling of `lineWidth` in the `polygon` and `polyline` methods. This makes no sense here and doesn't match up with the behavior of other line functions.
|
|
273
273
|
* @modified 2026-01-04 Adding `lineJoin` attribute to the `StrokeOptions`.
|
|
274
274
|
* @modified 2026-03-18 Adding `isOpen` parameter to `cubicBezierPath` draw method.
|
|
275
|
-
* @
|
|
275
|
+
* @modified 2026-04-04 Added the method `bounds`.
|
|
276
|
+
* @modified 2026-04-04 Handling the `lineCap` attribute in the `StrokeOptions`.
|
|
277
|
+
* @version 1.15.0
|
|
276
278
|
**/
|
|
277
279
|
Object.defineProperty(exports, "__esModule", ({ value: true }));
|
|
278
280
|
exports.drawutils = void 0;
|
|
@@ -312,7 +314,7 @@ var drawutils = /** @class */ (function () {
|
|
|
312
314
|
*/
|
|
313
315
|
drawutils.prototype.applyStrokeOpts = function (strokeOptions) {
|
|
314
316
|
var _this = this;
|
|
315
|
-
var _a, _b, _c;
|
|
317
|
+
var _a, _b, _c, _d;
|
|
316
318
|
this.ctx.setLineDash(((_a = strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.dashArray) !== null && _a !== void 0 ? _a : []).map(function (dashArrayElem) {
|
|
317
319
|
// Note assume scale.x === scale.y
|
|
318
320
|
// Invariant scale makes funny stuff anyway.
|
|
@@ -320,6 +322,7 @@ var drawutils = /** @class */ (function () {
|
|
|
320
322
|
}));
|
|
321
323
|
this.ctx.lineDashOffset = ((_b = strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.dashOffset) !== null && _b !== void 0 ? _b : 0) * this.scale.x;
|
|
322
324
|
this.ctx.lineJoin = (_c = strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.lineJoin) !== null && _c !== void 0 ? _c : null;
|
|
325
|
+
this.ctx.lineCap = (_d = strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.lineCap) !== null && _d !== void 0 ? _d : null;
|
|
323
326
|
};
|
|
324
327
|
// +---------------------------------------------------------------------------------
|
|
325
328
|
// | This is the final helper function for drawing and filling stuff. It is not
|
|
@@ -693,6 +696,22 @@ var drawutils = /** @class */ (function () {
|
|
|
693
696
|
this._fillOrDraw(color);
|
|
694
697
|
this.ctx.restore();
|
|
695
698
|
};
|
|
699
|
+
/**
|
|
700
|
+
* Draw a rectangle at the given bounds; and with the specified line width and (CSS-) color.<br>
|
|
701
|
+
*
|
|
702
|
+
* @method bounds
|
|
703
|
+
* @param {IBounds} bounds - The bounds rectangle to be drawn.
|
|
704
|
+
* @param {string} color - The CSS color to draw the rectangle with.
|
|
705
|
+
* @param {number=} lineWidth - (optional) The line width to use; default is 1.
|
|
706
|
+
* @param {StrokeOptions=} strokeOptions - (optional) Stroke settings to use.
|
|
707
|
+
*
|
|
708
|
+
* @return {R}
|
|
709
|
+
* @instance
|
|
710
|
+
* @memberof DrawLib
|
|
711
|
+
*/
|
|
712
|
+
drawutils.prototype.bounds = function (bounds, color, lineWidth, strokeOptions) {
|
|
713
|
+
this.rect(bounds.min, bounds.max.x - bounds.min.x, bounds.max.y - bounds.min.y, color, lineWidth, strokeOptions);
|
|
714
|
+
};
|
|
696
715
|
/**
|
|
697
716
|
* Draw the given (cubic) bézier curve.
|
|
698
717
|
*
|
|
@@ -2441,7 +2460,8 @@ exports.CircleSector = CircleSector;
|
|
|
2441
2460
|
* @modified 2023-09-29 Added the `cubicBezierArrow(...)` function to the 'DrawLib.arrow()` interface.
|
|
2442
2461
|
* @modified 2023-09-29 Added the `lineDashes` attribute.
|
|
2443
2462
|
* @modified 2026-03-18 Adding `isOpen` parameter to `cubicBezierPath` draw method.
|
|
2444
|
-
* @
|
|
2463
|
+
* @modified 2026-04-04 Added the method `bounds`.
|
|
2464
|
+
* @version 0.0.11
|
|
2445
2465
|
**/
|
|
2446
2466
|
Object.defineProperty(exports, "__esModule", ({ value: true }));
|
|
2447
2467
|
exports.drawutilsgl = void 0;
|
|
@@ -2890,9 +2910,25 @@ var drawutilsgl = /** @class */ (function () {
|
|
|
2890
2910
|
* @param {string} color - The color to use.
|
|
2891
2911
|
* @param {number=1} lineWidth - (optional) The line with to use (default is 1).
|
|
2892
2912
|
**/
|
|
2893
|
-
drawutilsgl.prototype.rect = function (position, width, height, color, lineWidth) {
|
|
2913
|
+
drawutilsgl.prototype.rect = function (position, width, height, color, lineWidth, strokeOptions) {
|
|
2894
2914
|
// NOT YET IMPLEMENTED
|
|
2895
2915
|
};
|
|
2916
|
+
/**
|
|
2917
|
+
* Draw a rectangle at the given bounds; and with the specified line width and (CSS-) color.<br>
|
|
2918
|
+
*
|
|
2919
|
+
* @method bounds
|
|
2920
|
+
* @param {IBounds} bounds - The bounds rectangle to be drawn.
|
|
2921
|
+
* @param {string} color - The CSS color to draw the rectangle with.
|
|
2922
|
+
* @param {number=} lineWidth - (optional) The line width to use; default is 1.
|
|
2923
|
+
* @param {StrokeOptions=} strokeOptions - (optional) Stroke settings to use.
|
|
2924
|
+
*
|
|
2925
|
+
* @return {R}
|
|
2926
|
+
* @instance
|
|
2927
|
+
* @memberof DrawLib
|
|
2928
|
+
*/
|
|
2929
|
+
drawutilsgl.prototype.bounds = function (bounds, color, lineWidth, strokeOptions) {
|
|
2930
|
+
this.rect(bounds.min, bounds.max.x - bounds.min.x, bounds.max.y - bounds.min.y, color, lineWidth, strokeOptions);
|
|
2931
|
+
};
|
|
2896
2932
|
/**
|
|
2897
2933
|
* Draw a grid of horizontal and vertical lines with the given (CSS-) color.
|
|
2898
2934
|
*
|
|
@@ -3503,6 +3539,9 @@ exports.geomutils = {
|
|
|
3503
3539
|
* @modified 2026-01-04 Adding `lineJoin` attribute to the methods' `StrokeOptions` param.
|
|
3504
3540
|
* @modified 2026-01-04 Fixing missing `strokeOptions` param in the `drawutilssvg.polygon` method.
|
|
3505
3541
|
* @modified 2026-03-18 Adding `isOpen` parameter to `cubicBezierPath` draw method.
|
|
3542
|
+
* @modified 2026-04-04 Added the method `bounds`.
|
|
3543
|
+
* @modified 2026-04-04 Handling the `stroke-linecap` option now from the `StrokeOptions` interface.
|
|
3544
|
+
* @modified 2026-04-04 Chaning the `copyPathData` method by usind `Array.slice()`.
|
|
3506
3545
|
* @version 1.7.0
|
|
3507
3546
|
**/
|
|
3508
3547
|
Object.defineProperty(exports, "__esModule", ({ value: true }));
|
|
@@ -3929,6 +3968,10 @@ var drawutilssvg = /** @class */ (function () {
|
|
|
3929
3968
|
if (strokeOptions && strokeOptions.lineJoin && drawutilssvg.nodeSupportsLineJoin(node.tagName)) {
|
|
3930
3969
|
node.setAttribute("stroke-linejoin", strokeOptions.lineJoin);
|
|
3931
3970
|
}
|
|
3971
|
+
// Set lineCap option?
|
|
3972
|
+
if (strokeOptions && strokeOptions.lineCap && drawutilssvg.nodeSupportsLineCap(node.tagName)) {
|
|
3973
|
+
node.setAttribute("stroke-linecap", strokeOptions.lineCap);
|
|
3974
|
+
}
|
|
3932
3975
|
};
|
|
3933
3976
|
drawutilssvg.prototype._x = function (x) {
|
|
3934
3977
|
return this.offset.x + this.scale.x * x;
|
|
@@ -4405,6 +4448,22 @@ var drawutilssvg = /** @class */ (function () {
|
|
|
4405
4448
|
node.setAttribute("height", "".concat(height * this.scale.y));
|
|
4406
4449
|
return this._bindFillDraw(node, "rect", color, lineWidth || 1);
|
|
4407
4450
|
};
|
|
4451
|
+
/**
|
|
4452
|
+
* Draw a rectangle at the given bounds; and with the specified line width and (CSS-) color.<br>
|
|
4453
|
+
*
|
|
4454
|
+
* @method bounds
|
|
4455
|
+
* @param {IBounds} bounds - The bounds rectangle to be drawn.
|
|
4456
|
+
* @param {string} color - The CSS color to draw the rectangle with.
|
|
4457
|
+
* @param {number=} lineWidth - (optional) The line width to use; default is 1.
|
|
4458
|
+
* @param {StrokeOptions=} strokeOptions - (optional) Stroke settings to use.
|
|
4459
|
+
*
|
|
4460
|
+
* @return {R}
|
|
4461
|
+
* @instance
|
|
4462
|
+
* @memberof DrawLib
|
|
4463
|
+
*/
|
|
4464
|
+
drawutilssvg.prototype.bounds = function (bounds, color, lineWidth, strokeOptions) {
|
|
4465
|
+
this.rect(bounds.min, bounds.max.x - bounds.min.x, bounds.max.y - bounds.min.y, color, lineWidth, strokeOptions);
|
|
4466
|
+
};
|
|
4408
4467
|
/**
|
|
4409
4468
|
* Draw a grid of horizontal and vertical lines with the given (CSS-) color.
|
|
4410
4469
|
*
|
|
@@ -4858,11 +4917,8 @@ var drawutilssvg = /** @class */ (function () {
|
|
|
4858
4917
|
* @memberof drawutilssvg
|
|
4859
4918
|
*/
|
|
4860
4919
|
drawutilssvg.copyPathData = function (data) {
|
|
4861
|
-
|
|
4862
|
-
|
|
4863
|
-
copy[i] = data[i];
|
|
4864
|
-
}
|
|
4865
|
-
return copy;
|
|
4920
|
+
// To create a shallow copy we can just use the `slice` method.
|
|
4921
|
+
return data.slice();
|
|
4866
4922
|
};
|
|
4867
4923
|
/**
|
|
4868
4924
|
* Transform the given path data (translate and scale. rotating is not intended here).
|
|
@@ -5034,6 +5090,9 @@ var drawutilssvg = /** @class */ (function () {
|
|
|
5034
5090
|
drawutilssvg.nodeSupportsLineJoin = function (nodeName) {
|
|
5035
5091
|
return ["line", "path", "circle", "ellipse", "rectangle", "rect"].includes(nodeName);
|
|
5036
5092
|
};
|
|
5093
|
+
drawutilssvg.nodeSupportsLineCap = function (nodeName) {
|
|
5094
|
+
return ["line", "path", "circle", "ellipse", "rectangle", "rect"].includes(nodeName);
|
|
5095
|
+
};
|
|
5037
5096
|
/**
|
|
5038
5097
|
* Creates a basic <line> node with start and end coordinates. The created node will not
|
|
5039
5098
|
* be bound to any root node.
|
|
@@ -5769,8 +5828,9 @@ exports.KeyHandler = KeyHandler;
|
|
|
5769
5828
|
* @modified 2025-05-07 Moving full vectors now by default when vector point a is moved.
|
|
5770
5829
|
* @modified 2025-05-20 Applying `lineWith` parameter in the draw routine for vectors (had been missing).
|
|
5771
5830
|
* @modified 2026-03-13 Changed visibility of `setZoom` and `setOffset` to public. There was no good reason to have the private.
|
|
5831
|
+
* @modified 2026-04-04 Added `isInPanningMode` attribute and `isPanning` method.
|
|
5772
5832
|
*
|
|
5773
|
-
* @version 1.
|
|
5833
|
+
* @version 1.22.0
|
|
5774
5834
|
*
|
|
5775
5835
|
* @file PlotBoilerplate
|
|
5776
5836
|
* @fileoverview The main class.
|
|
@@ -6229,6 +6289,9 @@ var PlotBoilerplate = /** @class */ (function () {
|
|
|
6229
6289
|
this.resizeCanvas();
|
|
6230
6290
|
this.updateCSSscale();
|
|
6231
6291
|
};
|
|
6292
|
+
PlotBoilerplate.prototype.isPanning = function () {
|
|
6293
|
+
return this.isInPanningMode;
|
|
6294
|
+
};
|
|
6232
6295
|
/**
|
|
6233
6296
|
* Set the current zoom and draw offset to fit the given bounds.
|
|
6234
6297
|
*
|
|
@@ -7108,13 +7171,12 @@ var PlotBoilerplate = /** @class */ (function () {
|
|
|
7108
7171
|
**/
|
|
7109
7172
|
// TODO: this was moved to the DOM utils
|
|
7110
7173
|
PlotBoilerplate.prototype.getAvailableContainerSpace = function () {
|
|
7111
|
-
var
|
|
7112
|
-
|
|
7113
|
-
|
|
7114
|
-
var padding = this.getFProp(container, "padding") || 0, border = this.getFProp(_self.canvas, "border-width") || 0, pl = this.getFProp(container, "padding-left") || padding, pr = this.getFProp(container, "padding-right") || padding, pt = this.getFProp(container, "padding-top") || padding, pb = this.getFProp(container, "padding-bottom") || padding, bl = this.getFProp(_self.canvas, "border-left-width") || border, br = this.getFProp(_self.canvas, "border-right-width") || border, bt = this.getFProp(_self.canvas, "border-top-width") || border, bb = this.getFProp(_self.canvas, "border-bottom-width") || border;
|
|
7174
|
+
var container = this.canvas.parentNode; // Element | Document | DocumentFragment;
|
|
7175
|
+
this.canvas.style.display = "none";
|
|
7176
|
+
var padding = this.getFProp(container, "padding") || 0, border = this.getFProp(this.canvas, "border-width") || 0, pl = this.getFProp(container, "padding-left") || padding, pr = this.getFProp(container, "padding-right") || padding, pt = this.getFProp(container, "padding-top") || padding, pb = this.getFProp(container, "padding-bottom") || padding, bl = this.getFProp(this.canvas, "border-left-width") || border, br = this.getFProp(this.canvas, "border-right-width") || border, bt = this.getFProp(this.canvas, "border-top-width") || border, bb = this.getFProp(this.canvas, "border-bottom-width") || border;
|
|
7115
7177
|
var w = container.clientWidth;
|
|
7116
7178
|
var h = container.clientHeight;
|
|
7117
|
-
|
|
7179
|
+
this.canvas.style.display = "block";
|
|
7118
7180
|
return { width: w - pl - pr - bl - br, height: h - pt - pb - bt - bb };
|
|
7119
7181
|
};
|
|
7120
7182
|
/**
|
|
@@ -7377,7 +7439,8 @@ var PlotBoilerplate = /** @class */ (function () {
|
|
|
7377
7439
|
// not this one. So this tab will never receive any [Ctrl-down] events
|
|
7378
7440
|
// until next keypress; the implication is, that [Ctrl] would still
|
|
7379
7441
|
// considered to be pressed which is not true.
|
|
7380
|
-
if (this.keyHandler && (this.keyHandler.isDown("alt") || this.keyHandler.isDown("spacebar"))) {
|
|
7442
|
+
// if (this.keyHandler && (this.keyHandler.isDown("alt") || this.keyHandler.isDown("spacebar"))) {
|
|
7443
|
+
if (this.isInPanningMode) {
|
|
7381
7444
|
if (!this.config.enablePan) {
|
|
7382
7445
|
return;
|
|
7383
7446
|
}
|
|
@@ -7729,6 +7792,18 @@ var PlotBoilerplate = /** @class */ (function () {
|
|
|
7729
7792
|
_self.selectVerticesInPolygon(_self.selectPolygon);
|
|
7730
7793
|
_self.selectPolygon = null;
|
|
7731
7794
|
_self.redraw();
|
|
7795
|
+
})
|
|
7796
|
+
.down("alt", function () {
|
|
7797
|
+
_self.isInPanningMode = true;
|
|
7798
|
+
})
|
|
7799
|
+
.up("alt", function () {
|
|
7800
|
+
_self.isInPanningMode = false;
|
|
7801
|
+
})
|
|
7802
|
+
.down("spacebar", function () {
|
|
7803
|
+
_self.isInPanningMode = true;
|
|
7804
|
+
})
|
|
7805
|
+
.up("spacebar", function () {
|
|
7806
|
+
_self.isInPanningMode = false;
|
|
7732
7807
|
});
|
|
7733
7808
|
} // END IF enableKeys?
|
|
7734
7809
|
else {
|
|
@@ -13675,7 +13750,8 @@ exports.MouseHandler = MouseHandler;
|
|
|
13675
13750
|
* @modified 2020-02-22 Added 'return this' to the add* functions (for chanining).
|
|
13676
13751
|
* @modified 2020-03-23 Ported to Typescript from JS.
|
|
13677
13752
|
* @modified 2020-11-17 Added the `click` handler.
|
|
13678
|
-
* @
|
|
13753
|
+
* @modified 2026-04-04 Adding null-listeners will now throw an error.
|
|
13754
|
+
* @version 1.2.0
|
|
13679
13755
|
*
|
|
13680
13756
|
* @file VertexListeners
|
|
13681
13757
|
* @public
|
|
@@ -13912,6 +13988,9 @@ var VertexListeners = /** @class */ (function () {
|
|
|
13912
13988
|
* @private
|
|
13913
13989
|
*/
|
|
13914
13990
|
VertexListeners._addListener = function (listeners, newListener) {
|
|
13991
|
+
if (!newListener) {
|
|
13992
|
+
throw new Error("Cannot add null listener. This would lead to unpredictable errors during event handling.");
|
|
13993
|
+
}
|
|
13915
13994
|
for (var i in listeners) {
|
|
13916
13995
|
if (listeners[i] == newListener)
|
|
13917
13996
|
return false;
|