@visactor/vchart
Version:
charts lib based @visactor/VGrammar
214 lines (207 loc) • 10.1 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.registerLinkSeries = exports.LinkSeries = void 0;
const data_1 = require("../../constant/data"), cartesian_1 = require("../cartesian/cartesian"), vutils_1 = require("@visactor/vutils"), type_1 = require("../interface/type"), register_1 = require("../../data/register"), tooltip_helper_1 = require("./tooltip-helper"), rule_1 = require("../../mark/rule"), symbol_1 = require("../../mark/symbol"), constant_1 = require("./constant"), link_dot_info_1 = require("../../data/transforms/link-dot-info"), factory_1 = require("../../core/factory"), initialize_1 = require("../../data/initialize"), cartesian_2 = require("../../component/axis/cartesian"), attribute_1 = require("../../constant/attribute"), link_1 = require("../../theme/builtin/common/series/link");
class LinkSeries extends cartesian_1.CartesianSeries {
constructor() {
super(...arguments), this.type = type_1.SeriesTypeEnum.link;
}
getFromField() {
return this._fromField;
}
setFromField(field) {
(0, vutils_1.isValid)(field) && (this._fromField = field);
}
getToField() {
return this._toField;
}
setToField(field) {
(0, vutils_1.isValid)(field) && (this._toField = field);
}
getDotTypeField() {
return this._dotTypeField;
}
setDotTypeField(field) {
(0, vutils_1.isValid)(field) && (this._dotTypeField = field);
}
getDotSeriesSpec() {
return this._dotSeriesSpec;
}
setDotSeriesSpec(spec) {
(0, vutils_1.isValid)(spec) && (this._dotSeriesSpec = spec);
}
_getDotData() {
const dotSeries = this._option.getChart().getSeriesInIndex([ this._spec.dotSeriesIndex ])[0];
return dotSeries ? dotSeries.getRawData().latestData : [];
}
initData() {
var _a;
super.initData(), (0, register_1.registerDataSetInstanceTransform)(this._option.dataSet, "linkDotInfo", link_dot_info_1.linkDotInfo),
null === (_a = this.getViewData()) || void 0 === _a || _a.transform({
type: "linkDotInfo",
options: {
infoKey: "dots",
fields: () => ({
fromField: this._fromField,
toField: this._toField,
xField: this._dotSeriesSpec.xField,
yField: this._dotSeriesSpec.yField
}),
linkData: () => this._rawData.latestData,
dotData: () => this._getDotData()
},
level: initialize_1.TransformLevel.linkDotInfo
}, !1);
}
setAttrFromSpec() {
super.setAttrFromSpec(), this.setFromField(this._spec.fromField), this.setToField(this._spec.toField),
this.setDotTypeField(this._spec.dotTypeField), this.setDotSeriesSpec(this._spec.dotSeriesSpec);
}
initMark() {
this._clipMark = this._createMark(LinkSeries.mark.group), this._containerMark = this._createMark(LinkSeries.mark.group, {
parent: this._clipMark
}), this._linkMark = this._createMark(LinkSeries.mark.link, {
skipBeforeLayouted: !1,
parent: this._containerMark
}), this._arrowMark = this._createMark(LinkSeries.mark.arrow, {
skipBeforeLayouted: !1,
isSeriesMark: !0,
parent: this._containerMark
});
}
initMarkStyle() {
var _a, _b, _c, _d;
const clipMark = this._clipMark;
clipMark && (this.setMarkStyle(clipMark, {
x: -this._spec.leftAppendPadding,
y: 0,
width: 1e4,
height: this._spec.clipHeight
}, "normal", attribute_1.AttributeLevel.Series), clipMark.setMarkConfig({
interactive: !1,
clip: !0
}));
const containerMark = this._containerMark;
containerMark && (this.setMarkStyle(containerMark, {
x: this._spec.leftAppendPadding,
width: this.getLayoutRect().width
}, "normal", attribute_1.AttributeLevel.Series), containerMark.setMarkConfig({
interactive: !1
}));
const linkMark = this._linkMark;
linkMark && this.setMarkStyle(linkMark, {
stroke: this.getColorAttribute(),
strokeOpacity: this.dataToOpacity.bind(this),
x: this.dataToPositionXFrom.bind(this),
y: this.dataToPositionYFrom.bind(this),
x1: this.dataToPositionXTo.bind(this),
y1: this.dataToPositionYTo.bind(this)
}, "normal", attribute_1.AttributeLevel.Series);
const arrowMark = this._arrowMark;
if (arrowMark) {
const arrowSize = null !== (_d = null === (_c = null === (_b = null === (_a = this._theme) || void 0 === _a ? void 0 : _a.arrow) || void 0 === _b ? void 0 : _b.style) || void 0 === _c ? void 0 : _c.size) && void 0 !== _d ? _d : 10;
this.setMarkStyle(arrowMark, {
x: this.dataToPositionXTo.bind(this),
y: datum => this.dataToPositionArrowYTo(datum, arrowSize),
fill: this.getColorAttribute(),
fillOpacity: this.dataToOpacity.bind(this),
size: arrowSize,
symbolType: datum => this.isPositionYFromHigher(datum) ? "triangleDown" : "triangleUp"
}, "normal", attribute_1.AttributeLevel.Series);
}
}
afterInitMark() {
super.afterInitMark();
}
dataToPositionXFrom(datum) {
if (!this._xAxisHelper) return Number.NaN;
const {dataToPosition: dataToPosition} = this._xAxisHelper;
return dataToPosition(this.getDatumPositionValues(datum, this._fromField + "_xField"), {
bandPosition: this._bandPosition
});
}
dataToPositionYFrom(datum) {
if (!this._yAxisHelper) return Number.NaN;
const {dataToPosition: dataToPosition} = this._yAxisHelper;
return dataToPosition(this.getDatumPositionValues(datum, this._fromField + "_yField"));
}
dataToPositionXTo(datum) {
if (!this._xAxisHelper) return Number.NaN;
const {dataToPosition: dataToPosition} = this._xAxisHelper;
return dataToPosition(this.getDatumPositionValues(datum, this._toField + "_xField"), {
bandPosition: this._bandPosition
});
}
dataToPositionYTo(datum) {
if (!this._yAxisHelper) return Number.NaN;
const {dataToPosition: dataToPosition} = this._yAxisHelper;
return dataToPosition(this.getDatumPositionValues(datum, this._toField + "_yField"), {
bandPosition: this._bandPosition
});
}
dataToPositionArrowYTo(datum, arrowSize) {
if (!this._yAxisHelper) return Number.NaN;
const {dataToPosition: dataToPosition} = this._yAxisHelper, offset = this.isPositionYFromHigher(datum) ? -arrowSize / 2 : arrowSize / 2;
return dataToPosition(this.getDatumPositionValues(datum, this._toField + "_yField"), {
bandPosition: this._bandPosition
}) + offset;
}
dataToOpacity(datum) {
return this.isPositionXOuterRange(datum, this._fromField + "_xField") || this.isPositionXOuterRange(datum, this._toField + "_xField") || datum[this._fromField] === datum[this._toField] ? 0 : 1;
}
isPositionYFromHigher(datum) {
return this.dataToPositionYFrom(datum) < this.dataToPositionYTo(datum);
}
isPositionXOuterRange(datum, field) {
if (!this._xAxisHelper) return !1;
const {dataToPosition: dataToPosition, getScale: getScale} = this._xAxisHelper;
return dataToPosition(this.getDatumPositionValues(datum, field), {
bandPosition: this._bandPosition
}) < getScale(0).range()[0] || dataToPosition(this.getDatumPositionValues(datum, field), {
bandPosition: this._bandPosition
}) > getScale(0).range()[1];
}
getDefaultColorDomain() {
var _a, _b;
return this._dotTypeField ? null === (_a = this.getViewDataStatistics()) || void 0 === _a ? void 0 : _a.latestData[this._dotTypeField].values : this._seriesField ? null === (_b = this.getViewDataStatistics()) || void 0 === _b ? void 0 : _b.latestData[this._seriesField].values : [];
}
getColorAttribute() {
var _a, _b, _c;
return {
scale: null !== (_a = this._option.globalScale.getScale("color")) && void 0 !== _a ? _a : this._getDefaultColorScale(),
field: null !== (_c = null !== (_b = this._dotTypeField) && void 0 !== _b ? _b : this._seriesField) && void 0 !== _c ? _c : data_1.DEFAULT_DATA_SERIES_FIELD
};
}
getInteractionTriggers() {
const marks = [];
return this._linkMark && marks.push(this._linkMark), this._arrowMark && marks.push(this._arrowMark),
this._parseInteractionConfig(marks);
}
initTooltip() {
this._tooltipHelper = new tooltip_helper_1.LinkSeriesTooltipHelper(this), this._linkMark && this._tooltipHelper.activeTriggerSet.mark.add(this._linkMark),
this._arrowMark && this._tooltipHelper.activeTriggerSet.mark.add(this._arrowMark);
}
onMarkTreePositionUpdate(marks) {
marks.forEach((m => {
m.commit(!1, !0);
}));
}
getDotInfoData() {
var _a, _b;
return null === (_b = null !== (_a = this._linkMark) && void 0 !== _a ? _a : this._arrowMark) || void 0 === _b ? void 0 : _b.getData();
}
getActiveMarks() {
return [ this._linkMark, this._arrowMark ];
}
}
exports.LinkSeries = LinkSeries, LinkSeries.type = type_1.SeriesTypeEnum.link, LinkSeries.mark = constant_1.linkSeriesMark,
LinkSeries.builtInTheme = {
link: link_1.link
};
const registerLinkSeries = () => {
(0, rule_1.registerRuleMark)(), (0, symbol_1.registerSymbolMark)(), (0, cartesian_2.registerCartesianBandAxis)(),
(0, cartesian_2.registerCartesianLinearAxis)(), factory_1.Factory.registerSeries(LinkSeries.type, LinkSeries);
};
exports.registerLinkSeries = registerLinkSeries;
//# sourceMappingURL=link.js.map