@visactor/vchart
Version:
charts lib based @visactor/VGrammar
258 lines (251 loc) • 13.1 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.registerDotSeries = exports.DotSeries = void 0;
const data_1 = require("../../constant/data"), cartesian_1 = require("../cartesian/cartesian"), vutils_extension_1 = require("@visactor/vutils-extension"), vutils_1 = require("@visactor/vutils"), type_1 = require("../interface/type"), vdataset_1 = require("@visactor/vdataset"), register_1 = require("../../data/register"), tooltip_helper_1 = require("./tooltip-helper"), copy_data_view_1 = require("../../data/transforms/copy-data-view"), obj_flat_1 = require("../../data/transforms/obj-flat"), config_1 = require("./config"), color_ordinal_scale_1 = require("../../scale/color-ordinal-scale"), symbol_1 = require("../../mark/symbol"), text_1 = require("../../mark/text"), rule_1 = require("../../mark/rule"), rect_1 = require("../../mark/rect"), constant_1 = require("./constant"), factory_1 = require("../../core/factory"), initialize_1 = require("../../data/initialize"), attribute_1 = require("../../constant/attribute"), dot_1 = require("../../theme/builtin/common/series/dot");
class DotSeries extends cartesian_1.CartesianSeries {
constructor() {
super(...arguments), this.type = type_1.SeriesTypeEnum.dot;
}
getSeriesGroupField() {
return this._seriesField;
}
setSeriesGroupField(field) {
(0, vutils_1.isValid)(field) && (this._seriesGroupField = field);
}
getTitleField() {
return this._titleField;
}
setTitleField(field) {
(0, vutils_1.isValid)(field) && (this._titleField = field);
}
getSubTitleField() {
return this._subTitleField;
}
setSubTitleField(field) {
(0, vutils_1.isValid)(field) && (this._subTitleField = field);
}
getDotTypeField() {
return this._dotTypeField;
}
setDotTypeField(field) {
(0, vutils_1.isValid)(field) && (this._dotTypeField = field);
}
getHighLightSeriesGroup() {
return this._highLightSeriesGroup;
}
setHighLightSeriesGroup(field) {
(0, vutils_1.isValid)(field) && (this._highLightSeriesGroup = field);
}
setGridBackground(gridBackground) {
(0, vutils_1.isValid)(gridBackground) && (this._gridBackground = gridBackground);
}
initData() {
var _a;
super.initData(), this._xDimensionStatisticsDomain = this.getRawData().latestData.map((d => d[this._fieldY[0]])),
(0, register_1.registerDataSetInstanceTransform)(this._option.dataSet, "objFlat", obj_flat_1.objFlat),
(0, register_1.registerDataSetInstanceTransform)(this._option.dataSet, "copyDataView", copy_data_view_1.copyDataView),
(0, register_1.registerDataSetInstanceParser)(this._option.dataSet, "dataview", vdataset_1.dataViewParser),
null === (_a = this.getViewData()) || void 0 === _a || _a.transform({
type: "objFlat",
options: "dots",
level: initialize_1.TransformLevel.dotObjFlat
}, !1);
}
getStatisticFields() {
return [ {
key: this._fieldY[0],
operations: [ "values" ],
customize: this._xDimensionStatisticsDomain
} ];
}
setAttrFromSpec() {
var _a;
super.setAttrFromSpec(), this.setSeriesGroupField(this._spec.seriesGroupField),
this.setTitleField(this._spec.titleField), this.setSubTitleField(this._spec.subTitleField),
this.setDotTypeField(this._spec.dotTypeField), this.setHighLightSeriesGroup(this._spec.highLightSeriesGroup),
this.setGridBackground((0, vutils_extension_1.mergeSpec)(config_1.DEFAULT_GRID_BACKGROUND, (null === (_a = this._spec.grid) || void 0 === _a ? void 0 : _a.background) || {}));
}
initMark() {
this._clipMark = this._createMark(DotSeries.mark.group), this._containerMark = this._createMark(DotSeries.mark.group, {
parent: this._clipMark,
dataView: this.getRawData()
}), this._gridBackgroundMark = this._createMark(DotSeries.mark.gridBackground, {
parent: this._containerMark,
dataView: this.getRawData()
}), this._gridMark = this._createMark(DotSeries.mark.grid, {
parent: this._containerMark,
dataView: this.getRawData()
}), this._dotMark = this._createMark(DotSeries.mark.dot, {
skipBeforeLayouted: !1,
isSeriesMark: !0,
parent: this._containerMark
}), this._titleMark = this._createMark(DotSeries.mark.title, {
parent: this._containerMark,
dataView: this.getRawData()
}), this._subTitleMark = this._createMark(DotSeries.mark.subTitle, {
parent: this._containerMark,
dataView: this.getRawData()
}), this._symbolMark = this._createMark(DotSeries.mark.symbol, {
parent: this._containerMark,
dataView: this.getRawData()
});
}
initMarkStyle() {
var _a;
const clipMark = this._clipMark;
clipMark && (this.setMarkStyle(clipMark, {
x: -(null !== (_a = this._spec.leftAppendPadding) && void 0 !== _a ? _a : 0),
y: 0,
width: 1e4,
height: () => {
var _a;
return null !== (_a = this._spec.clipHeight) && void 0 !== _a ? _a : this._region.getLayoutRect().height;
}
}, "normal", attribute_1.AttributeLevel.Series), clipMark.setMarkConfig({
interactive: !1,
clip: !0
}));
const containerMark = this._containerMark;
containerMark && (this.setMarkStyle(containerMark, {
x: this._spec.leftAppendPadding
}, "normal", attribute_1.AttributeLevel.Series), containerMark.setMarkConfig({
interactive: !1
}));
const gridBackgroundMark = this._gridBackgroundMark;
gridBackgroundMark && this.setMarkStyle(gridBackgroundMark, {
x: this.getRegionRectLeft.bind(this),
x1: this.getRegionRectRight.bind(this),
y: this.dataToGridBackgroundPositionY.bind(this),
y1: this.dataToGridBackgroundPositionY1.bind(this),
fill: this._gridBackground.fill,
fillOpacity: this.dataToGridBackgroundOpacity.bind(this)
}, "normal", attribute_1.AttributeLevel.Series);
const gridMark = this._gridMark;
gridMark && this.setMarkStyle(gridMark, {
stroke: this.getColorAttribute(),
x: this.getRegionRectLeft.bind(this),
y: this.dataToPositionY.bind(this),
x1: this.getRegionRectRight.bind(this),
y1: this.dataToPositionY.bind(this)
}, "normal", attribute_1.AttributeLevel.Series);
const dotMark = this._dotMark;
dotMark && this.setMarkStyle(dotMark, {
x: this.dataToPositionX.bind(this),
y: this.dataToPositionY.bind(this),
fill: this.getDotColorAttribute(),
stroke: this.getDotColorAttribute(),
fillOpacity: this.dataToOpacity.bind(this)
}, "normal", attribute_1.AttributeLevel.Series);
const titleMark = this._titleMark;
titleMark && this.setMarkStyle(titleMark, {
fill: this.getColorAttribute(),
text: datum => datum[this.getTitleField()],
x: this.getRegionRectLeft.bind(this),
y: this.dataToPositionY.bind(this)
}, "normal", attribute_1.AttributeLevel.Series);
const subTitleMark = this._subTitleMark;
subTitleMark && this.setMarkStyle(subTitleMark, {
fill: this.getColorAttribute(),
text: datum => datum[this.getSubTitleField()],
x: this.getRegionRectLeft.bind(this),
y: this.dataToPositionY.bind(this)
}, "normal", attribute_1.AttributeLevel.Series);
const symbolMark = this._symbolMark;
symbolMark && this.setMarkStyle(symbolMark, {
x: this.getRegionRectLeft.bind(this),
y: this.dataToPositionY.bind(this),
fill: this.getColorAttribute()
}, "normal", attribute_1.AttributeLevel.Series);
}
dataToGridBackgroundPositionY(datum) {
if (!this._yAxisHelper) return Number.NaN;
const {dataToPosition: dataToPosition, getBandwidth: getBandwidth} = this._yAxisHelper;
return dataToPosition(this.getDatumPositionValues(datum, this._fieldY), {
bandPosition: this._bandPosition
}) - getBandwidth(0) / 2;
}
dataToGridBackgroundPositionY1(datum) {
if (!this._yAxisHelper) return Number.NaN;
const {dataToPosition: dataToPosition, getBandwidth: getBandwidth} = this._yAxisHelper;
return dataToPosition(this.getDatumPositionValues(datum, this._fieldY), {
bandPosition: this._bandPosition
}) + getBandwidth(0) / 2;
}
dataToOpacity(datum) {
var _a, _b, _c, _d;
if (!this._xAxisHelper) return Number.NaN;
const {dataToPosition: dataToPosition, getScale: getScale} = this._xAxisHelper;
return dataToPosition(this.getDatumPositionValues(datum, this._fieldX), {
bandPosition: this._bandPosition
}) < getScale(0).range()[0] || dataToPosition(this.getDatumPositionValues(datum, this._fieldX), {
bandPosition: this._bandPosition
}) > getScale(0).range()[1] ? 0 : null !== (_d = null === (_c = null === (_b = null === (_a = this._theme) || void 0 === _a ? void 0 : _a.dot) || void 0 === _b ? void 0 : _b.style) || void 0 === _c ? void 0 : _c.fillOpacity) && void 0 !== _d ? _d : 1;
}
dataToGridBackgroundOpacity(datum) {
return datum[this._seriesGroupField] === this._highLightSeriesGroup ? this._gridBackground.fillOpacity : 0;
}
onLayoutEnd() {
var _a, _b;
super.onLayoutEnd();
const layoutOffsetX = null !== (_b = null === (_a = this._spec) || void 0 === _a ? void 0 : _a.leftAppendPadding) && void 0 !== _b ? _b : 0;
this.setMarkStyle(this._clipMark, {
width: this.getLayoutRect().width + layoutOffsetX
}, "normal", attribute_1.AttributeLevel.Series);
}
getDefaultColorDomain() {
var _a, _b;
return this._seriesGroupField ? null === (_a = this.getViewDataStatistics()) || void 0 === _a ? void 0 : _a.latestData[this._seriesGroupField].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._seriesGroupField) && void 0 !== _b ? _b : this._seriesField) && void 0 !== _c ? _c : data_1.DEFAULT_DATA_SERIES_FIELD
};
}
getDotColorScale() {
var _a, _b, _c;
const colorDomain = this._dotTypeField ? null === (_a = this.getViewDataStatistics()) || void 0 === _a ? void 0 : _a.latestData[this._dotTypeField].values : this._seriesGroupField ? null === (_b = this.getViewDataStatistics()) || void 0 === _b ? void 0 : _b.latestData[this._seriesGroupField].values : this._seriesField ? null === (_c = this.getViewDataStatistics()) || void 0 === _c ? void 0 : _c.latestData[this._seriesField].values : [], colorRange = this._getDataScheme();
return (new color_ordinal_scale_1.ColorOrdinalScale).domain(colorDomain).range(colorRange);
}
getDotColorAttribute() {
var _a, _b, _c, _d;
return {
scale: null !== (_a = this._option.globalScale.getScale("color")) && void 0 !== _a ? _a : this.getDotColorScale(),
field: null !== (_d = null !== (_c = null !== (_b = this._dotTypeField) && void 0 !== _b ? _b : this._seriesGroupField) && void 0 !== _c ? _c : this._seriesField) && void 0 !== _d ? _d : data_1.DEFAULT_DATA_SERIES_FIELD
};
}
initTooltip() {
this._tooltipHelper = new tooltip_helper_1.DotSeriesTooltipHelper(this), this._dotMark && this._tooltipHelper.activeTriggerSet.mark.add(this._dotMark);
}
onEvaluateEnd(ctx) {
super.onEvaluateEnd(ctx);
}
onMarkTreePositionUpdate(marks) {
marks.forEach((m => {
m.commit(!1, !0);
}));
}
getDotData() {
var _a;
return null === (_a = this._dotMark) || void 0 === _a ? void 0 : _a.getData();
}
_getDataIdKey() {}
getStackValueField() {
return null;
}
getActiveMarks() {
return [ this._dotMark ];
}
}
exports.DotSeries = DotSeries, DotSeries.type = type_1.SeriesTypeEnum.dot, DotSeries.mark = constant_1.dotSeriesMark,
DotSeries.builtInTheme = {
dot: dot_1.dot
};
const registerDotSeries = () => {
(0, symbol_1.registerSymbolMark)(), (0, rule_1.registerRuleMark)(), (0, rect_1.registerRectMark)(),
(0, text_1.registerTextMark)(), factory_1.Factory.registerSeries(DotSeries.type, DotSeries);
};
exports.registerDotSeries = registerDotSeries;
//# sourceMappingURL=dot.js.map