@amcharts/amcharts5
Version:
amCharts 5
66 lines • 2.85 kB
JavaScript
import { PyramidSeries } from "./PyramidSeries";
import { Graphics } from "../../core/render/Graphics";
import { p100, p50 } from "../../core/util/Percent";
/**
* Creates a pictorial series for use in a [[SlicedChart]].
*
* @see {@link https://www.amcharts.com/docs/v5/charts/percent-charts/sliced-chart/pictorial-stacked-series/} for more info
* @important
*/
export class PictorialStackedSeries extends PyramidSeries {
constructor() {
super(...arguments);
this._tag = "pictorial";
/**
* A [[Graphics]] element to used as a mask (shape) for the series.
*
* This element is read-only. To modify the mask/shape, use the `svgPath` setting.
*/
this.seriesMask = Graphics.new(this._root, { position: "absolute", x: p50, y: p50, centerX: p50, centerY: p50 });
this.seriesGraphics = this.slicesContainer.children.push(Graphics.new(this._root, { themeTags: ["pictorial", "background"], position: "absolute", x: p50, y: p50, centerX: p50, centerY: p50 })._markC("themeTags", "position", "x", "y", "centerX", "centerY"));
}
_afterNew() {
super._afterNew();
this._setC("topWidth", p100);
this._setC("bottomWidth", p100);
this._setC("valueIs", "height");
this.slicesContainer._setC("mask", this.seriesMask);
}
_updateScale() {
let slicesContainer = this.slicesContainer;
let w = slicesContainer.innerWidth();
let h = slicesContainer.innerHeight();
let seriesMask = this.seriesMask;
let seriesGraphics = this.seriesGraphics;
let scale = seriesMask.get("scale", 1);
const bounds = seriesMask.localBounds();
let mw = bounds.right - bounds.left;
let mh = bounds.bottom - bounds.top;
if (this.get("orientation") == "horizontal") {
scale = w / mw;
}
else {
scale = h / mh;
}
if (scale != Infinity && !Number.isNaN(scale)) {
seriesMask.set("scale", scale);
seriesMask.set("x", w / 2);
seriesMask.set("y", h / 2);
seriesGraphics._setC("scale", scale);
seriesGraphics._setC("x", w / 2);
seriesGraphics._setC("y", h / 2);
}
}
_prepareChildren() {
super._prepareChildren();
if (this.isDirty("svgPath")) {
const svgPath = this.get("svgPath");
this.seriesMask.set("svgPath", svgPath);
this.seriesGraphics._setC("svgPath", svgPath);
}
this._updateScale();
}
}
PictorialStackedSeries.className = "PictorialStackedSeries";
PictorialStackedSeries.classNames = PyramidSeries.classNames.concat([PictorialStackedSeries.className]);
//# sourceMappingURL=PictorialStackedSeries.js.map