scichart
Version:
Fast WebGL JavaScript Charting Library and Framework
720 lines (719 loc) • 40.6 kB
JavaScript
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.OverviewCustomResizableAnnotation = void 0;
var Point_1 = require("../../../Core/Point");
var TypedPoint_1 = require("../../../Core/TypedPoint");
var CursorStyle_1 = require("../../../types/CursorStyle");
var coordinates_1 = require("../../../types/coordinates");
var XyDirection_1 = require("../../../types/XyDirection");
var pointUtil_1 = require("../../../utils/pointUtil");
var translate_1 = require("../../../utils/translate");
var DpiHelper_1 = require("../TextureManager/DpiHelper");
var AnnotationBase_1 = require("./AnnotationBase");
var annotationHelpers_1 = require("./annotationHelpers");
var constants_1 = require("./constants");
var CustomAnnotation_1 = require("./CustomAnnotation");
var inputMode = AnnotationBase_1.ECoordinateMode.DataValue;
/**
* A OverviewCustomResizableAnnotation presents SVG information over the chart at specific {@link X1}, {@link Y1}, {@link X2}, {@link Y2} coordinates.
* @remarks The annotation can be moved or resized up to the limits set by minWidth/minHeight properties and axis visible range
*/
var OverviewCustomResizableAnnotation = /** @class */ (function (_super) {
__extends(OverviewCustomResizableAnnotation, _super);
function OverviewCustomResizableAnnotation(options) {
var _this = this;
var _a, _b, _c;
_this = _super.call(this, options) || this;
_this.minWidthProperty = 10;
_this.minHeightProperty = 10;
_this.onPointerMove = function (event) {
if (!_this.parentSurface || _this.isHidden || !_this.isEditable) {
return;
}
if (_this.isDraggingStarted) {
_this.applyCursor(_this.getCursorForDragPoint(_this.adornerDraggingPoint));
return;
}
var mousePoint = new Point_1.Point(event.offsetX * DpiHelper_1.DpiHelper.PIXEL_RATIO, event.offsetY * DpiHelper_1.DpiHelper.PIXEL_RATIO);
var dragPoint = _this.resolveDragPointFromMousePoint(mousePoint);
_this.applyCursor(_this.getCursorForDragPoint(dragPoint));
};
_this.onPointerLeave = function () {
if (_this.isDraggingStarted) {
return;
}
_this.applyCursor(CursorStyle_1.ECursorStyle.Default);
};
_this.adornerSvgStringTemplateProperty =
(_a = options === null || options === void 0 ? void 0 : options.adornerSvgStringTemplate) !== null && _a !== void 0 ? _a : _this.adornerSvgStringTemplateProperty;
_this.minWidthProperty = (_b = options === null || options === void 0 ? void 0 : options.minWidth) !== null && _b !== void 0 ? _b : _this.minWidthProperty;
_this.minHeightProperty = (_c = options === null || options === void 0 ? void 0 : options.minHeight) !== null && _c !== void 0 ? _c : _this.minHeightProperty;
return _this;
}
Object.defineProperty(OverviewCustomResizableAnnotation.prototype, "minWidth", {
/**
* Gets or sets the minimum width of the annotation
*/
get: function () {
return this.minWidthProperty;
},
/**
* Gets or sets the minimum width of the annotation
*/
set: function (value) {
this.minWidthProperty = value;
this.notifyPropertyChanged(constants_1.PROPERTY.MINIMUM_WIDTH);
},
enumerable: false,
configurable: true
});
Object.defineProperty(OverviewCustomResizableAnnotation.prototype, "minHeight", {
/**
* Gets or sets the minimum width of the annotation
*/
get: function () {
return this.minHeightProperty;
},
/**
* Gets or sets the minimum width of the annotation
*/
set: function (value) {
this.minHeightProperty = value;
this.notifyPropertyChanged(constants_1.PROPERTY.MINIMUM_HEIGHT);
},
enumerable: false,
configurable: true
});
Object.defineProperty(OverviewCustomResizableAnnotation.prototype, "adornerSvgStringTemplate", {
/**
* Gets or sets the SVG template of the annotation adorner
*/
get: function () {
return this.adornerSvgStringTemplateProperty;
},
/**
* Gets or sets the SVG template of the annotation adorner
*/
set: function (value) {
this.adornerSvgStringTemplateProperty = value;
this.notifyPropertyChanged(constants_1.PROPERTY.ADORNER_TEMPLATE);
},
enumerable: false,
configurable: true
});
/**
* Updates the annotation position and size while maintaining limits set by minWidth and minHeight
* @param coordinates an object with the coordinates - {x1, x2, y1, y2}
*/
OverviewCustomResizableAnnotation.prototype.setCoordinates = function (coordinates) {
var _a, _b, _c, _d;
// Overview Annotation should be resized only if attached
// since the new coordinates are validated accordingly to the size limits
if (!this.parentSurface) {
return;
}
var xAxis = this.xAxis;
var xCalc = xAxis.getCurrentCoordinateCalculator();
var yAxis = this.yAxis;
var yCalc = yAxis.getCurrentCoordinateCalculator();
var currentX1DataValue = (0, coordinates_1.convertCoordinateMode)(this.x1, xCalc, this.xCoordinateMode, inputMode);
var currentX2DataValue = (0, coordinates_1.convertCoordinateMode)(this.x2, xCalc, this.xCoordinateMode, inputMode);
var currentY1DataValue = (0, coordinates_1.convertCoordinateMode)(this.y1, yCalc, this.yCoordinateMode, inputMode);
var currentY2DataValue = (0, coordinates_1.convertCoordinateMode)(this.y2, yCalc, this.yCoordinateMode, inputMode);
var _e = coordinates.x1, expectedX1 = _e === void 0 ? currentX1DataValue : _e, _f = coordinates.x2, expectedX2 = _f === void 0 ? currentX2DataValue : _f, _g = coordinates.y1, expectedY1 = _g === void 0 ? currentY1DataValue : _g, _h = coordinates.y2, expectedY2 = _h === void 0 ? currentY2DataValue : _h;
var expectedAbsoluteX1Y1Point = this.convertPointToAbsoluteCoordinates(new TypedPoint_1.TypedPoint(expectedX1, expectedY1), inputMode, inputMode);
var expectedAbsoluteX2Y2Point = this.convertPointToAbsoluteCoordinates(new TypedPoint_1.TypedPoint(expectedX2, expectedY2), inputMode, inputMode);
var horizontalCalc = xAxis.isHorizontalAxis ? xCalc : yCalc;
var verticalCalc = yAxis.isHorizontalAxis ? xCalc : yCalc;
// Calculating edges to prevent moving outside of seriesViewRect ???
var rightEdgeCoordValue = horizontalCalc.hasFlippedCoordinates ? expectedX1 : expectedX2;
var leftEdgeCoordValue = horizontalCalc.hasFlippedCoordinates ? expectedX2 : expectedX1;
var topEdgeCoordValue = verticalCalc.hasFlippedCoordinates ? expectedX1 : expectedX2;
var bottomEdgeCoordValue = verticalCalc.hasFlippedCoordinates ? expectedX2 : expectedX1;
var rightEdgeCoord = (0, coordinates_1.convertToAbsoluteCoordinate)(rightEdgeCoordValue, horizontalCalc, inputMode);
var leftEdgeCoord = (0, coordinates_1.convertToAbsoluteCoordinate)(leftEdgeCoordValue, horizontalCalc, inputMode);
var topEdgeCoord = (0, coordinates_1.convertToAbsoluteCoordinate)(topEdgeCoordValue, verticalCalc, inputMode);
var bottomEdgeCoord = (0, coordinates_1.convertToAbsoluteCoordinate)(bottomEdgeCoordValue, verticalCalc, inputMode);
var topRightPoint = new TypedPoint_1.TypedPoint(rightEdgeCoord, topEdgeCoord);
var bottomLeftPoint = new TypedPoint_1.TypedPoint(leftEdgeCoord, bottomEdgeCoord);
// adjust coordinates if they don't fit size limits
if (xAxis.isHorizontalAxis) {
if (expectedX1 - currentX1DataValue >= currentX2DataValue - expectedX2) {
// the annotation is being moved to the right
this.x2 =
(_a = (0, coordinates_1.convertFromAbsoluteCoordinate)(expectedAbsoluteX2Y2Point.x, xCalc, this.xCoordinateMode)) !== null && _a !== void 0 ? _a : this.x2;
if (xCalc.hasFlippedCoordinates) {
this.adjustLeftSideToLimits(expectedAbsoluteX2Y2Point.x, topRightPoint, xCalc);
}
else {
this.adjustRightSideToLimits(expectedAbsoluteX2Y2Point.x, bottomLeftPoint, xCalc);
}
}
else {
// the annotation is being moved to the left
this.x1 =
(_b = (0, coordinates_1.convertFromAbsoluteCoordinate)(expectedAbsoluteX1Y1Point.x, xCalc, this.xCoordinateMode)) !== null && _b !== void 0 ? _b : this.x1;
if (xCalc.hasFlippedCoordinates) {
this.adjustRightSideToLimits(expectedAbsoluteX1Y1Point.x, bottomLeftPoint, xCalc);
}
else {
this.adjustLeftSideToLimits(expectedAbsoluteX1Y1Point.x, topRightPoint, xCalc);
}
}
}
else {
if ((0, coordinates_1.subtractCoord)(expectedX1, currentX1DataValue) >= (0, coordinates_1.subtractCoord)(currentX2DataValue, expectedX2)) {
// the annotation is being moved to the top
this.x2 =
(_c = (0, coordinates_1.convertFromAbsoluteCoordinate)(expectedAbsoluteX2Y2Point.y, xCalc, this.xCoordinateMode)) !== null && _c !== void 0 ? _c : this.x2;
if (xCalc.hasFlippedCoordinates) {
this.adjustTopSideToLimits(expectedAbsoluteX2Y2Point.y, topRightPoint, xCalc);
}
else {
this.adjustBottomSideToLimits(expectedAbsoluteX2Y2Point.y, bottomLeftPoint, xCalc);
}
}
else {
// the annotation is being moved to the bottom
this.x1 =
(_d = (0, coordinates_1.convertFromAbsoluteCoordinate)(expectedAbsoluteX1Y1Point.y, xCalc, this.xCoordinateMode)) !== null && _d !== void 0 ? _d : this.x1;
if (xCalc.hasFlippedCoordinates) {
this.adjustBottomSideToLimits(expectedAbsoluteX1Y1Point.y, bottomLeftPoint, xCalc);
}
else {
this.adjustTopSideToLimits(expectedAbsoluteX1Y1Point.y, topRightPoint, xCalc);
}
}
}
};
/**
* Calculates current dragging point. Defines logic of grip points placement
* @param args {@link ModifierMouseArgs}
*/
OverviewCustomResizableAnnotation.prototype.onDragStarted = function (args) {
var _a;
// handles default browser dragging behavior when canvas was selected with Ctrl + A
args.nativeEvent.preventDefault();
(_a = this.dragStarted) === null || _a === void 0 ? void 0 : _a.raiseEvent();
var dragPoint = this.resolveDragPointFromMousePoint(new TypedPoint_1.TypedPoint(args.mousePoint.x, args.mousePoint.y));
if (!dragPoint) {
return false;
}
this.adornerDraggingPoint = dragPoint;
this.applyCursor(this.getCursorForDragPoint(dragPoint));
return true;
};
/**
* Updates the annotation position, with the {@link CoordinateCalculatorBase | Coordinate Calculators} passed in
* @param xCalc The XAxis {@link CoordinateCalculatorBase | CoordinateCalculator} applied to this annotation
* @param yCalc The YAxis {@link CoordinateCalculatorBase | CoordinateCalculator} applied to this annotation
* @param xCoordSvgTrans X-coordinate translation which is needed to use SVG canvas having the whole chart size
* @param yCoordSvgTrans Y-coordinate translation which is needed to use SVG canvas having the whole chart size
*/
OverviewCustomResizableAnnotation.prototype.update = function (xCalc, yCalc, xCoordSvgTrans, yCoordSvgTrans) {
// create svg if there is none
this.create(xCalc, yCalc, xCoordSvgTrans, yCoordSvgTrans);
this.svg.style.display = this.isHidden ? "none" : "block";
this.svg.style.opacity = this.opacity.toString();
var x1Coord = this.getX1Coordinate(xCalc, yCalc);
var y1Coord = this.getY1Coordinate(xCalc, yCalc);
var x2Coord = this.getX2Coordinate(xCalc, yCalc);
var y2Coord = this.getY2Coordinate(xCalc, yCalc);
this.setAnnotationBorders(x1Coord, x2Coord, y1Coord, y2Coord);
if (isNaN(x1Coord) ||
isNaN(y1Coord) ||
!isFinite(x1Coord) ||
!isFinite(y1Coord) ||
isNaN(x2Coord) ||
isNaN(y2Coord) ||
!isFinite(x2Coord) ||
!isFinite(y2Coord)) {
this.svg.style.display = "none";
}
else {
// calculate and adjust size accordingly to coordinates
var width = Math.abs(x2Coord - x1Coord);
var height = Math.abs(y2Coord - y1Coord);
var svgXCoord = (x1Coord < x2Coord ? x1Coord : x2Coord) + xCoordSvgTrans;
var svgYCoord = (y1Coord < y2Coord ? y1Coord : y2Coord) + yCoordSvgTrans;
this.setSvgAttribute("x", svgXCoord);
this.setSvgAttribute("y", svgYCoord);
this.setSvgAttribute("width", width);
this.setSvgAttribute("height", height);
this.svgDOMRect = this.svg.getBoundingClientRect();
}
this.updateAdornerInner();
};
/**
* Handles the dragging event. Updates the coordinates after dragging or resizing
* @param xyValues {@link Point}
*/
OverviewCustomResizableAnnotation.prototype.calcDragDistance = function (xyValues) {
var xAxis = this.xAxis;
var xCalc = xAxis.getCurrentCoordinateCalculator();
var yAxis = this.yAxis;
var yCalc = yAxis.getCurrentCoordinateCalculator();
var horizontalCalc = xAxis.isHorizontalAxis ? xCalc : yCalc;
var verticalCalc = yAxis.isHorizontalAxis ? xCalc : yCalc;
var _a = this.convertPointToAbsoluteCoordinates(new TypedPoint_1.TypedPoint(this.x1, this.y1), this.xCoordinateMode, this.yCoordinateMode), x1Coord = _a.x, y1Coord = _a.y;
var _b = this.convertPointToAbsoluteCoordinates(new TypedPoint_1.TypedPoint(this.x2, this.y2), this.xCoordinateMode, this.yCoordinateMode), x2Coord = _b.x, y2Coord = _b.y;
var xyCoordinates = this.convertPointToAbsoluteCoordinates(xyValues, this.xCoordinateMode, this.yCoordinateMode);
var isResizableHorizontally = this.isVerticalChart
? this.resizeDirections !== XyDirection_1.EXyDirection.XDirection
: this.resizeDirections !== XyDirection_1.EXyDirection.YDirection;
var isResizableVertically = this.isVerticalChart
? this.resizeDirections !== XyDirection_1.EXyDirection.YDirection
: this.resizeDirections !== XyDirection_1.EXyDirection.XDirection;
switch (this.adornerDraggingPoint) {
case AnnotationBase_1.EDraggingGripPoint.Body: {
if (!this.prevValue) {
this.prevValue = xyValues;
return;
}
// TODO currently this calculates diff in the target coordinate mode of the annotation;
// consider calculating always in Pixel or Absolute
// expected coordinates
var x1 = (this.x1 - (this.prevValue.x - xyValues.x));
var x2 = (this.x2 - (this.prevValue.x - xyValues.x));
var y1 = (this.y1 - (this.prevValue.y - xyValues.y));
var y2 = (this.y2 - (this.prevValue.y - xyValues.y));
var expectedX1Coord = (0, coordinates_1.convertToAbsoluteCoordinate)(x1, xCalc, this.xCoordinateMode);
var expectedX2Coord = (0, coordinates_1.convertToAbsoluteCoordinate)(x2, xCalc, this.xCoordinateMode);
var expectedY1Coord = (0, coordinates_1.convertToAbsoluteCoordinate)(y1, yCalc, this.yCoordinateMode);
var expectedY2Coord = (0, coordinates_1.convertToAbsoluteCoordinate)(y2, yCalc, this.yCoordinateMode);
var expectedX1DataValue = (0, coordinates_1.convertAbsoluteCoordinateToDataValue)(expectedX1Coord, xCalc);
var expectedX2DataValue = (0, coordinates_1.convertAbsoluteCoordinateToDataValue)(expectedX2Coord, xCalc);
var expectedY1DataValue = (0, coordinates_1.convertAbsoluteCoordinateToDataValue)(expectedY1Coord, yCalc);
var expectedY2DataValue = (0, coordinates_1.convertAbsoluteCoordinateToDataValue)(expectedY2Coord, yCalc);
var xVisibleRangeMinCoordinate = (0, coordinates_1.convertDataValueToAbsoluteCoordinate)(xAxis.visibleRange.min, xCalc);
var xVisibleRangeMaxCoordinate = (0, coordinates_1.convertDataValueToAbsoluteCoordinate)(xAxis.visibleRange.max, xCalc);
var yVisibleRangeMinCoordinate = (0, coordinates_1.convertDataValueToAbsoluteCoordinate)(yAxis.visibleRange.min, yCalc);
var yVisibleRangeMaxCoordinate = (0, coordinates_1.convertDataValueToAbsoluteCoordinate)(yAxis.visibleRange.max, yCalc);
var xVisibleRangeMinTargetValue = (0, coordinates_1.convertFromAbsoluteCoordinate)(xVisibleRangeMinCoordinate, xCalc, this.xCoordinateMode);
var xVisibleRangeMaxTargetValue = (0, coordinates_1.convertFromAbsoluteCoordinate)(xVisibleRangeMaxCoordinate, xCalc, this.xCoordinateMode);
var yVisibleRangeMinTargetValue = (0, coordinates_1.convertFromAbsoluteCoordinate)(yVisibleRangeMinCoordinate, yCalc, this.yCoordinateMode);
var yVisibleRangeMaxTargetValue = (0, coordinates_1.convertFromAbsoluteCoordinate)(yVisibleRangeMaxCoordinate, yCalc, this.yCoordinateMode);
// make sure annotation doesn't overflow the visible range
if (this.resizeDirections !== XyDirection_1.EXyDirection.YDirection) {
if (expectedX1DataValue < xAxis.visibleRange.min) {
// shift coordinate by a value that doesn't result into overflowing the visible range
var diff = (0, coordinates_1.subtractCoord)(expectedX1Coord, xVisibleRangeMinCoordinate);
this.x1 = xVisibleRangeMinTargetValue;
this.x2 = (0, coordinates_1.convertFromAbsoluteCoordinate)((0, coordinates_1.subtractCoord)(expectedX2Coord, diff), xCalc, this.xCoordinateMode);
}
else if (expectedX2DataValue > xAxis.visibleRange.max) {
var diff = (0, coordinates_1.subtractCoord)(xVisibleRangeMaxCoordinate, expectedX2Coord);
this.x1 = (0, coordinates_1.convertFromAbsoluteCoordinate)((0, coordinates_1.addCoord)(expectedX1Coord, diff), xCalc, this.xCoordinateMode);
this.x2 = xVisibleRangeMaxTargetValue;
}
else {
this.x1 = x1;
this.x2 = x2;
}
}
if (this.resizeDirections !== XyDirection_1.EXyDirection.XDirection) {
if (expectedY2DataValue > yAxis.visibleRange.max) {
var diff = (0, coordinates_1.subtractCoord)(expectedY2Coord, yVisibleRangeMaxCoordinate);
this.y2 = yVisibleRangeMaxTargetValue;
this.y1 = (0, coordinates_1.convertFromAbsoluteCoordinate)((0, coordinates_1.addCoord)(expectedY1Coord, diff), yCalc, this.yCoordinateMode);
}
else if (expectedY1DataValue < yAxis.visibleRange.min) {
var diff = (0, coordinates_1.subtractCoord)(expectedY1Coord, yVisibleRangeMinCoordinate);
this.y2 = (0, coordinates_1.convertFromAbsoluteCoordinate)((0, coordinates_1.subtractCoord)(expectedY2Coord, diff), yCalc, this.yCoordinateMode);
this.y1 = yVisibleRangeMinTargetValue;
}
else {
this.y1 = y1;
this.y2 = y2;
}
}
this.prevValue = xyValues;
break;
}
// left grab point
case AnnotationBase_1.EDraggingGripPoint.x1y1: {
if (isResizableHorizontally) {
if (horizontalCalc.hasFlippedCoordinates) {
this.adjustLeftSideToLimits(x2Coord, xyCoordinates, horizontalCalc);
}
else {
this.adjustLeftSideToLimits(x1Coord, xyCoordinates, horizontalCalc);
}
}
break;
}
// Right grab point
case AnnotationBase_1.EDraggingGripPoint.x2y2: {
if (isResizableHorizontally) {
if (horizontalCalc.hasFlippedCoordinates) {
this.adjustRightSideToLimits(x1Coord, xyCoordinates, horizontalCalc);
}
else {
this.adjustRightSideToLimits(x2Coord, xyCoordinates, horizontalCalc);
}
}
break;
}
// Top grab point
case AnnotationBase_1.EDraggingGripPoint.x2y1: {
if (isResizableVertically) {
if (verticalCalc.hasFlippedCoordinates) {
this.adjustTopSideToLimits(y2Coord, xyCoordinates, verticalCalc);
}
else {
this.adjustTopSideToLimits(y1Coord, xyCoordinates, verticalCalc);
}
}
break;
}
// Bottom grab point
case AnnotationBase_1.EDraggingGripPoint.x1y2: {
if (isResizableVertically) {
if (verticalCalc.hasFlippedCoordinates) {
this.adjustBottomSideToLimits(y1Coord, xyCoordinates, verticalCalc);
}
else {
this.adjustBottomSideToLimits(y2Coord, xyCoordinates, verticalCalc);
}
}
break;
}
default:
throw new Error("Unexpected adornerDraggingPoint value ".concat(this.adornerDraggingPoint));
}
};
/**
* @inheritDoc
*/
OverviewCustomResizableAnnotation.prototype.create = function (xCalc, yCalc, xCoordSvgTrans, yCoordSvgTrans) {
if (this.svg) {
return;
}
var clippedSvgString = this.applyClipping(this.svgString, this.clipping);
this.setSvg(annotationHelpers_1.annotationHelpers.createSvg(clippedSvgString, this.svgRoot, this.nextSibling));
// @ts-ignore
var svgRect = this.svg.getBBox();
var x1Coord = this.getX1Coordinate(xCalc, yCalc);
var y1Coord = this.getY1Coordinate(xCalc, yCalc);
// set default x2 and y2 values defined by the SVG size if custom ones are not set
if (this.isVerticalChart) {
if (this.x2 === undefined) {
this.x2 = this.getValue(x1Coord + svgRect.width, xCalc, AnnotationBase_1.ECoordinateMode.Pixel);
}
if (this.y2 === undefined) {
this.y2 = this.getValue(y1Coord + svgRect.height, yCalc, AnnotationBase_1.ECoordinateMode.Pixel);
}
}
else {
if (this.x2 === undefined) {
this.x2 = this.getValue(y1Coord + svgRect.height, xCalc, AnnotationBase_1.ECoordinateMode.Pixel);
}
if (this.y2 === undefined) {
this.y2 = this.getValue(x1Coord + svgRect.width, yCalc, AnnotationBase_1.ECoordinateMode.Pixel);
}
}
var x2Coord = this.getX2Coordinate(xCalc, yCalc);
var y2Coord = this.getY2Coordinate(xCalc, yCalc);
// adjust svg to size limits
var actualWidth = Math.abs(x2Coord - x1Coord);
var actualHeight = Math.abs(y2Coord - y1Coord);
if (this.isVerticalChart) {
if (actualWidth < this.minWidth) {
var horizontalCoordinateCalc = this.isVerticalChart ? yCalc : xCalc;
this.y2 = this.getValue(x1Coord + this.minWidth, horizontalCoordinateCalc, AnnotationBase_1.ECoordinateMode.Pixel);
}
if (actualHeight < this.minHeight) {
var verticalCoordinateCalc = this.isVerticalChart ? xCalc : yCalc;
this.x2 = this.getValue(y1Coord + this.minHeight, verticalCoordinateCalc, AnnotationBase_1.ECoordinateMode.Pixel);
}
}
else {
if (actualWidth < this.minWidth) {
var horizontalCoordinateCalc = this.isVerticalChart ? yCalc : xCalc;
this.x2 = this.getValue(x1Coord + this.minWidth, horizontalCoordinateCalc, AnnotationBase_1.ECoordinateMode.Pixel);
}
if (actualHeight < this.minHeight) {
var verticalCoordinateCalc = this.isVerticalChart ? xCalc : yCalc;
this.y2 = this.getValue(y1Coord + this.minHeight, verticalCoordinateCalc, AnnotationBase_1.ECoordinateMode.Pixel);
}
}
};
/**
* Creates or updates an adorner for the annotation
*/
OverviewCustomResizableAnnotation.prototype.updateAdornerInner = function () {
this.deleteAdorner();
if (this.adornerSvgStringTemplate) {
var _a = this.getAdornerAnnotationBorders(true), x1 = _a.x1, x2 = _a.x2, y1 = _a.y1, y2 = _a.y2;
var svgString = this.adornerSvgStringTemplate(x1, y1, x2, y2);
var clippedSvgString = this.applySvgClipping(svgString, this.adornerClipping);
this.svgAdorner = annotationHelpers_1.annotationHelpers.createSvg(clippedSvgString, this.svgAdornerRoot);
}
};
OverviewCustomResizableAnnotation.prototype.checkIsClickedOnAnnotationInternal = function (x, y) {
var _a = this.getAnnotationBorders(true), x1 = _a.x1, x2 = _a.x2, y1 = _a.y1, y2 = _a.y2;
var xMousePoint = (0, translate_1.translateToNotScaled)(x);
var yMousePoint = (0, translate_1.translateToNotScaled)(y);
if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x1, y2, x2, y1)) {
return true;
}
var isResizableHorizontally = this.isVerticalChart
? this.resizeDirections !== XyDirection_1.EXyDirection.XDirection
: this.resizeDirections !== XyDirection_1.EXyDirection.YDirection;
var isResizableVertically = this.isVerticalChart
? this.resizeDirections !== XyDirection_1.EXyDirection.YDirection
: this.resizeDirections !== XyDirection_1.EXyDirection.XDirection;
if (isResizableHorizontally) {
// Left
if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x1 - constants_1.ADORNER_GRIP_RADIUS, y2, x1 + constants_1.ADORNER_GRIP_RADIUS, y1)) {
return true;
}
else if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x2 - constants_1.ADORNER_GRIP_RADIUS, y2, x2 + constants_1.ADORNER_GRIP_RADIUS, y1)) {
// Right
return true;
}
}
// Top
if (isResizableVertically) {
if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x1, y1 + constants_1.ADORNER_GRIP_RADIUS, x2, y1 - constants_1.ADORNER_GRIP_RADIUS)) {
return true;
}
else if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x1, y2 + constants_1.ADORNER_GRIP_RADIUS, x2, y2 - constants_1.ADORNER_GRIP_RADIUS)) {
// Bottom
return true;
}
}
return false;
};
/** @inheritDoc */
OverviewCustomResizableAnnotation.prototype.onAttach = function (scs) {
_super.prototype.onAttach.call(this, scs);
this.attachCursorListeners();
};
/** @inheritDoc */
OverviewCustomResizableAnnotation.prototype.onDetach = function () {
this.detachCursorListeners();
_super.prototype.onDetach.call(this);
};
/** @inheritDoc */
OverviewCustomResizableAnnotation.prototype.onDragEnded = function () {
_super.prototype.onDragEnded.call(this);
this.applyCursor(CursorStyle_1.ECursorStyle.Default);
};
OverviewCustomResizableAnnotation.prototype.adjustLeftSideToLimits = function (x2Coord, expectedLeftPoint, horizontalCalc) {
var expectedLeftCoord = expectedLeftPoint.x;
var expectedAbsoluteX1Coord = adjustToViewport(expectedLeftCoord, horizontalCalc);
var satisfiesMinWidth = x2Coord - expectedAbsoluteX1Coord >= (0, translate_1.translateToScaled)(this.minWidth);
var adjustedCoordinate = satisfiesMinWidth
? expectedAbsoluteX1Coord
: x2Coord - (0, translate_1.translateToScaled)(this.minWidth);
var adjustedTargetValue = (0, coordinates_1.convertFromAbsoluteCoordinate)(adjustedCoordinate, horizontalCalc, this.isVerticalChart ? this.yCoordinateMode : this.xCoordinateMode);
if (this.isVerticalChart) {
if (horizontalCalc.hasFlippedCoordinates) {
this.y1 = adjustedTargetValue;
}
else {
this.y2 = adjustedTargetValue;
}
}
else {
if (horizontalCalc.hasFlippedCoordinates) {
this.x1 = adjustedTargetValue;
}
else {
this.x2 = adjustedTargetValue;
}
}
};
OverviewCustomResizableAnnotation.prototype.adjustRightSideToLimits = function (x1Coord, expectedRightPoint, horizontalCalc) {
var expectedRightCoord = expectedRightPoint.x;
var expectedAbsoluteX2Coord = adjustToViewport(expectedRightCoord, horizontalCalc);
var satisfiesMinWidth = expectedAbsoluteX2Coord - x1Coord >= (0, translate_1.translateToScaled)(this.minWidth);
var adjustedCoordinate = satisfiesMinWidth
? expectedAbsoluteX2Coord
: x1Coord + (0, translate_1.translateToScaled)(this.minWidth);
var adjustedTargetValue = (0, coordinates_1.convertFromAbsoluteCoordinate)(adjustedCoordinate, horizontalCalc, this.isVerticalChart ? this.yCoordinateMode : this.xCoordinateMode);
if (this.isVerticalChart) {
if (horizontalCalc.hasFlippedCoordinates) {
this.y2 = adjustedTargetValue;
}
else {
this.y1 = adjustedTargetValue;
}
}
else {
if (horizontalCalc.hasFlippedCoordinates) {
this.x2 = adjustedTargetValue;
}
else {
this.x1 = adjustedTargetValue;
}
}
};
OverviewCustomResizableAnnotation.prototype.adjustTopSideToLimits = function (y2Coord, expectedTopPoint, verticalCalc) {
var expectedTopCoord = expectedTopPoint.y;
var expectedY1AbsoluteCoord = adjustToViewport(expectedTopCoord, verticalCalc);
var satisfiesMinHeight = y2Coord - expectedY1AbsoluteCoord >= (0, translate_1.translateToScaled)(this.minHeight);
var adjustedCoordinate = satisfiesMinHeight
? expectedY1AbsoluteCoord
: y2Coord - (0, translate_1.translateToScaled)(this.minHeight);
var adjustedTargetValue = this.convertFromCoordinate(adjustedCoordinate, verticalCalc, this.isVerticalChart ? this.xCoordinateMode : this.yCoordinateMode);
if (this.isVerticalChart) {
if (verticalCalc.hasFlippedCoordinates) {
this.x1 = adjustedTargetValue;
}
else {
this.x2 = adjustedTargetValue;
}
}
else {
if (verticalCalc.hasFlippedCoordinates) {
this.y1 = adjustedTargetValue;
}
else {
this.y2 = adjustedTargetValue;
}
}
};
OverviewCustomResizableAnnotation.prototype.adjustBottomSideToLimits = function (y1Coord, expectedBottomPoint, verticalCalc) {
var expectedBottomCoord = expectedBottomPoint.y;
var expectedY2AbsoluteCoord = adjustToViewport(expectedBottomCoord, verticalCalc);
var satisfiesMinHeight = expectedY2AbsoluteCoord - y1Coord >= (0, translate_1.translateToScaled)(this.minHeight);
var adjustedCoordinate = satisfiesMinHeight
? expectedY2AbsoluteCoord
: y1Coord + (0, translate_1.translateToScaled)(this.minHeight);
var adjustedTargetValue = this.convertFromCoordinate(adjustedCoordinate, verticalCalc, this.isVerticalChart ? this.xCoordinateMode : this.yCoordinateMode);
if (this.isVerticalChart) {
if (verticalCalc.hasFlippedCoordinates) {
this.x2 = adjustedTargetValue;
}
else {
this.x1 = adjustedTargetValue;
}
}
else {
if (verticalCalc.hasFlippedCoordinates) {
this.y2 = adjustedTargetValue;
}
else {
this.y1 = adjustedTargetValue;
}
}
};
OverviewCustomResizableAnnotation.prototype.convertPointToAbsoluteCoordinates = function (point, inputValueXCoordinateMode, inputValueYCoordinateMode) {
var xAxis = this.xAxis;
var xCalc = xAxis.getCurrentCoordinateCalculator();
var yAxis = this.yAxis;
var yCalc = yAxis.getCurrentCoordinateCalculator();
var coord1 = (0, coordinates_1.convertToAbsoluteCoordinate)(point.x, xCalc, inputValueXCoordinateMode);
var coord2 = (0, coordinates_1.convertToAbsoluteCoordinate)(point.y, yCalc, inputValueYCoordinateMode);
return this.isVerticalChart ? new TypedPoint_1.TypedPoint(coord2, coord1) : new TypedPoint_1.TypedPoint(coord1, coord2);
};
OverviewCustomResizableAnnotation.prototype.resolveDragPointFromMousePoint = function (mousePoint) {
var _a = this.getAnnotationBorders(true), x1 = _a.x1, x2 = _a.x2, y1 = _a.y1, y2 = _a.y2;
var xyMousePoint = (0, translate_1.translateFromCanvasToSeriesViewRect)(new TypedPoint_1.TypedPoint(mousePoint.x, mousePoint.y), this.parentSurface.seriesViewRect, true);
if (!xyMousePoint) {
return undefined;
}
var xMousePoint = (0, translate_1.translateToNotScaled)(xyMousePoint.x);
var yMousePoint = (0, translate_1.translateToNotScaled)(xyMousePoint.y);
var isResizableHorizontally = this.isVerticalChart
? this.resizeDirections !== XyDirection_1.EXyDirection.XDirection
: this.resizeDirections !== XyDirection_1.EXyDirection.YDirection;
var isResizableVertically = this.isVerticalChart
? this.resizeDirections !== XyDirection_1.EXyDirection.YDirection
: this.resizeDirections !== XyDirection_1.EXyDirection.XDirection;
if (isResizableHorizontally) {
if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x1 - constants_1.ADORNER_GRIP_RADIUS, y2, x1 + constants_1.ADORNER_GRIP_RADIUS, y1)) {
return AnnotationBase_1.EDraggingGripPoint.x1y1;
}
if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x2 - constants_1.ADORNER_GRIP_RADIUS, y2, x2 + constants_1.ADORNER_GRIP_RADIUS, y1)) {
return AnnotationBase_1.EDraggingGripPoint.x2y2;
}
}
if (isResizableVertically) {
if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x1, y1 + constants_1.ADORNER_GRIP_RADIUS, x2, y1 - constants_1.ADORNER_GRIP_RADIUS)) {
return AnnotationBase_1.EDraggingGripPoint.x2y1;
}
if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x1, y2 + constants_1.ADORNER_GRIP_RADIUS, x2, y2 - constants_1.ADORNER_GRIP_RADIUS)) {
return AnnotationBase_1.EDraggingGripPoint.x1y2;
}
}
if ((0, pointUtil_1.testIsInBounds)(xMousePoint, yMousePoint, x1, y2, x2, y1)) {
return AnnotationBase_1.EDraggingGripPoint.Body;
}
return undefined;
};
OverviewCustomResizableAnnotation.prototype.getCursorForDragPoint = function (dragPoint) {
switch (dragPoint) {
case AnnotationBase_1.EDraggingGripPoint.x1y1:
case AnnotationBase_1.EDraggingGripPoint.x2y2:
case AnnotationBase_1.EDraggingGripPoint.x2y1:
case AnnotationBase_1.EDraggingGripPoint.x1y2:
return this.isVerticalChart ? CursorStyle_1.ECursorStyle.Row : CursorStyle_1.ECursorStyle.Col;
case AnnotationBase_1.EDraggingGripPoint.Body:
return CursorStyle_1.ECursorStyle.Move;
default:
return CursorStyle_1.ECursorStyle.Default;
}
};
OverviewCustomResizableAnnotation.prototype.attachCursorListeners = function () {
if (!this.isEditable) {
return;
}
var host = this.getCursorHostElement();
if (!host || this.cursorHostElement === host) {
return;
}
this.detachCursorListeners();
host.addEventListener("pointermove", this.onPointerMove);
host.addEventListener("pointerleave", this.onPointerLeave);
this.cursorHostElement = host;
};
OverviewCustomResizableAnnotation.prototype.detachCursorListeners = function () {
if (!this.cursorHostElement) {
return;
}
this.cursorHostElement.removeEventListener("pointermove", this.onPointerMove);
this.cursorHostElement.removeEventListener("pointerleave", this.onPointerLeave);
this.cursorHostElement = undefined;
};
OverviewCustomResizableAnnotation.prototype.getCursorHostElement = function () {
var _a, _b, _c, _d;
return (_c = (_b = (_a = this.parentSurface) === null || _a === void 0 ? void 0 : _a.getMainCanvas) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : (_d = this.parentSurface) === null || _d === void 0 ? void 0 : _d.domDivContainer;
};
OverviewCustomResizableAnnotation.prototype.applyCursor = function (cursor) {
var _a;
var host = (_a = this.cursorHostElement) !== null && _a !== void 0 ? _a : this.getCursorHostElement();
if (host) {
host.style.cursor = cursor;
}
};
return OverviewCustomResizableAnnotation;
}(CustomAnnotation_1.CustomAnnotation));
exports.OverviewCustomResizableAnnotation = OverviewCustomResizableAnnotation;
/** @ignore */
var adjustToViewport = function (coordinate, calc) {
if (coordinate <= 0) {
return 0;
}
if (coordinate >= calc.viewportDimension) {
return calc.viewportDimension;
}
return coordinate;
};