igniteui-angular-charts
Version:
Ignite UI Angular charting components for building rich data visualizations for modern web apps.
802 lines (801 loc) • 26.6 kB
JavaScript
/*
THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE AGREEMENT ("AGREEMENT") LOCATED HERE:
https://www.infragistics.com/legal/license/igultimate-la
https://www.infragistics.com/legal/license/igultimate-eula
GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE: you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
*/
import { Base, typeCast, runOn, fromEnum, Point_$type, markType, INotifyPropertyChanged_$type, PropertyChangedEventArgs, delegateCombine } from "igniteui-angular-core";
import { DomWrapper_$type } from "igniteui-angular-core";
import { Dictionary$2 } from "igniteui-angular-core";
import { RenderingContext } from "igniteui-angular-core";
import { LegendItemHelper } from "igniteui-angular-core";
import { ContentControl } from "igniteui-angular-core";
import { ILegendContext_$type } from "igniteui-angular-core";
import { DataTemplatePassInfo } from "igniteui-angular-core";
import { DataTemplateMeasureInfo } from "igniteui-angular-core";
import { DataTemplateRenderInfo } from "igniteui-angular-core";
import { CanvasViewRenderer } from "igniteui-angular-core";
import { Size } from "igniteui-angular-core";
import { Rect } from "igniteui-angular-core";
import { FontUtil } from "igniteui-angular-core";
import { isNaN_ } from "igniteui-angular-core";
import { IChartLegend_$type } from "igniteui-angular-core";
import { ObservableCollection$1 } from "igniteui-angular-core";
import { UIElement } from "igniteui-angular-core";
import { LegendItemInfo } from "./LegendItemInfo";
import { ILegendSeries_$type } from "igniteui-angular-core";
import { PropertyUpdatedEventArgs } from "igniteui-angular-core";
import { LegendMouseButtonEventArgs } from "./LegendMouseButtonEventArgs";
import { LegendMouseEventArgs } from "./LegendMouseEventArgs";
import { LegendTextContentChangedEventArgs } from "./LegendTextContentChangedEventArgs";
import { LegendVisualData } from "./LegendVisualData";
import { MouseButtonEventArgs } from "igniteui-angular-core";
import { MouseEventArgs } from "igniteui-angular-core";
import { RectData } from "igniteui-angular-core";
import { AppearanceHelper } from "igniteui-angular-core";
import { LegendItemVisualData } from "./LegendItemVisualData";
import { stringIsNullOrEmpty } from "igniteui-angular-core";
/**
* @hidden
*/
export let LegendBaseViewManager = /*@__PURE__*/ (() => {
class LegendBaseViewManager extends Base {
constructor(a) {
super();
this.a = null;
this.m = null;
this.h = null;
this.d = false;
this.g = null;
this.n = null;
this.c = null;
this.e = false;
this.o = null;
this.a = a;
this.g = new Dictionary$2(Base.$, DomWrapper_$type, 0);
}
s() {
let a = LegendItemHelper.b;
if (window.devicePixelRatio != undefined && (isNaN_(a) || window.devicePixelRatio != a)) {
LegendItemHelper.b = window.devicePixelRatio;
this.a.am();
}
}
x() {
}
v() {
this.s();
}
w(a) {
if (a == null) {
this.m = null;
this.h = null;
return;
}
this.h = a;
this.m = this.j();
this.m.addClass(this.a.t);
this.h.append(this.m);
}
j() {
return this.h.createElement("table");
}
i() {
let a = this.h.createElement("tr");
a.addClass(this.a.u);
let b = this.a.l;
if (b) {
a.setStyleProperty("display", "block");
a.setStyleProperty("float", "left");
a.setStyleProperty("margin", "0px");
a.setStyleProperty("margin-right", "8px");
}
return a;
}
k(a) {
return this.l(a, this.m);
}
l(a, b) {
let c = typeCast(ContentControl.$, a);
let d = this.i();
if (c != null) {
let e = typeCast(ILegendContext_$type, c.content);
if (e != null && c.ah != null) {
let f = new DataTemplatePassInfo();
f.context = d;
f.passID = "LegendItem";
let g = new DataTemplateMeasureInfo();
g.passInfo = f;
g.width = NaN;
g.height = NaN;
g.data = e;
g.context = d;
let h = new DataTemplateRenderInfo();
h.passInfo = f;
if (c.ah.measure != null) {
c.ah.measure(g);
}
h.context = this.h.getSubRenderer(d);
h.availableWidth = g.width;
h.availableHeight = g.height;
h.data = e;
h.xPosition = 0;
h.yPosition = 0;
c.ah.render(h);
let i = d.findByClass(".ui-legend-item-badge");
for (let j = 0; j < i.length; j++) {
i[j].removeClass("ui-legend-item-badge").addClass(this.a.s);
}
i = d.findByClass(".ui-legend-item-text");
for (let k = 0; k < i.length; k++) {
if (this.a.l) {
i[k].setStyleProperty("white-space", "nowrap");
}
i[k].removeClass("ui-legend-item-text").addClass(this.a.v);
}
}
}
return d;
}
r(a, b) {
let c = this.l(a, this.m);
c.listen("mouseup", runOn(this.a, this.a.af));
c.listen("mousedown", runOn(this.a, this.a.ac));
c.listen("mouseleave", runOn(this.a, this.a.ad));
c.listen("mousemove", runOn(this.a, this.a.ae));
this.g.addItem(a, c);
if ((this.m.getChildCount() == 0) || (b >= this.m.getChildCount())) {
this.m.append(c);
}
else {
let d = this.m.getChildAt(b);
d.before(c);
}
}
z(a) {
}
aa(a) {
let b;
if (((() => { let c = this.g.tryGetValue(a, b); b = c.p1; return c.ret; })())) {
b.unlistenAll();
b.remove();
this.g.removeItem(a);
}
}
q(visual_) {
for (let pair_ of fromEnum(this.g)) {
if (pair_.value.getNativeElement() === visual_) {
return pair_.key;
}
;
}
return null;
}
f(a) {
for (let b of fromEnum(this.g.keys)) {
let c = typeCast(ContentControl.$, b);
if (c != null && c.content != null) {
let d = typeCast(ILegendContext_$type, c.content);
if (d != null && d.itemLabel == a.itemLabel && d.legendLabel == a.legendLabel && d.series == a.series && d.itemBrush == a.itemBrush) {
return true;
}
}
}
return false;
}
b(a) {
let b = this.h.rootWrapper.width();
let c = this.h.rootWrapper.height();
this.m.remove();
let d = this.h.createElement("div");
d.setStyleProperty("position", "relative");
this.n = this.h.createElement("<canvas style=\"position : absolute; top : 0; left : 0\" />");
this.n.setStyleProperty("position", "absolute");
this.n.setStyleProperty("top", "0px");
this.n.setStyleProperty("left", "0px");
this.h.append(d);
d.append(this.n);
this.c = new RenderingContext(new CanvasViewRenderer(), this.h.get2DCanvasContext(this.n));
this.n.setAttribute("width", b.toString());
this.n.setAttribute("height", c.toString());
return this.c;
}
ai() {
return new Size(1, this.h.rootWrapper.width(), Math.max(10, this.h.rootWrapper.height() - 15));
}
ab(a, b, c, d) {
let e = a.h();
e.beginPath();
e.moveTo(b.an._inner[0].x, b.an._inner[0].y);
for (let f = 1; f < b.an.count; f++) {
e.lineTo(b.an._inner[f].x, b.an._inner[f].y);
}
e.lineTo(b.an._inner[0].x, b.an._inner[0].y);
let g = e.createLinearGradient(d.left, d.top, d.left, d.top + d.height);
for (let h of fromEnum(c.a)) {
g.addColorStop(h.a, h.b._fill);
}
e.fillStyle = g;
e.fill();
}
t() {
}
u() {
}
p(a) {
for (let b of fromEnum(this.g.values)) {
let c = this.ah(b);
if (c.containsPoint(a)) {
return b;
}
}
return null;
}
ah(a) {
let b = a.getOffset();
let c = this.h.rootWrapper.getOffset();
let d = { $type: Point_$type, x: b.left - c.left, y: b.top - c.top };
let e = a.width();
let f = a.height();
return new Rect(0, d.x, d.y, e, f);
}
ad(a) {
let b = this.p(a);
if (b != null) {
if (!this.e) {
this.a.c.a8(this.a.f(b));
}
this.o = b;
this.e = true;
}
else {
if (this.e) {
this.a.c.a8(this.a.f(this.o));
this.o = null;
}
this.e = false;
}
}
ac(a) {
this.ad(a);
let b = this.p(a);
this.a.c.ba(this.a.e(b));
}
ae() {
if (this.e) {
this.a.c.a8(this.a.f(this.o));
this.o = null;
}
this.e = false;
}
y(a) {
let b = this.m == null ? 0 : this.m.getChildCount();
for (let c = 0; c < b; c++) {
let d = this.m.getChildAt(c);
d.setStyleProperty("display", a ? "block" : "");
d.setStyleProperty("float", a ? "left" : "");
d.setStyleProperty("margin", a ? "0px" : "");
d.setStyleProperty("margin-right", a ? "8px" : "");
d.getChildAt(1).setStyleProperty("white-space", a ? "nowrap" : "");
}
}
af(a) {
this.m.setStyleProperty("color", a);
}
ag(a) {
let b = FontUtil.getFontInfoFromString(this.h, a);
this.m.setStyleProperty("font-family", b.q);
this.m.setStyleProperty("font-size", b.f + "px");
this.m.setStyleProperty("font-style", b.t);
}
}
LegendBaseViewManager.$t = markType(LegendBaseViewManager, 'LegendBaseViewManager');
return LegendBaseViewManager;
})();
/**
* @hidden
*/
export let LegendBase = /*@__PURE__*/ (() => {
class LegendBase extends ContentControl {
constructor() {
super();
this.ak = null;
this.at = false;
this.aw = null;
this.ax = null;
this.av = null;
this._seriesOwner = null;
this._chartOwner = null;
this.propertyChanged = null;
this.propertyUpdated = null;
this.legendItemMouseLeftButtonDown = null;
this.legendItemMouseLeftButtonUp = null;
this.legendItemMouseEnter = null;
this.legendItemMouseLeave = null;
this.legendItemMouseMove = null;
this.legendTextContentChanged = null;
let a = this.aj();
this.bd(a);
a.al();
this.aw = new ObservableCollection$1(UIElement.$, 0);
this.av = new ObservableCollection$1(LegendItemInfo.$, 0);
this.ax = new ObservableCollection$1(LegendItemInfo.$, 0);
let b = this.ax;
b.collectionChanged = delegateCombine(b.collectionChanged, (b, c) => this.at = true);
let c = this.aw;
c.collectionChanged = delegateCombine(c.collectionChanged, (c, d) => {
if (d.action == 4) {
this.ax.clear();
}
if (d.action == 1) {
this.ax.removeAt(d.oldStartingIndex);
}
});
this.a0 = "ig-chart-legend-items-list";
this.a1 = "ig-chart-legend-item";
this.az = "ig-chart-legend-item-badge";
this.a2 = "ig-chart-legend-item-text";
}
onDetachedFromUI() {
this.ak.ak();
}
onAttachedToUI() {
this.ak.ai();
}
aj() {
return new LegendBaseView(this);
}
bd(a) {
this.ak = a;
}
addChildInOrder(a, b) {
}
a5(a, b) {
}
get seriesOwner() {
return this._seriesOwner;
}
set seriesOwner(a) {
this._seriesOwner = a;
}
get chartOwner() {
return this._chartOwner;
}
set chartOwner(a) {
this._chartOwner = a;
}
get_isItemwise() {
return false;
}
get isItemwise() {
return this.get_isItemwise();
}
get_isScale() {
return false;
}
get isScale() {
return this.get_isScale();
}
clearLegendItemsForSeries(a) {
if (a == null || this.aw == null || this.aw.count == 0) {
return;
}
let b = new ObservableCollection$1(UIElement.$, 0);
for (let c of fromEnum(this.aw)) {
let d = typeCast(ContentControl.$, c);
if (d != null && d.content != null) {
let e = typeCast(ILegendContext_$type, d.content);
if (e != null && e.series == a) {
b.add(c);
}
}
}
for (let f of fromEnum(b)) {
this.aw.remove(f);
}
}
containsChild(a) {
return this.aw.contains(a);
}
removeChild(a) {
this.aw.remove(a);
}
get ai() {
if (this.seriesOwner != null) {
return this.seriesOwner;
}
else {
return this.chartOwner;
}
}
be(a, b, c) {
if (this.propertyChanged != null) {
this.propertyChanged(this, new PropertyChangedEventArgs(a));
}
if (this.propertyUpdated != null) {
this.propertyUpdated(this, new PropertyUpdatedEventArgs(a, b, c));
}
}
ba(a) {
if (this.legendItemMouseLeftButtonDown != null) {
this.legendItemMouseLeftButtonDown(this, a);
}
if (a.d != null) {
a.d.onLegendItemPointerDown(a.item);
}
}
bb(a) {
if (this.legendItemMouseLeftButtonUp != null) {
this.legendItemMouseLeftButtonUp(this, a);
}
if (a.d != null) {
a.d.onLegendItemPointerUp(a.item);
}
}
a8(a) {
if (this.legendItemMouseEnter != null) {
this.legendItemMouseEnter(this, a);
}
if (a.d != null) {
a.d.onLegendItemEnter(a.item);
}
}
a9(a) {
if (this.legendItemMouseLeave != null) {
this.legendItemMouseLeave(this, a);
}
if (a.d != null) {
a.d.onLegendItemLeave(a.item);
}
}
bc(a) {
if (this.legendItemMouseMove != null) {
this.legendItemMouseMove(this, a);
}
if (a.d != null) {
a.d.onLegendItemOver(a.item);
}
}
flushTextContentChangedCheck() {
this.a4();
}
a4() {
if (!this.at) {
return;
}
this.at = false;
if (this.legendTextContentChanged == null) {
return;
}
let a = false;
if (this.av.count != this.ax.count) {
a = true;
}
else {
for (let b = 0; b < this.ax.count; b++) {
let c = this.ax._inner[b];
let d = this.av._inner[b];
if (!Base.equalsStatic(c.d, d.d)) {
a = true;
break;
}
}
}
this.av.clear();
for (let e of fromEnum(this.ax)) {
this.av.add(((() => {
let $ret = new LegendItemInfo();
$ret.b = e.b;
$ret.c = e.c;
$ret.a = e.a;
$ret.d = e.d;
return $ret;
})()));
}
if (a) {
this.legendTextContentChanged(this, new LegendTextContentChangedEventArgs());
}
}
provideContainer(a) {
this.ak.aj(a);
}
get a0() {
return this.ak.t;
}
set a0(a) {
let b = this.ak.t;
this.ak.t = a;
if (b != a) {
}
}
get a1() {
return this.ak.u;
}
set a1(a) {
let b = this.ak.u;
this.ak.u = a;
if (b != a) {
}
}
get az() {
return this.ak.s;
}
set az(a) {
let b = this.ak.s;
this.ak.s = a;
if (b != a) {
}
}
get a2() {
return this.ak.v;
}
set a2(a) {
let b = this.ak.v;
this.ak.v = a;
if (b != a) {
}
}
exportVisualData() {
return this.ak.g();
}
exportSerializedVisualData() {
let a = this.exportVisualData();
return a.serialize();
}
get_isFinancial() {
return false;
}
get isFinancial() {
return this.get_isFinancial();
}
bh(a) {
this.ak.aq(a);
}
bg(a) {
this.ak.ap(a);
}
bi() {
this.ak.ar();
}
}
LegendBase.$t = markType(LegendBase, 'LegendBase', ContentControl.$, [INotifyPropertyChanged_$type, IChartLegend_$type]);
return LegendBase;
})();
/**
* @hidden
*/
export let LegendBaseView = /*@__PURE__*/ (() => {
class LegendBaseView extends Base {
constructor(a) {
super();
this.d = null;
this.c = null;
this.t = null;
this.u = null;
this.s = null;
this.v = null;
this.m = false;
this.j = false;
this.q = null;
this.r = null;
this.c = a;
this.d = new LegendBaseViewManager(this);
this.d.s();
}
ak() {
this.d.x();
}
ai() {
this.d.v();
}
al() {
}
get_k() {
return false;
}
get k() {
return this.get_k();
}
e(a) {
let b;
let c;
let d;
let e = this.ab(a, b, c, d);
b = e.p1;
c = e.p2;
d = e.p3;
let f = new MouseButtonEventArgs();
let g = new LegendMouseButtonEventArgs(b, c, d, f, a);
return g;
}
f(a) {
let b;
let c;
let d;
let e = this.ab(a, b, c, d);
b = e.p1;
c = e.p2;
d = e.p3;
let f = new MouseEventArgs();
let g = new LegendMouseEventArgs(b, c, d, f, a);
return g;
}
ab(a, b, c, d) {
b = this.c.ai;
c = null;
d = null;
if (a != null) {
let e = typeCast(ContentControl.$, a);
if (e != null && e.content != null && typeCast(ILegendContext_$type, e.content) !== null) {
let f = typeCast(ILegendContext_$type, e.content);
c = typeCast(ILegendSeries_$type, f.series);
if (c != null) {
b = c.container;
}
d = f.item;
}
}
return {
p1: b,
p2: c,
p3: d
};
}
aa() {
}
n() {
return true;
}
z(a) {
}
an(a) {
}
aj(a) {
this.d.w(a);
}
ao(a) {
this.d.aa(a);
}
y(a) {
let b = this.c.aw.indexOf(a);
this.d.r(a, b);
}
ag() {
this.d.t();
}
ah() {
this.d.u();
}
get l() {
return this.j;
}
set l(a) {
this.j = a;
this.d.y(this.j);
}
get w() {
return this.q;
}
set w(a) {
this.q = a;
this.d.af(this.q);
}
get x() {
return this.r;
}
set x(a) {
this.r = a;
this.d.ag(this.r);
}
am() {
this.d.s();
}
o(e_) {
let ev_ = e_.originalEvent;
return ev_.currentTarget;
}
p(e_) {
return this.d.q(this.o(e_));
}
ae(a) {
if (!this.m) {
this.c.a8(this.f(this.p(a)));
}
this.m = true;
}
ad(a) {
if (this.m) {
this.c.a9(this.f(this.p(a)));
}
this.m = false;
}
ac(a) {
this.c.ba(this.e(this.p(a)));
}
af(a) {
this.c.bb(this.e(this.p(a)));
}
i(a) {
let b = a.querySelectorAll("span *");
let c = Rect.empty;
for (let e = 0; e < b.length; e++) {
let d = b[e];
if (stringIsNullOrEmpty(d.getText())) {
continue;
}
let f = new Rect(0, d.getOffset().left, d.getOffset().top, d.width(), d.height());
f.union(c);
c = f;
}
return RectData.b(c);
}
h(a) {
let b = a.querySelectorAll("canvas");
let c = b.length > 0 ? b[0] : null;
return c != null ? new RectData(c.getOffset().left, c.getOffset().top, c.width(), c.height()) : null;
}
a(a) {
if (this.c == null || this.c.aw == null || this.c.aw.count <= a) {
return null;
}
let b = this.c.aw._inner[a];
if (b == null) {
return null;
}
let c = b.content;
if (c == null) {
return null;
}
let d = c.actualItemBrush != null ? c.actualItemBrush : c.itemBrush;
return AppearanceHelper.b(d);
}
b(a) {
if (this.c == null || this.c.aw == null || this.c.aw.count <= a) {
return null;
}
let b = this.c.aw._inner[a];
if (b == null) {
return null;
}
let c = b.content;
if (c == null) {
return null;
}
let d = c.outline;
return AppearanceHelper.b(d);
}
g() {
let a = new LegendVisualData();
let b = this.d.m;
let c = b.getChildCount();
for (let d = 0; d < c; d++) {
let e = new LegendItemVisualData();
let f = b.getChildAt(d);
e.label = f.getText();
e.label = e.label != null ? e.label.trim() : null;
e.bounds = new RectData(f.getOffset().left, f.getOffset().top, f.width(), f.height());
e.labelBounds = this.i(f);
e.badgeBounds = this.h(f);
e.appearance.fill = this.a(d);
e.appearance.stroke = this.b(d);
a.items.add(e);
}
for (let g = 0; g < this.c.aw.count; g++) {
a.items._inner[g].appearance.fill = this.a(g);
a.items._inner[g].appearance.stroke = this.b(g);
}
return a;
}
aq(a) {
this.d.ad(a);
}
ap(a) {
this.d.ac(a);
}
ar() {
this.d.ae();
}
}
LegendBaseView.$t = markType(LegendBaseView, 'LegendBaseView');
return LegendBaseView;
})();