UNPKG

igniteui-webcomponents-charts

Version:

Ignite UI Web Components charting components for building rich data visualizations using TypeScript APIs.

870 lines (864 loc) 29.3 kB
import { HorizontalAlignment_$type } from "igniteui-webcomponents-core"; import { VerticalAlignment_$type } from "igniteui-webcomponents-core"; import { Visibility_$type } from "igniteui-webcomponents-core"; import { ValueAxisLabelLocation_$type } from "./ValueAxisLabelLocation"; import { AngleAxisLabelLocation_$type } from "./AngleAxisLabelLocation"; import { IgcDomainChartComponent } from "./igc-domain-chart-component"; import { getAllPropertyNames, toSpinal, brushToString, stringToBrush, ensureBool, ensureEnum, enumToString, arrayFindByName } from "igniteui-webcomponents-core"; /** * Represents a base class for domain charts with X/Y axes */ export let IgcRadialBaseChartComponent = /*@__PURE__*/ (() => { class IgcRadialBaseChartComponent extends IgcDomainChartComponent { /** * @hidden */ get i() { return this._implementation; } constructor() { super(); } connectedCallback() { if (super["connectedCallback"]) { super["connectedCallback"](); } if (this.i.connectedCallback) { this.i.connectedCallback(); } if (!this._attached) { this._attached = true; this._flushQueuedAttributes(); } } disconnectedCallback() { if (super["disconnectedCallback"]) { super["disconnectedCallback"](); } if (this.i.disconnectedCallback) { this.i.disconnectedCallback(); } if (this._attached) { this._attached = false; } } static get observedAttributes() { if (IgcRadialBaseChartComponent._observedAttributesIgcRadialBaseChartComponent == null) { let names = getAllPropertyNames(IgcRadialBaseChartComponent); for (let i = 0; i < names.length; i++) { names[i] = toSpinal(names[i]); } IgcRadialBaseChartComponent._observedAttributesIgcRadialBaseChartComponent = names; } return IgcRadialBaseChartComponent._observedAttributesIgcRadialBaseChartComponent; } /** * Gets or sets function which takes an context object and returns a formatted label for the X-axis. */ get angleAxisFormatLabel() { return this.i.aau; } set angleAxisFormatLabel(v) { this.i.aau = v; } /** * Gets or sets function which takes a context object and returns a formatted label for the Y-axis. */ get valueAxisFormatLabel() { return this.i.aav; } set valueAxisFormatLabel(v) { this.i.aav = v; } /** * Gets or sets the left margin of labels on the X-axis */ get angleAxisLabelLeftMargin() { return this.i.ab5; } set angleAxisLabelLeftMargin(v) { this.i.ab5 = +v; this._a("angleAxisLabelLeftMargin", this.i.ab5); } /** * Gets or sets the top margin of labels on the X-axis */ get angleAxisLabelTopMargin() { return this.i.ab7; } set angleAxisLabelTopMargin(v) { this.i.ab7 = +v; this._a("angleAxisLabelTopMargin", this.i.ab7); } /** * Gets or sets the right margin of labels on the X-axis */ get angleAxisLabelRightMargin() { return this.i.ab6; } set angleAxisLabelRightMargin(v) { this.i.ab6 = +v; this._a("angleAxisLabelRightMargin", this.i.ab6); } /** * Gets or sets the bottom margin of labels on the X-axis */ get angleAxisLabelBottomMargin() { return this.i.ab4; } set angleAxisLabelBottomMargin(v) { this.i.ab4 = +v; this._a("angleAxisLabelBottomMargin", this.i.ab4); } /** * Gets or sets the left margin of labels on the Y-axis */ get valueAxisLabelLeftMargin() { return this.i.acq; } set valueAxisLabelLeftMargin(v) { this.i.acq = +v; this._a("valueAxisLabelLeftMargin", this.i.acq); } /** * Gets or sets the top margin of labels on the Y-axis */ get valueAxisLabelTopMargin() { return this.i.acs; } set valueAxisLabelTopMargin(v) { this.i.acs = +v; this._a("valueAxisLabelTopMargin", this.i.acs); } /** * Gets or sets the right margin of labels on the Y-axis */ get valueAxisLabelRightMargin() { return this.i.acr; } set valueAxisLabelRightMargin(v) { this.i.acr = +v; this._a("valueAxisLabelRightMargin", this.i.acr); } /** * Gets or sets the bottom margin of labels on the Y-axis */ get valueAxisLabelBottomMargin() { return this.i.acp; } set valueAxisLabelBottomMargin(v) { this.i.acp = +v; this._a("valueAxisLabelBottomMargin", this.i.acp); } /** * Gets or sets color of labels on the X-axis */ get angleAxisLabelTextColor() { return brushToString(this.i.agx); } set angleAxisLabelTextColor(v) { this.i.agx = stringToBrush(v); this._a("angleAxisLabelTextColor", brushToString(this.i.agx)); } /** * Gets or sets color of labels on the Y-axis */ get valueAxisLabelTextColor() { return brushToString(this.i.ag4); } set valueAxisLabelTextColor(v) { this.i.ag4 = stringToBrush(v); this._a("valueAxisLabelTextColor", brushToString(this.i.ag4)); } /** * Gets the actual color of labels on the X-axis */ get actualAngleAxisLabelTextColor() { return brushToString(this.i.agv); } set actualAngleAxisLabelTextColor(v) { this.i.agv = stringToBrush(v); this._a("actualAngleAxisLabelTextColor", brushToString(this.i.agv)); } /** * Gets the actual color of labels on the Y-axis */ get actualValueAxisLabelTextColor() { return brushToString(this.i.agw); } set actualValueAxisLabelTextColor(v) { this.i.agw = stringToBrush(v); this._a("actualValueAxisLabelTextColor", brushToString(this.i.agw)); } /** * Gets or sets the margin around a title on the X-axis */ get angleAxisTitleMargin() { return this.i.acg; } set angleAxisTitleMargin(v) { this.i.acg = +v; this._a("angleAxisTitleMargin", this.i.acg); } /** * Gets or sets the margin around a title on the Y-axis */ get valueAxisTitleMargin() { return this.i.ac1; } set valueAxisTitleMargin(v) { this.i.ac1 = +v; this._a("valueAxisTitleMargin", this.i.ac1); } /** * Gets or sets the left margin of a title on the X-axis */ get angleAxisTitleLeftMargin() { return this.i.acf; } set angleAxisTitleLeftMargin(v) { this.i.acf = +v; this._a("angleAxisTitleLeftMargin", this.i.acf); } /** * Gets or sets the left margin of a title on the Y-axis */ get valueAxisTitleLeftMargin() { return this.i.ac0; } set valueAxisTitleLeftMargin(v) { this.i.ac0 = +v; this._a("valueAxisTitleLeftMargin", this.i.ac0); } /** * Gets or sets the top margin of a title on the X-axis */ get angleAxisTitleTopMargin() { return this.i.aci; } set angleAxisTitleTopMargin(v) { this.i.aci = +v; this._a("angleAxisTitleTopMargin", this.i.aci); } /** * Gets or sets the top margin of a title on the Y-axis */ get valueAxisTitleTopMargin() { return this.i.ac3; } set valueAxisTitleTopMargin(v) { this.i.ac3 = +v; this._a("valueAxisTitleTopMargin", this.i.ac3); } /** * Gets or sets the right margin of a title on the X-axis */ get angleAxisTitleRightMargin() { return this.i.ach; } set angleAxisTitleRightMargin(v) { this.i.ach = +v; this._a("angleAxisTitleRightMargin", this.i.ach); } /** * Gets or sets the right margin of a title on the Y-axis */ get valueAxisTitleRightMargin() { return this.i.ac2; } set valueAxisTitleRightMargin(v) { this.i.ac2 = +v; this._a("valueAxisTitleRightMargin", this.i.ac2); } /** * Gets or sets the bottom margin of a title on the X-axis */ get angleAxisTitleBottomMargin() { return this.i.ace; } set angleAxisTitleBottomMargin(v) { this.i.ace = +v; this._a("angleAxisTitleBottomMargin", this.i.ace); } /** * Gets or sets the bottom margin of a title on the Y-axis */ get valueAxisTitleBottomMargin() { return this.i.acz; } set valueAxisTitleBottomMargin(v) { this.i.acz = +v; this._a("valueAxisTitleBottomMargin", this.i.acz); } /** * Gets or sets color of title on the X-axis */ get angleAxisTitleTextColor() { return brushToString(this.i.ag3); } set angleAxisTitleTextColor(v) { this.i.ag3 = stringToBrush(v); this._a("angleAxisTitleTextColor", brushToString(this.i.ag3)); } /** * Gets or sets color of title on the Y-axis */ get valueAxisTitleTextColor() { return brushToString(this.i.aha); } set valueAxisTitleTextColor(v) { this.i.aha = stringToBrush(v); this._a("valueAxisTitleTextColor", brushToString(this.i.aha)); } /** * Gets or sets CSS font property for labels on X-axis */ get angleAxisLabelTextStyle() { return this.i.adw; } set angleAxisLabelTextStyle(v) { this.i.adw = v; } /** * Gets or sets CSS font property for labels on Y-axis */ get valueAxisLabelTextStyle() { return this.i.ae2; } set valueAxisLabelTextStyle(v) { this.i.ae2 = v; } /** * Gets or sets CSS font property for title on X-axis */ get angleAxisTitleTextStyle() { return this.i.aek; } set angleAxisTitleTextStyle(v) { this.i.aek = v; } /** * Gets or sets CSS font property for title on Y-axis */ get valueAxisTitleTextStyle() { return this.i.afq; } set valueAxisTitleTextStyle(v) { this.i.afq = v; } /** * Gets or sets the format for labels along the X-axis. */ get angleAxisLabel() { return this.i.ac6; } set angleAxisLabel(v) { this.i.ac6 = v; } /** * Gets or sets the property or string from which the labels are derived. */ get valueAxisLabel() { return this.i.ac7; } set valueAxisLabel(v) { this.i.ac7 = v; } /** * Gets or sets the color to apply to major gridlines along the X-axis. */ get angleAxisMajorStroke() { return brushToString(this.i.agy); } set angleAxisMajorStroke(v) { this.i.agy = stringToBrush(v); this._a("angleAxisMajorStroke", brushToString(this.i.agy)); } /** * Gets or sets the color to apply to major gridlines along the Y-axis. */ get valueAxisMajorStroke() { return brushToString(this.i.ag5); } set valueAxisMajorStroke(v) { this.i.ag5 = stringToBrush(v); this._a("valueAxisMajorStroke", brushToString(this.i.ag5)); } /** * Gets or sets the thickness to apply to major gridlines along the X-axis. */ get angleAxisMajorStrokeThickness() { return this.i.ab8; } set angleAxisMajorStrokeThickness(v) { this.i.ab8 = +v; this._a("angleAxisMajorStrokeThickness", this.i.ab8); } /** * Gets or sets the thickness to apply to major gridlines along the Y-axis. */ get valueAxisMajorStrokeThickness() { return this.i.act; } set valueAxisMajorStrokeThickness(v) { this.i.act = +v; this._a("valueAxisMajorStrokeThickness", this.i.act); } /** * Gets or sets the thickness to apply to minor gridlines along the X-axis. */ get angleAxisMinorStrokeThickness() { return this.i.ab9; } set angleAxisMinorStrokeThickness(v) { this.i.ab9 = +v; this._a("angleAxisMinorStrokeThickness", this.i.ab9); } /** * Gets or sets the thickness to apply to minor gridlines along the Y-axis. */ get valueAxisMinorStrokeThickness() { return this.i.acu; } set valueAxisMinorStrokeThickness(v) { this.i.acu = +v; this._a("valueAxisMinorStrokeThickness", this.i.acu); } /** * Gets or sets the color to apply to stripes along the X-axis. */ get angleAxisStrip() { return brushToString(this.i.ag0); } set angleAxisStrip(v) { this.i.ag0 = stringToBrush(v); this._a("angleAxisStrip", brushToString(this.i.ag0)); } /** * Gets or sets the color to apply to stripes along the Y-axis. */ get valueAxisStrip() { return brushToString(this.i.ag7); } set valueAxisStrip(v) { this.i.ag7 = stringToBrush(v); this._a("valueAxisStrip", brushToString(this.i.ag7)); } /** * Gets or sets the color to apply to the X-axis line. */ get angleAxisStroke() { return brushToString(this.i.ag1); } set angleAxisStroke(v) { this.i.ag1 = stringToBrush(v); this._a("angleAxisStroke", brushToString(this.i.ag1)); } /** * Gets or sets the color to apply to the Y-axis line. */ get valueAxisStroke() { return brushToString(this.i.ag8); } set valueAxisStroke(v) { this.i.ag8 = stringToBrush(v); this._a("valueAxisStroke", brushToString(this.i.ag8)); } /** * Gets or sets the thickness to apply to the X-axis line. */ get angleAxisStrokeThickness() { return this.i.aca; } set angleAxisStrokeThickness(v) { this.i.aca = +v; this._a("angleAxisStrokeThickness", this.i.aca); } /** * Gets or sets the thickness to apply to the Y-axis line. */ get valueAxisStrokeThickness() { return this.i.acv; } set valueAxisStrokeThickness(v) { this.i.acv = +v; this._a("valueAxisStrokeThickness", this.i.acv); } /** * Gets or sets the length of tickmarks along the X-axis. */ get angleAxisTickLength() { return this.i.acb; } set angleAxisTickLength(v) { this.i.acb = +v; this._a("angleAxisTickLength", this.i.acb); } /** * Gets or sets the length of tickmarks along the Y-axis. */ get valueAxisTickLength() { return this.i.acw; } set valueAxisTickLength(v) { this.i.acw = +v; this._a("valueAxisTickLength", this.i.acw); } /** * Gets or sets the color to apply to tickmarks along the X-axis. */ get angleAxisTickStroke() { return brushToString(this.i.ag2); } set angleAxisTickStroke(v) { this.i.ag2 = stringToBrush(v); this._a("angleAxisTickStroke", brushToString(this.i.ag2)); } /** * Gets or sets the color to apply to tickmarks along the Y-axis. */ get valueAxisTickStroke() { return brushToString(this.i.ag9); } set valueAxisTickStroke(v) { this.i.ag9 = stringToBrush(v); this._a("valueAxisTickStroke", brushToString(this.i.ag9)); } /** * Gets or sets the thickness to apply to tickmarks along the X-axis. */ get angleAxisTickStrokeThickness() { return this.i.acc; } set angleAxisTickStrokeThickness(v) { this.i.acc = +v; this._a("angleAxisTickStrokeThickness", this.i.acc); } /** * Gets or sets the thickness to apply to tickmarks along the Y-axis. */ get valueAxisTickStrokeThickness() { return this.i.acx; } set valueAxisTickStrokeThickness(v) { this.i.acx = +v; this._a("valueAxisTickStrokeThickness", this.i.acx); } /** * Gets or sets the Text to display below the X-axis. */ get angleAxisTitle() { return this.i.aeb; } set angleAxisTitle(v) { this.i.aeb = v; } /** * Gets or sets the Text to display to the left of the Y-axis. */ get valueAxisTitle() { return this.i.afh; } set valueAxisTitle(v) { this.i.afh = v; } /** * Gets or sets the color to apply to minor gridlines along the X-axis. */ get angleAxisMinorStroke() { return brushToString(this.i.agz); } set angleAxisMinorStroke(v) { this.i.agz = stringToBrush(v); this._a("angleAxisMinorStroke", brushToString(this.i.agz)); } /** * Gets or sets the color to apply to minor gridlines along the Y-axis. */ get valueAxisMinorStroke() { return brushToString(this.i.ag6); } set valueAxisMinorStroke(v) { this.i.ag6 = stringToBrush(v); this._a("valueAxisMinorStroke", brushToString(this.i.ag6)); } /** * Gets or sets the angle of rotation for labels along the X-axis. */ get angleAxisLabelAngle() { return this.i.ab3; } set angleAxisLabelAngle(v) { this.i.ab3 = +v; this._a("angleAxisLabelAngle", this.i.ab3); } /** * Gets or sets the angle of rotation for labels along the Y-axis. */ get valueAxisLabelAngle() { return this.i.aco; } set valueAxisLabelAngle(v) { this.i.aco = +v; this._a("valueAxisLabelAngle", this.i.aco); } /** * Gets or sets the distance between the X-axis and the bottom of the chart. */ get angleAxisExtent() { return this.i.ab2; } set angleAxisExtent(v) { this.i.ab2 = +v; this._a("angleAxisExtent", this.i.ab2); } /** * Gets or sets the distance between the Y-axis and the left edge of the chart. */ get valueAxisExtent() { return this.i.acn; } set valueAxisExtent(v) { this.i.acn = +v; this._a("valueAxisExtent", this.i.acn); } /** * Gets or sets the angle of rotation for the X-axis title. */ get angleAxisTitleAngle() { return this.i.acd; } set angleAxisTitleAngle(v) { this.i.acd = +v; this._a("angleAxisTitleAngle", this.i.acd); } /** * Gets or sets the angle of rotation for the Y-axis title. */ get valueAxisTitleAngle() { return this.i.acy; } set valueAxisTitleAngle(v) { this.i.acy = +v; this._a("valueAxisTitleAngle", this.i.acy); } /** * Gets or sets whether to invert the direction of the X-axis by placing the first data items on the right side of the chart. */ get angleAxisInverted() { return this.i.aa2; } set angleAxisInverted(v) { this.i.aa2 = ensureBool(v); this._a("angleAxisInverted", this.i.aa2); } /** * Gets or sets whether to invert the direction of the Y-axis by placing the minimum numeric value at the top of the chart. */ get valueAxisInverted() { return this.i.aa3; } set valueAxisInverted(v) { this.i.aa3 = ensureBool(v); this._a("valueAxisInverted", this.i.aa3); } /** * Gets or sets Horizontal alignment of the X-axis title. */ get angleAxisTitleAlignment() { return this.i.agd; } set angleAxisTitleAlignment(v) { this.i.agd = ensureEnum(HorizontalAlignment_$type, v); this._a("angleAxisTitleAlignment", enumToString(HorizontalAlignment_$type, this.i.agd)); } /** * Gets or sets Vertical alignment of the Y-axis title. */ get valueAxisTitleAlignment() { return this.i.ahg; } set valueAxisTitleAlignment(v) { this.i.ahg = ensureEnum(VerticalAlignment_$type, v); this._a("valueAxisTitleAlignment", enumToString(VerticalAlignment_$type, this.i.ahg)); } /** * Gets or sets Horizontal alignment of X-axis labels. */ get angleAxisLabelHorizontalAlignment() { return this.i.agc; } set angleAxisLabelHorizontalAlignment(v) { this.i.agc = ensureEnum(HorizontalAlignment_$type, v); this._a("angleAxisLabelHorizontalAlignment", enumToString(HorizontalAlignment_$type, this.i.agc)); } /** * Gets or sets Horizontal alignment of Y-axis labels. */ get valueAxisLabelHorizontalAlignment() { return this.i.age; } set valueAxisLabelHorizontalAlignment(v) { this.i.age = ensureEnum(HorizontalAlignment_$type, v); this._a("valueAxisLabelHorizontalAlignment", enumToString(HorizontalAlignment_$type, this.i.age)); } /** * Gets or sets Vertical alignment of X-axis labels. */ get angleAxisLabelVerticalAlignment() { return this.i.ahe; } set angleAxisLabelVerticalAlignment(v) { this.i.ahe = ensureEnum(VerticalAlignment_$type, v); this._a("angleAxisLabelVerticalAlignment", enumToString(VerticalAlignment_$type, this.i.ahe)); } /** * Gets or sets Vertical alignment of Y-axis labels. */ get valueAxisLabelVerticalAlignment() { return this.i.ahf; } set valueAxisLabelVerticalAlignment(v) { this.i.ahf = ensureEnum(VerticalAlignment_$type, v); this._a("valueAxisLabelVerticalAlignment", enumToString(VerticalAlignment_$type, this.i.ahf)); } /** * Gets or sets Visibility of X-axis labels. */ get angleAxisLabelVisibility() { return this.i.ahj; } set angleAxisLabelVisibility(v) { this.i.ahj = ensureEnum(Visibility_$type, v); this._a("angleAxisLabelVisibility", enumToString(Visibility_$type, this.i.ahj)); } /** * Gets or sets Visibility of Y-axis labels. */ get valueAxisLabelVisibility() { return this.i.ahk; } set valueAxisLabelVisibility(v) { this.i.ahk = ensureEnum(Visibility_$type, v); this._a("valueAxisLabelVisibility", enumToString(Visibility_$type, this.i.ahk)); } /** * Gets or sets location of Y-axis labels, relative to the plot area. */ get valueAxisLabelLocation() { return this.i.aaz; } set valueAxisLabelLocation(v) { this.i.aaz = ensureEnum(ValueAxisLabelLocation_$type, v); this._a("valueAxisLabelLocation", enumToString(ValueAxisLabelLocation_$type, this.i.aaz)); } /** * Gets or sets location of X-axis labels, relative to the plot area. */ get angleAxisLabelLocation() { return this.i.aap; } set angleAxisLabelLocation(v) { this.i.aap = ensureEnum(AngleAxisLabelLocation_$type, v); this._a("angleAxisLabelLocation", enumToString(AngleAxisLabelLocation_$type, this.i.aap)); } /** * Gets or sets the format string for the X axis label. */ get angleAxisLabelFormat() { return this.i.adn; } set angleAxisLabelFormat(v) { this.i.adn = v; } /** * Gets or sets the format specifiers to use with the AngleAxisLabelFormat string. */ get angleAxisLabelFormatSpecifiers() { return this.i.aam; } set angleAxisLabelFormatSpecifiers(v) { if (v && !Array.isArray(v) && typeof (v) == "string") { const re = /\s*(?:,|\s|$)\s*/gm; v = v.split(re); } this.i.aam = v; } /** * Gets or sets the format string for the Y axis label. */ get valueAxisLabelFormat() { return this.i.aet; } set valueAxisLabelFormat(v) { this.i.aet = v; } /** * Gets or sets the format specifiers to use with the ValueAxisLabelFormat string. */ get valueAxisLabelFormatSpecifiers() { return this.i.aan; } set valueAxisLabelFormatSpecifiers(v) { if (v && !Array.isArray(v) && typeof (v) == "string") { const re = /\s*(?:,|\s|$)\s*/gm; v = v.split(re); } this.i.aan = v; } findByName(name) { var baseResult = super.findByName(name); if (baseResult) { return baseResult; } if (this.angleAxisLabelFormatSpecifiers != null && arrayFindByName(this.angleAxisLabelFormatSpecifiers, name)) { return arrayFindByName(this.angleAxisLabelFormatSpecifiers, name); } if (this.valueAxisLabelFormatSpecifiers != null && arrayFindByName(this.valueAxisLabelFormatSpecifiers, name)) { return arrayFindByName(this.valueAxisLabelFormatSpecifiers, name); } return null; } /** * Called by the UI framework to provide a UI container for rendering this control. * @param container * The UI container element. */ provideContainer(container) { this.i.provideContainer(container); } /** * Converts the given visual location to a data value. * @param unscaledValue * The x-coordinate of the location to scale. */ getScaledAngle(unscaledValue) { let iv = this.i.acj(unscaledValue); return (iv); } /** * Converts the given data value to a visual location. * @param scaledValue * The data value to un-scale. */ getUnscaledAngle(scaledValue) { let iv = this.i.acl(scaledValue); return (iv); } /** * Converts the given visual location to a data value. * @param unscaledValue * The y-coordinate of the location to scale. */ getScaledValue(unscaledValue) { let iv = this.i.ack(unscaledValue); return (iv); } /** * Converts the given data value to a visual location. * @param scaledValue * The data value to un-scale. */ getUnscaledValue(scaledValue) { let iv = this.i.acm(scaledValue); return (iv); } } IgcRadialBaseChartComponent._observedAttributesIgcRadialBaseChartComponent = null; return IgcRadialBaseChartComponent; })();