@visactor/vchart
Version:
charts lib based @visactor/VGrammar
144 lines (137 loc) • 8.45 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.registerGaugePointerSeries = exports.GaugePointerSeries = void 0;
const vutils_1 = require("@visactor/vutils"), type_1 = require("../interface/type"), utils_1 = require("../../animation/utils"), progress_like_1 = require("../polar/progress-like"), path_1 = require("../../mark/path"), rect_1 = require("../../mark/rect"), constant_1 = require("./constant"), factory_1 = require("../../core/factory"), animation_1 = require("./animation"), gauge_pointer_transformer_1 = require("./gauge-pointer-transformer"), polar_1 = require("../../component/axis/polar"), pointer_tooltip_helper_1 = require("./pointer-tooltip-helper"), gauge_pointer_1 = require("../../theme/builtin/common/series/gauge-pointer");
class GaugePointerSeries extends progress_like_1.ProgressLikeSeries {
constructor() {
super(...arguments), this.type = type_1.SeriesTypeEnum.gaugePointer, this.transformerConstructor = gauge_pointer_transformer_1.GaugePointerSeriesSpecTransformer,
this._pinMark = null, this._pointerMark = null, this._pinBackgroundMark = null;
}
setAttrFromSpec() {
var _a;
super.setAttrFromSpec(), this.setRadiusField(this._spec.radiusField), this._pointerType = "rect" === (null === (_a = this._spec.pointer) || void 0 === _a ? void 0 : _a.type) ? "rect" : "path";
}
initMark() {
this._pinBackgroundMark = this._createMark(GaugePointerSeries.mark.pinBackground),
this._pointerMark = this._createMark(Object.assign(Object.assign({}, GaugePointerSeries.mark.pointer), {
type: this._pointerType
}), {
isSeriesMark: !0
}), this._pinMark = this._createMark(GaugePointerSeries.mark.pin);
}
initMarkStyle() {
this.initPinBackgroundMarkStyle(), this.initPointerMarkStyle(), this.initPinMarkStyle();
}
initGroups() {}
initPointerMarkStyle() {
const pointerMark = this._pointerMark, pointerSpec = this._spec.pointer;
pointerMark && (this.setMarkStyle(pointerMark, {
x: datum => {
var _a, _b;
const {x: x} = this._getPointerAnchor(datum, pointerSpec);
return x - this._getPointerWidth() * (null !== (_b = null === (_a = null == pointerSpec ? void 0 : pointerSpec.center) || void 0 === _a ? void 0 : _a[0]) && void 0 !== _b ? _b : 0);
},
y: datum => {
var _a, _b;
const {y: y} = this._getPointerAnchor(datum, pointerSpec);
return y - this._getPointerHeight(datum) * (null !== (_b = null === (_a = null == pointerSpec ? void 0 : pointerSpec.center) || void 0 === _a ? void 0 : _a[1]) && void 0 !== _b ? _b : 0);
},
anchor: datum => {
const {x: x, y: y} = this._getPointerAnchor(datum, pointerSpec);
return [ x, y ];
},
fill: this.getColorAttribute(),
zIndex: 200
}), "path" === this._pointerType ? this.setMarkStyle(pointerMark, {
scaleX: this._getPointerWidth.bind(this),
scaleY: this._getPointerHeight.bind(this),
angle: datum => this._getPointerAngle(datum) + Math.PI / 2
}) : this.setMarkStyle(pointerMark, {
width: this._getPointerWidth.bind(this),
height: this._getPointerHeight.bind(this),
angle: datum => this._getPointerAngle(datum) - Math.PI / 2
}));
}
initTooltip() {
this._tooltipHelper = new pointer_tooltip_helper_1.GaugePointerTooltipHelper(this),
this._pointerMark && this._tooltipHelper.activeTriggerSet.mark.add(this._pointerMark);
}
_getPointerAnchor(datum, markSpec) {
var _a;
return null === (_a = markSpec.isOnCenter) || void 0 === _a || _a ? this.angleAxisHelper.center() : this.radiusAxisHelper.coordToPoint({
radius: this._innerRadius * this._computeLayoutRadius(),
angle: this.angleAxisHelper.dataToPosition([ datum[this._angleField[0]] ])
});
}
_getPointerWidth() {
return this._spec.pointer.width * this._computeLayoutRadius();
}
_getPointerHeight(datum) {
var _a, _b;
const pointerSpec = this._spec.pointer, radiusField = this._radiusField[0];
return (0, vutils_1.isValid)(this.radiusAxisHelper) && (0, vutils_1.isValid)(radiusField) ? this.radiusAxisHelper.dataToPosition([ datum[radiusField] ]) - (null !== (_a = null == pointerSpec ? void 0 : pointerSpec.innerPadding) && void 0 !== _a ? _a : 0) - (null !== (_b = null == pointerSpec ? void 0 : pointerSpec.outerPadding) && void 0 !== _b ? _b : 10) : pointerSpec.height * this._computeLayoutRadius();
}
_getPointerAngle(datum) {
const domain = this.angleAxisHelper.getScale().domain(), max = (0, vutils_1.maxInArray)(domain), min = (0,
vutils_1.minInArray)(domain), angle = (0, vutils_1.clamp)(datum[this._angleField[0]], min, max);
return this.angleAxisHelper.dataToPosition([ angle ]);
}
_getRotatedPointerCenterOffset(datum) {
var _a, _b, _c, _d;
const pointerSpec = this._spec.pointer, x = this._getPointerWidth() * (null !== (_b = null === (_a = null == pointerSpec ? void 0 : pointerSpec.center) || void 0 === _a ? void 0 : _a[0]) && void 0 !== _b ? _b : 0), y = -this._getPointerHeight(datum) * (null !== (_d = null === (_c = null == pointerSpec ? void 0 : pointerSpec.center) || void 0 === _c ? void 0 : _c[1]) && void 0 !== _d ? _d : 0), angle = this._getPointerAngle(datum) - Math.PI / 2, cos = Math.cos(angle), sin = Math.sin(angle);
return {
x: x * cos + y * sin,
y: -(y * cos - x * sin)
};
}
initPinBackgroundMarkStyle() {
const pinBackgroundMark = this._pinBackgroundMark, pinBackgroundSpec = this._spec.pinBackground;
pinBackgroundMark && this.setMarkStyle(pinBackgroundMark, {
x: datum => this._getPointerAnchor(datum, pinBackgroundSpec).x,
y: datum => this._getPointerAnchor(datum, pinBackgroundSpec).y,
scaleX: () => pinBackgroundSpec.width * this._computeLayoutRadius(),
scaleY: () => pinBackgroundSpec.height * this._computeLayoutRadius(),
fill: this.getColorAttribute(),
zIndex: 100
});
}
initPinMarkStyle() {
const pinMark = this._pinMark, pinSpec = this._spec.pin;
pinMark && this.setMarkStyle(pinMark, {
x: datum => this._getPointerAnchor(datum, pinSpec).x,
y: datum => this._getPointerAnchor(datum, pinSpec).y,
scaleX: () => pinSpec.width * this._computeLayoutRadius(),
scaleY: () => pinSpec.height * this._computeLayoutRadius(),
fill: this.getColorAttribute(),
zIndex: 300
});
}
getInteractionTriggers() {
return this._parseInteractionConfig(this._pointerMark ? [ this._pointerMark ] : []);
}
initAnimation() {
var _a, _b, _c;
const appearPreset = null === (_b = null === (_a = this._spec) || void 0 === _a ? void 0 : _a.animationAppear) || void 0 === _b ? void 0 : _b.preset;
this._pointerMark.setAnimationConfig((0, utils_1.animationConfig)(null === (_c = factory_1.Factory.getAnimationInKey("gaugePointer")) || void 0 === _c ? void 0 : _c({
startAngle: this._startAngle
}, appearPreset), (0, utils_1.userAnimationConfig)("pointer", this._spec, this._markAttributeContext)));
}
getDefaultShapeType() {
return "circle";
}
getActiveMarks() {
return [];
}
}
exports.GaugePointerSeries = GaugePointerSeries, GaugePointerSeries.type = type_1.SeriesTypeEnum.gaugePointer,
GaugePointerSeries.mark = constant_1.gaugePointerSeriesMark, GaugePointerSeries.builtInTheme = {
gaugePointer: gauge_pointer_1.gaugePointer
}, GaugePointerSeries.transformerConstructor = gauge_pointer_transformer_1.GaugePointerSeriesSpecTransformer;
const registerGaugePointerSeries = () => {
factory_1.Factory.registerSeries(GaugePointerSeries.type, GaugePointerSeries), (0,
path_1.registerPathMark)(), (0, rect_1.registerRectMark)(), (0, animation_1.registerGaugePointerAnimation)(),
(0, polar_1.registerPolarBandAxis)(), (0, polar_1.registerPolarLinearAxis)();
};
exports.registerGaugePointerSeries = registerGaugePointerSeries;
//# sourceMappingURL=gauge-pointer.js.map