scichart
Version:
Fast WebGL JavaScript Charting Library and Framework
299 lines (298 loc) • 17 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.PolarArcAnnotation = void 0;
var Guard_1 = require("../../../Core/Guard");
var SurfaceType_1 = require("../../../types/SurfaceType");
var XyDirection_1 = require("../../../types/XyDirection");
var pointUtil_1 = require("../../../utils/pointUtil");
var Pen2DCache_1 = require("../../Drawing/Pen2DCache");
var NativeObject_1 = require("../Helpers/NativeObject");
var DpiHelper_1 = require("../TextureManager/DpiHelper");
var AnnotationBase_1 = require("./AnnotationBase");
var ArcAnnotationBase_1 = require("./ArcAnnotationBase");
var constants_1 = require("./constants");
var IAnnotation_1 = require("./IAnnotation");
/**
* Does not support flipped radial axis
*/
var PolarArcAnnotation = /** @class */ (function (_super) {
__extends(PolarArcAnnotation, _super);
function PolarArcAnnotation(options) {
var _this = this;
var _a, _b;
_this = _super.call(this, options) || this;
_this.type = IAnnotation_1.EAnnotationType.RenderContextPolarArcAnnotation;
_this.surfaceTypes = [SurfaceType_1.ESurfaceType.SciChartPolarSurfaceType];
_this.centerXProperty = (_a = options === null || options === void 0 ? void 0 : options.centerX) !== null && _a !== void 0 ? _a : _this.centerXProperty;
_this.centerYProperty = (_b = options === null || options === void 0 ? void 0 : options.centerY) !== null && _b !== void 0 ? _b : _this.centerYProperty;
return _this;
}
Object.defineProperty(PolarArcAnnotation.prototype, "centerX", {
get: function () {
var _a;
return (_a = this.centerXProperty) !== null && _a !== void 0 ? _a : this.xAxis.visibleRange.min;
},
set: function (value) {
if (value !== this.centerXProperty) {
this.centerXProperty = value;
this.notifyPropertyChanged(constants_1.PROPERTY.CENTER_X);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(PolarArcAnnotation.prototype, "centerY", {
get: function () {
var _a;
return (_a = this.centerYProperty) !== null && _a !== void 0 ? _a : this.yAxis.visibleRange.min;
},
set: function (value) {
if (value !== this.centerYProperty) {
this.centerYProperty = value;
this.notifyPropertyChanged(constants_1.PROPERTY.CENTER_Y);
}
},
enumerable: false,
configurable: true
});
PolarArcAnnotation.prototype.drawWithContext = function (renderContext, xCalc, yCalc, seriesViewRect, surfaceViewRect, chartViewRect) {
var _a, _b, _c, _d;
Guard_1.Guard.notNull(renderContext, "renderContext");
Guard_1.Guard.notNull(xCalc, "xCalc");
Guard_1.Guard.notNull(yCalc, "yCalc");
var strokePen = this.stroke && this.strokeThickness !== undefined ? (0, Pen2DCache_1.getWebGlPenFromCache)(this.strokePenCache) : undefined;
var rotation = 0;
var x1 = this.getAngleSign() * this.getX1Coordinate(xCalc, yCalc);
var x2 = this.getAngleSign() * this.getX2Coordinate(xCalc, yCalc);
var y1 = this.getY1Coordinate(xCalc, yCalc);
var point1Cartesian = this.convertPolarToCartesian(x1, y1, false);
var point2Cartesian = this.convertPolarToCartesian(x2, y1, false);
var xAxis = this.xAxis;
var yAxis = this.yAxis;
var xMin = xAxis.visibleRange.min;
var yMin = yAxis.visibleRange.min;
var centerPolarX = this.getResolvedCoordinate(xCalc, yCalc, xMin, yMin, true);
var centerPolarY = this.getResolvedCoordinate(xCalc, yCalc, xMin, yMin, false);
var centerCartesian = this.convertPolarToCartesian(centerPolarX, centerPolarY, false);
var annotationCenterPolarX = this.getResolvedCoordinate(xCalc, yCalc, this.centerX, this.centerY, true);
var annotationCenterPolarY = this.getResolvedCoordinate(xCalc, yCalc, this.centerX, this.centerY, false);
var annotationCenterCartesian = this.convertPolarToCartesian(annotationCenterPolarX, annotationCenterPolarY, false);
var xOffset = annotationCenterCartesian.x - centerCartesian.x;
var yOffset = annotationCenterCartesian.y - centerCartesian.y;
rotation = this.isVerticalChart ? yAxis.startAngle : xAxis.startAngle;
var wasmContext = renderContext.webAssemblyContext;
var vecArcs = (0, NativeObject_1.getVectorArcVertex)(wasmContext);
var arc = (0, NativeObject_1.getArcVertex)(wasmContext);
var leftPad = ((_b = (_a = this.parentSurface.padding) === null || _a === void 0 ? void 0 : _a.left) !== null && _b !== void 0 ? _b : 0) * DpiHelper_1.DpiHelper.PIXEL_RATIO;
var topPad = ((_d = (_c = this.parentSurface.padding) === null || _c === void 0 ? void 0 : _c.top) !== null && _d !== void 0 ? _d : 0) * DpiHelper_1.DpiHelper.PIXEL_RATIO;
var transAngles = this.transformAngles(x1, x2, this.isVerticalChart, xCalc.isFlipped, yCalc.isFlipped);
var _e = this.normalizeAnglesAndHitTest(transAngles.startAngle, transAngles.endAngle), startAngle = _e.startAngle, endAngle = _e.endAngle;
var rotCenterX = annotationCenterCartesian.x;
var rotCenterY = this.getViewportHeight() - annotationCenterCartesian.y;
var arcParms = (0, NativeObject_1.getArcParams)(wasmContext, rotCenterX, rotCenterY, startAngle, endAngle, this.getRadius(xCalc, yCalc), this.getInnerRadius(xCalc, yCalc), this.getDrawMode() ? 1 : 0, 1, this.strokeThickness);
arc.MakeCircularArc(arcParms);
vecArcs.push_back(arc);
var clipRect = this.getClippingRect(this.clipping, seriesViewRect, surfaceViewRect, chartViewRect);
renderContext.drawArcs(vecArcs, rotCenterX, rotCenterY, rotation, clipRect, strokePen.scrtPen, this.getBrush(), leftPad, topPad);
this.setArcAnnotationBorders(point1Cartesian.x + xOffset, point2Cartesian.x + xOffset, annotationCenterCartesian.x, point1Cartesian.y + yOffset, point2Cartesian.y + yOffset, annotationCenterCartesian.y);
this.updateAdornerInner();
};
PolarArcAnnotation.prototype.calcDragDistance = function (xyValues) {
var xAxis = this.xAxis;
var yAxis = this.yAxis;
if (!this.prevValue) {
this.prevValue = xyValues;
return;
}
if (this.adornerDraggingPoint === AnnotationBase_1.EDraggingGripPoint.Body) {
if (this.resizeDirections !== XyDirection_1.EXyDirection.YDirection) {
this.x1 = this.x1 - this.multByPixelRatio(this.prevValue.x - xyValues.x, xAxis);
this.x2 = this.x2 - this.multByPixelRatio(this.prevValue.x - xyValues.x, xAxis);
}
if (this.resizeDirections !== XyDirection_1.EXyDirection.XDirection) {
this.y1 = this.y1 - this.multByPixelRatio(this.prevValue.y - xyValues.y, yAxis);
this.y2 = this.y2 - this.multByPixelRatio(this.prevValue.y - xyValues.y, yAxis);
}
}
else if (this.adornerDraggingPoint === AnnotationBase_1.EDraggingGripPoint.x1y1) {
if (this.resizeDirections !== XyDirection_1.EXyDirection.YDirection) {
this.x1 -= this.multByPixelRatio(this.prevValue.x - xyValues.x, xAxis);
}
if (this.resizeDirections !== XyDirection_1.EXyDirection.XDirection) {
this.y1 -= this.multByPixelRatio(this.prevValue.y - xyValues.y, yAxis);
}
}
else if (this.adornerDraggingPoint === AnnotationBase_1.EDraggingGripPoint.x2y2) {
if (this.resizeDirections !== XyDirection_1.EXyDirection.YDirection) {
this.x2 -= this.multByPixelRatio(this.prevValue.x - xyValues.x, xAxis);
}
if (this.resizeDirections !== XyDirection_1.EXyDirection.XDirection) {
this.y2 -= this.multByPixelRatio(this.prevValue.y - xyValues.y, yAxis);
}
}
if (this.adornerDraggingPoint === AnnotationBase_1.EDraggingGripPoint.x3y3) {
this.centerX = this.multByPixelRatio(xyValues.x, xAxis, true);
this.centerY = this.multByPixelRatio(xyValues.y, yAxis, true);
}
this.validateInnerRadius();
this.prevValue = xyValues;
};
PolarArcAnnotation.prototype.toJSON = function () {
var json = _super.prototype.toJSON.call(this);
var options = {
centerX: this.centerX,
centerY: this.centerY
};
Object.assign(json.options, options);
return json;
};
PolarArcAnnotation.prototype.onDragStarted = function (args) {
_super.prototype.onDragStarted.call(this, args);
var _a = this.getArcAnnotationBorders(true), x1 = _a.x1, x2 = _a.x2, xCenter = _a.xCenter, y1 = _a.y1, y2 = _a.y2, yCenter = _a.yCenter;
var canvasMouseX = args.mousePoint.x;
var canvasMouseY = args.mousePoint.y;
if (this.canDragPoint(AnnotationBase_1.EDraggingGripPoint.x1y1)) {
var dist = (0, pointUtil_1.calcDistance)(x1, y1, canvasMouseX, canvasMouseY);
if (dist < this.annotationsGripsRadius * DpiHelper_1.DpiHelper.PIXEL_RATIO) {
this.adornerDraggingPoint = AnnotationBase_1.EDraggingGripPoint.x1y1;
return true;
}
}
if (this.canDragPoint(AnnotationBase_1.EDraggingGripPoint.x2y2)) {
var xi = (x2 + xCenter) / 2;
var yi = (y2 + yCenter) / 2;
var dist = (0, pointUtil_1.calcDistance)(xi, yi, canvasMouseX, canvasMouseY);
if (dist < this.annotationsGripsRadius * DpiHelper_1.DpiHelper.PIXEL_RATIO) {
this.adornerDraggingPoint = AnnotationBase_1.EDraggingGripPoint.x2y2;
return true;
}
}
if (this.canDragPoint(AnnotationBase_1.EDraggingGripPoint.x3y3)) {
var dist = (0, pointUtil_1.calcDistance)(xCenter, yCenter, canvasMouseX, canvasMouseY);
if (dist < this.annotationsGripsRadius * DpiHelper_1.DpiHelper.PIXEL_RATIO) {
this.adornerDraggingPoint = AnnotationBase_1.EDraggingGripPoint.x3y3;
return true;
}
}
if (this.canDragPoint(AnnotationBase_1.EDraggingGripPoint.Body)) {
if (this.clickToSelect(args)) {
this.adornerDraggingPoint = AnnotationBase_1.EDraggingGripPoint.Body;
return true;
}
}
return false;
};
/**
* Hit-test annotation clicked
* @param xCoord
* @param yCoord
* @returns
*/
PolarArcAnnotation.prototype.checkIsClickedOnAnnotationInternal = function (xCoord, yCoord) {
var _a = this.getArcAnnotationBorders(), x1 = _a.x1, x2 = _a.x2, y1 = _a.y1, y2 = _a.y2, xCenter = _a.xCenter, yCenter = _a.yCenter;
if ((0, pointUtil_1.calcDistance)(xCoord, yCoord, x1, y1) <= constants_1.DISTANCE_TO_LINE * DpiHelper_1.DpiHelper.PIXEL_RATIO)
return true;
if ((0, pointUtil_1.calcDistance)(xCoord, yCoord, x2, y2) <= constants_1.DISTANCE_TO_LINE * DpiHelper_1.DpiHelper.PIXEL_RATIO)
return true;
if ((0, pointUtil_1.calcDistance)(xCoord, yCoord, xCenter, yCenter) <= constants_1.DISTANCE_TO_LINE)
return true;
var coordRadius = (0, pointUtil_1.calcDistance)(x1, y1, xCenter, yCenter);
var isWithInRadius = (0, pointUtil_1.calcDistance)(xCoord, yCoord, xCenter, yCenter) < coordRadius;
var _b = this.transformAngles(this.calcAngleFromCoordinates(xCenter, yCenter, x1, y1), this.calcAngleFromCoordinates(xCenter, yCenter, x2, y2), this.isVerticalChart, this.xAxis.getCurrentCoordinateCalculator().isFlipped, this.yAxis.getCurrentCoordinateCalculator().isFlipped), startAngle = _b.startAngle, endAngle = _b.endAngle;
var hitAngle = this.calcAngleFromCoordinates(xCenter, yCenter, xCoord, yCoord);
var isWithInAngle = this.normalizeAnglesAndHitTest(startAngle, endAngle, hitAngle).isHit;
var isWithInSector = isWithInRadius && isWithInAngle;
var isWithInTriangle = (0, pointUtil_1.testPointInTriangle)(xCoord, yCoord, x1, y1, x2, y2, xCenter, yCenter);
return isWithInSector || isWithInTriangle;
};
PolarArcAnnotation.prototype.svgStringArcAdornerTemplate = function (x1, y1, x2, y2, xCenter, yCenter) {
var colorLine = this.selectionBoxStroke;
var xi = (x2 + xCenter) / 2;
var yi = (y2 + yCenter) / 2;
return "<svg xmlns=\"http://www.w3.org/2000/svg\">\n <line x1=\"".concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"6\" />\n <line x1=\"").concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(xCenter, "\" y2=\"").concat(yCenter, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"6\" />\n <line x1=\"").concat(xCenter, "\" y1=\"").concat(yCenter, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"6\" />\n ").concat(this.canDragPoint(AnnotationBase_1.EDraggingGripPoint.x1y1) ? this.getAnnotationGripSvg(x1, y1) : "", "\n ").concat(this.canDragPoint(AnnotationBase_1.EDraggingGripPoint.x2y2) ? this.getAnnotationGripSvg(xi, yi) : "", "\n ").concat(this.getAnnotationGripSvg(xCenter, yCenter), "\n </svg>");
};
PolarArcAnnotation.prototype.getRadius = function (xCalc, yCalc) {
return this.getY1Coordinate(xCalc, yCalc);
};
PolarArcAnnotation.prototype.getInnerRadius = function (xCalc, yCalc) {
if (this.isLineMode) {
return 0;
}
else {
return this.getY2Coordinate(xCalc, yCalc);
}
};
PolarArcAnnotation.prototype.calcAngleFromCoordinates = function (centerX, centerY, x, y) {
return -Math.atan2(y - centerY, x - centerX);
};
PolarArcAnnotation.prototype.transformAngles = function (startAngle, endAngle, isVertical, isXFlipped, isYFlipped) {
var s = this.isDataValueMode() ? startAngle : startAngle / DpiHelper_1.DpiHelper.PIXEL_RATIO;
var e = this.isDataValueMode() ? endAngle : endAngle / DpiHelper_1.DpiHelper.PIXEL_RATIO;
if (isVertical) {
if (isYFlipped) {
return { startAngle: e, endAngle: s };
}
}
else {
if (isXFlipped) {
return { startAngle: e, endAngle: s };
}
}
return { startAngle: s, endAngle: e };
};
PolarArcAnnotation.prototype.multByPixelRatio = function (v, axis, ignoreDirection) {
if (ignoreDirection === void 0) { ignoreDirection = false; }
if (axis.isAngular && !this.isDataValueMode()) {
var direction = 1;
if (!ignoreDirection && axis.getCurrentCoordinateCalculator().isFlipped) {
direction = -1;
}
return direction * DpiHelper_1.DpiHelper.PIXEL_RATIO * v;
}
return v;
};
PolarArcAnnotation.prototype.validateInnerRadius = function () {
if (this.isVerticalChart) {
if (this.x1 < this.x2) {
this.x2 = this.x1;
}
}
else {
if (this.y1 < this.y2) {
this.y2 = this.y1;
}
}
};
PolarArcAnnotation.prototype.getAngleSign = function () {
if (this.isDataValueMode()) {
return 1;
}
else {
var xAxis = this.xAxis;
if (xAxis.isAngular) {
return xAxis.getCurrentCoordinateCalculator().isFlipped ? -1 : 1;
}
else {
var yAxis = this.yAxis;
return yAxis.getCurrentCoordinateCalculator().isFlipped ? -1 : 1;
}
}
};
return PolarArcAnnotation;
}(ArcAnnotationBase_1.ArcAnnotationBase));
exports.PolarArcAnnotation = PolarArcAnnotation;