@visactor/vgrammar-core
Version:
VGrammar is a visual grammar library
176 lines (161 loc) • 8.19 kB
JavaScript
import { isNil, isString, merge } from "@visactor/vutils";
import { CircleAxis as CircleAxisComponent, LineAxis as LineAxisComponent } from "@visactor/vrender-components";
import { AxisEnum, ComponentEnum } from "../graph/enums";
import { ScaleComponent } from "./scale";
import { invokeEncoder } from "../graph/mark/encode";
import { invokeFunctionType } from "../parse/util";
import { Factory } from "../core/factory";
export const generateLineAxisAttributes = (scale, theme, addition, tickCount) => {
var _a, _b, _c, _d;
const axisTheme = null !== (_b = null === (_a = null == theme ? void 0 : theme.components) || void 0 === _a ? void 0 : _a.axis) && void 0 !== _b ? _b : {};
if (!scale) return merge({}, axisTheme, null != addition ? addition : {});
const items = [ (null !== (_d = null === (_c = scale.tickData) || void 0 === _c ? void 0 : _c.call(scale, tickCount)) && void 0 !== _d ? _d : []).map((tick => ({
id: tick.index,
label: tick.tick,
value: tick.value,
rawValue: tick.tick
}))) ];
return merge({}, axisTheme, {
items: items
}, null != addition ? addition : {});
};
export const generateCircleAxisAttributes = (scale, theme, addition, tickCount) => {
var _a, _b, _c, _d;
const axisTheme = null !== (_b = null === (_a = null == theme ? void 0 : theme.components) || void 0 === _a ? void 0 : _a.circleAxis) && void 0 !== _b ? _b : {};
if (!scale) return merge({}, axisTheme, null != addition ? addition : {});
const items = [ (null !== (_d = null === (_c = scale.tickData) || void 0 === _c ? void 0 : _c.call(scale, tickCount)) && void 0 !== _d ? _d : []).map((tick => ({
id: tick.index,
label: tick.tick,
value: tick.value,
rawValue: tick.tick
}))) ];
return merge({}, axisTheme, {
items: items
}, null != addition ? addition : {});
};
export const generateCoordinateAxisAttribute = (scale, coordinate, inside, baseValue, layout, isGrid) => {
var _a;
const axisPosition = scale.getCoordinateAxisPosition();
layout && "auto" === layout.position && (layout.position = inside ? "content" : axisPosition);
const axisPoints = scale.getCoordinateAxisPoints(baseValue);
if (axisPoints) {
const res = {
start: axisPoints[0],
end: axisPoints[1],
verticalFactor: ("top" === axisPosition || "left" === axisPosition ? -1 : 1) * (inside ? -1 : 1) * ((null === (_a = scale.getSpec().range) || void 0 === _a ? void 0 : _a.reversed) ? -1 : 1)
};
if (isGrid && "polar" === coordinate.type) {
const angle = coordinate.angle();
res.center = coordinate.origin(), res.startAngle = angle[0], res.endAngle = angle[1];
}
return res;
}
const radius = coordinate.radius(), angle = coordinate.angle();
return {
center: coordinate.origin(),
radius: radius[1],
innerRadius: radius[0],
inside: inside,
startAngle: angle[0],
endAngle: angle[1]
};
};
export class Axis extends ScaleComponent {
constructor(view, group, mode) {
super(view, ComponentEnum.axis, group), this.spec.componentType = ComponentEnum.axis,
this.mode = mode;
}
parseAddition(spec) {
return super.parseAddition(spec), this.axisType(spec.axisType), this.tickCount(spec.tickCount),
this.inside(spec.inside), this.baseValue(spec.baseValue), this;
}
scale(scale) {
return super.scale(scale), this._axisComponentType = null, this;
}
axisType(axisType) {
return this.spec.axisType = axisType, this._axisComponentType = null, this._prepareRejoin(),
this.commit(), this;
}
addGraphicItem(attrs, groupKey) {
const initialAttributes = merge({
x: 0,
y: 0,
start: {
x: 0,
y: 0
},
end: {
x: 0,
y: 0
}
}, attrs), graphicItem = Factory.createGraphicComponent(this._getAxisComponentType(), initialAttributes, {
mode: this.mode,
skipDefault: this.spec.skipTheme
});
return super.addGraphicItem(initialAttributes, groupKey, graphicItem);
}
tickCount(tickCount) {
const scaleGrammar = isString(this.spec.scale) ? this.view.getScaleById(this.spec.scale) : this.spec.scale;
return scaleGrammar && scaleGrammar.tickCount(tickCount), this.setFunctionSpec(tickCount, "tickCount");
}
inside(inside) {
return this.setFunctionSpec(inside, "inside");
}
baseValue(baseValue) {
return this.setFunctionSpec(baseValue, "baseValue");
}
getAxisComponentType() {
return this._axisComponentType;
}
_updateComponentEncoders() {
const scaleGrammar = isString(this.spec.scale) ? this.view.getScaleById(this.spec.scale) : this.spec.scale, encoders = Object.assign({
update: {}
}, this.spec.encode), componentEncoders = Object.keys(encoders).reduce(((res, state) => {
const encoder = encoders[state];
return encoder && (res[state] = {
callback: (datum, element, parameters) => {
var _a, _b;
const theme = this.spec.skipTheme ? null : this.view.getCurrentTheme();
let addition = invokeEncoder(encoder, datum, element, parameters);
const inside = invokeFunctionType(this.spec.inside, parameters, datum, element), baseValue = invokeFunctionType(this.spec.baseValue, parameters, datum, element), coordinate = null === (_a = null == scaleGrammar ? void 0 : scaleGrammar.getCoordinate) || void 0 === _a ? void 0 : _a.call(scaleGrammar);
coordinate && (addition = Object.assign(generateCoordinateAxisAttribute(scaleGrammar, coordinate, inside, baseValue, this.spec.layout), addition));
const scale = null === (_b = null == scaleGrammar ? void 0 : scaleGrammar.getScale) || void 0 === _b ? void 0 : _b.call(scaleGrammar), tickCount = invokeFunctionType(this.spec.tickCount, parameters, datum, element);
switch (this._getAxisComponentType()) {
case AxisEnum.lineAxis:
return generateLineAxisAttributes(scale, theme, addition, tickCount);
case AxisEnum.circleAxis:
return generateCircleAxisAttributes(scale, theme, addition, tickCount);
}
return addition;
}
}), res;
}), {});
this._encoders = componentEncoders;
}
_getAxisComponentType() {
var _a;
if (this._axisComponentType) return this._axisComponentType;
let type = this.spec.axisType;
if (isNil(type)) {
const scaleGrammar = isString(this.spec.scale) ? this.view.getScaleById(this.spec.scale) : this.spec.scale;
type = (null === (_a = null == scaleGrammar ? void 0 : scaleGrammar.getCoordinate) || void 0 === _a ? void 0 : _a.call(scaleGrammar)) ? scaleGrammar.getCoordinateAxisPoints() ? "line" : "circle" : "line";
}
return this._axisComponentType = "circle" === type ? AxisEnum.circleAxis : AxisEnum.lineAxis,
this._axisComponentType;
}
}
Axis.componentType = ComponentEnum.axis;
export const registerAxis = () => {
Factory.registerGraphicComponent(AxisEnum.lineAxis, ((attrs, options) => new LineAxisComponent(attrs, options))),
Factory.registerGraphicComponent(AxisEnum.circleAxis, (attrs => new CircleAxisComponent(attrs))),
Factory.registerComponent(ComponentEnum.axis, Axis);
};
export const registerLineAxis = () => {
Factory.registerGraphicComponent(AxisEnum.lineAxis, ((attrs, options) => new LineAxisComponent(attrs, options))),
Factory.registerComponent(ComponentEnum.axis, Axis);
};
export const registerCircleAxis = () => {
Factory.registerGraphicComponent(AxisEnum.circleAxis, (attrs => new CircleAxisComponent(attrs))),
Factory.registerComponent(ComponentEnum.axis, Axis);
};
//# sourceMappingURL=axis.js.map