cione-comp-lib
Version:
`$ yarn add cione-comp-lib` 或者 `$ npm i cione-comp-lib -S`
183 lines (182 loc) • 7.27 kB
JavaScript
import { __extends } from "../../../../tslib/tslib.es6.mjs";
import * as graphic from "../../util/graphic.mjs";
import { setStatesStylesFromModel, toggleHoverEmphasis } from "../../util/states.mjs";
import { defaults, each, extend, clone, map } from "../../../../zrender/lib/core/util.mjs";
import { normalizeSymbolSize, createSymbol } from "../../util/symbol.mjs";
import ChartView from "../../view/Chart.mjs";
import { setLabelStyle, getLabelStatesModels } from "../../label/labelStyle.mjs";
import ZRImage from "../../../../zrender/lib/graphic/Image.mjs";
import { initProps, saveOldStyle, updateProps } from "../../animation/basicTransition.mjs";
import Polygon from "../../../../zrender/lib/graphic/shape/Polygon.mjs";
import Polyline from "../../../../zrender/lib/graphic/shape/Polyline.mjs";
import Group from "../../../../zrender/lib/graphic/Group.mjs";
var RadarView = function(_super) {
__extends(RadarView2, _super);
function RadarView2() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.type = RadarView2.type;
return _this;
}
RadarView2.prototype.render = function(seriesModel, ecModel, api) {
var polar = seriesModel.coordinateSystem;
var group = this.group;
var data = seriesModel.getData();
var oldData = this._data;
function createSymbol$1(data2, idx) {
var symbolType = data2.getItemVisual(idx, "symbol") || "circle";
if (symbolType === "none") {
return;
}
var symbolSize = normalizeSymbolSize(data2.getItemVisual(idx, "symbolSize"));
var symbolPath = createSymbol(symbolType, -1, -1, 2, 2);
var symbolRotate = data2.getItemVisual(idx, "symbolRotate") || 0;
symbolPath.attr({
style: {
strokeNoScale: true
},
z2: 100,
scaleX: symbolSize[0] / 2,
scaleY: symbolSize[1] / 2,
rotation: symbolRotate * Math.PI / 180 || 0
});
return symbolPath;
}
function updateSymbols(oldPoints, newPoints, symbolGroup, data2, idx, isInit) {
symbolGroup.removeAll();
for (var i = 0; i < newPoints.length - 1; i++) {
var symbolPath = createSymbol$1(data2, idx);
if (symbolPath) {
symbolPath.__dimIdx = i;
if (oldPoints[i]) {
symbolPath.setPosition(oldPoints[i]);
graphic[isInit ? "initProps" : "updateProps"](symbolPath, {
x: newPoints[i][0],
y: newPoints[i][1]
}, seriesModel, idx);
} else {
symbolPath.setPosition(newPoints[i]);
}
symbolGroup.add(symbolPath);
}
}
}
function getInitialPoints(points) {
return map(points, function(pt) {
return [polar.cx, polar.cy];
});
}
data.diff(oldData).add(function(idx) {
var points = data.getItemLayout(idx);
if (!points) {
return;
}
var polygon = new Polygon();
var polyline = new Polyline();
var target = {
shape: {
points
}
};
polygon.shape.points = getInitialPoints(points);
polyline.shape.points = getInitialPoints(points);
initProps(polygon, target, seriesModel, idx);
initProps(polyline, target, seriesModel, idx);
var itemGroup = new Group();
var symbolGroup = new Group();
itemGroup.add(polyline);
itemGroup.add(polygon);
itemGroup.add(symbolGroup);
updateSymbols(polyline.shape.points, points, symbolGroup, data, idx, true);
data.setItemGraphicEl(idx, itemGroup);
}).update(function(newIdx, oldIdx) {
var itemGroup = oldData.getItemGraphicEl(oldIdx);
var polyline = itemGroup.childAt(0);
var polygon = itemGroup.childAt(1);
var symbolGroup = itemGroup.childAt(2);
var target = {
shape: {
points: data.getItemLayout(newIdx)
}
};
if (!target.shape.points) {
return;
}
updateSymbols(polyline.shape.points, target.shape.points, symbolGroup, data, newIdx, false);
saveOldStyle(polygon);
saveOldStyle(polyline);
updateProps(polyline, target, seriesModel);
updateProps(polygon, target, seriesModel);
data.setItemGraphicEl(newIdx, itemGroup);
}).remove(function(idx) {
group.remove(oldData.getItemGraphicEl(idx));
}).execute();
data.eachItemGraphicEl(function(itemGroup, idx) {
var itemModel = data.getItemModel(idx);
var polyline = itemGroup.childAt(0);
var polygon = itemGroup.childAt(1);
var symbolGroup = itemGroup.childAt(2);
var itemStyle = data.getItemVisual(idx, "style");
var color = itemStyle.fill;
group.add(itemGroup);
polyline.useStyle(defaults(itemModel.getModel("lineStyle").getLineStyle(), {
fill: "none",
stroke: color
}));
setStatesStylesFromModel(polyline, itemModel, "lineStyle");
setStatesStylesFromModel(polygon, itemModel, "areaStyle");
var areaStyleModel = itemModel.getModel("areaStyle");
var polygonIgnore = areaStyleModel.isEmpty() && areaStyleModel.parentModel.isEmpty();
polygon.ignore = polygonIgnore;
each(["emphasis", "select", "blur"], function(stateName) {
var stateModel = itemModel.getModel([stateName, "areaStyle"]);
var stateIgnore = stateModel.isEmpty() && stateModel.parentModel.isEmpty();
polygon.ensureState(stateName).ignore = stateIgnore && polygonIgnore;
});
polygon.useStyle(defaults(areaStyleModel.getAreaStyle(), {
fill: color,
opacity: 0.7,
decal: itemStyle.decal
}));
var emphasisModel = itemModel.getModel("emphasis");
var itemHoverStyle = emphasisModel.getModel("itemStyle").getItemStyle();
symbolGroup.eachChild(function(symbolPath) {
if (symbolPath instanceof ZRImage) {
var pathStyle = symbolPath.style;
symbolPath.useStyle(extend({
image: pathStyle.image,
x: pathStyle.x,
y: pathStyle.y,
width: pathStyle.width,
height: pathStyle.height
}, itemStyle));
} else {
symbolPath.useStyle(itemStyle);
symbolPath.setColor(color);
symbolPath.style.strokeNoScale = true;
}
var pathEmphasisState = symbolPath.ensureState("emphasis");
pathEmphasisState.style = clone(itemHoverStyle);
var defaultText = data.getStore().get(data.getDimensionIndex(symbolPath.__dimIdx), idx);
(defaultText == null || isNaN(defaultText)) && (defaultText = "");
setLabelStyle(symbolPath, getLabelStatesModels(itemModel), {
labelFetcher: data.hostModel,
labelDataIndex: idx,
labelDimIndex: symbolPath.__dimIdx,
defaultText,
inheritColor: color,
defaultOpacity: itemStyle.opacity
});
});
toggleHoverEmphasis(itemGroup, emphasisModel.get("focus"), emphasisModel.get("blurScope"), emphasisModel.get("disabled"));
});
this._data = data;
};
RadarView2.prototype.remove = function() {
this.group.removeAll();
this._data = null;
};
RadarView2.type = "radar";
return RadarView2;
}(ChartView);
var RadarView$1 = RadarView;
export { RadarView$1 as default };