mdt-charts 1.27.1 → 1.27.3

package/lib/engine/features/valueLabels/valueLabels.js

@@ -13,11 +13,9 @@ export class ChartValueLabels {
         this.chart = chart;
         this.renderPipeline = new Pipeline();
         this.attrsProvider = new ValueLabelsAttrsProvider();
+        this.options = chart.valueLabels;
         this.renderPipeline.push((valueLabels, { style }) => {
-            valueLabels
-                .attr('fill', 'currentColor')
-                .style('font-size', style.fontSize)
-                .style('color', style.color);
+            valueLabels.attr("fill", "currentColor").style("font-size", style.fontSize).style("color", style.color);
             if (style.cssClassName)
                 valueLabels.classed(style.cssClassName, true);
             return valueLabels;
@@ -27,83 +25,75 @@ export class ChartValueLabels {
         if (this.chart.isSegmented) {
             const preparedData = getStackedData(data, this.chart);
             preparedData.forEach((segment, segmentIndex) => {
-                this.renderByGroupIndex(scales, segmentIndex, segment, segment[0].fieldName, '1', d => d.data);
+                this.renderByGroupIndex(scales, segmentIndex, segment, segment[0].fieldName, "1", (d) => d.data);
             });
         }
         else {
             this.chart.data.valueFields.forEach((valueField, vfIndex) => {
-                this.renderByGroupIndex(scales, vfIndex, data, valueField.name, valueField.name, d => d);
+                this.renderByGroupIndex(scales, vfIndex, data, valueField.name, valueField.name, (d) => d);
             });
         }
     }
-    update(scales, newData) {
+    update(scales, newData, updatedOptions) {
         const updatePromises = [];
+        this.options = updatedOptions;
         if (this.chart.isSegmented) {
             const preparedData = getStackedData(newData, this.chart);
             preparedData.forEach((segment, segmentIndex) => {
-                const promise = this.updateByGroupIndex(scales, segmentIndex, segment, segment[0].fieldName, '1', d => d.data);
+                const promise = this.updateByGroupIndex(scales, segmentIndex, segment, segment[0].fieldName, "1", (d) => d.data);
                 updatePromises.push(promise);
             });
         }
         else {
             this.chart.data.valueFields.forEach((valueField, vfIndex) => {
-                const promise = this.updateByGroupIndex(scales, vfIndex, newData, valueField.name, valueField.name, d => d);
+                const promise = this.updateByGroupIndex(scales, vfIndex, newData, valueField.name, valueField.name, (d) => d);
                 updatePromises.push(promise);
             });
         }
         return Promise.all(updatePromises);
     }
     renderByGroupIndex(scales, groupIndex, data, valueFieldName, datumField, dataRowAccessor) {
-        let valueLabels = this.getAllValueLabelsOfChart(groupIndex)
-            .data(data)
-            .enter()
-            .append('text');
+        let valueLabels = this.getAllValueLabelsOfChart(groupIndex).data(data).enter().append("text");
         valueLabels = this.renderPipeline.execute(valueLabels, { style: this.globalOptions.canvas.style });
-        const attrs = this.attrsProvider.getAttrs(this.globalOptions, this.chart.valueLabels, scales, datumField, dataRowAccessor);
-        this.setAttrs(valueLabels, attrs, valueFieldName, this.chart.valueLabels.format, dataRowAccessor);
+        const attrs = this.attrsProvider.getAttrs(this.globalOptions, this.options, scales, datumField, dataRowAccessor);
+        this.setAttrs(valueLabels, attrs, valueFieldName, this.options.format, dataRowAccessor);
         this.setClasses(valueLabels, this.chart.cssClasses, groupIndex);
     }
     updateByGroupIndex(scales, groupIndex, data, valueFieldName, datumField, dataRowAccessor) {
         return new Promise((resolve) => {
-            const valueLabels = this.getAllValueLabelsOfChart(groupIndex)
-                .data(data);
+            const valueLabels = this.getAllValueLabelsOfChart(groupIndex).data(data);
             valueLabels.exit().remove();
-            const attrs = this.attrsProvider.getAttrs(this.globalOptions, this.chart.valueLabels, scales, datumField, dataRowAccessor);
-            let newValueLabels = valueLabels
-                .enter()
-                .append('text');
+            const attrs = this.attrsProvider.getAttrs(this.globalOptions, this.options, scales, datumField, dataRowAccessor);
+            let newValueLabels = valueLabels.enter().append("text");
             newValueLabels = this.renderPipeline.execute(newValueLabels, { style: this.globalOptions.canvas.style });
             const mergedValueLabels = newValueLabels.merge(valueLabels);
-            this.setAttrs(newValueLabels, attrs, valueFieldName, this.chart.valueLabels.format, dataRowAccessor);
+            this.setAttrs(newValueLabels, attrs, valueFieldName, this.options.format, dataRowAccessor);
             this.setClasses(mergedValueLabels, this.chart.cssClasses, groupIndex);
-            this.setAttrs(valueLabels, attrs, valueFieldName, this.chart.valueLabels.format, dataRowAccessor, true, resolve);
+            this.setAttrs(valueLabels, attrs, valueFieldName, this.options.format, dataRowAccessor, true, resolve);
         });
     }
     getAllValueLabelsOfChart(vfIndex) {
         const block = this.globalOptions.elementAccessors.getBlock().svg.getChartBlock();
-        return block
-            .selectAll(`.${ChartValueLabels.valueLabelClass}.${CLASSES.dataLabel}${Helper.getCssClassesLine(this.chart.cssClasses)}.chart-element-${vfIndex}`);
+        return block.selectAll(`.${ChartValueLabels.valueLabelClass}.${CLASSES.dataLabel}${Helper.getCssClassesLine(this.chart.cssClasses)}.chart-element-${vfIndex}`);
     }
     setAttrs(valueLabels, attrs, valueFieldName, formatter, dataRowAccessor, animate = false, onEndAnimation) {
-        const animationName = 'labels-updating';
+        const animationName = "labels-updating";
         valueLabels
-            .text(d => formatter(dataRowAccessor(d)[valueFieldName]))
-            .attr('dominant-baseline', attrs.dominantBaseline)
-            .attr('text-anchor', attrs.textAnchor);
+            .text((d) => formatter(dataRowAccessor(d)[valueFieldName]))
+            .attr("dominant-baseline", attrs.dominantBaseline)
+            .attr("text-anchor", attrs.textAnchor);
         if (animate) {
             const transition = valueLabels
                 .interrupt(animationName)
                 .transition(animationName)
                 .duration(this.globalOptions.elementAccessors.getBlock().transitionManager.durations.chartUpdate)
-                .attr('x', d => attrs.x(d))
-                .attr('y', d => attrs.y(d));
+                .attr("x", (d) => attrs.x(d))
+                .attr("y", (d) => attrs.y(d));
             if (onEndAnimation)
-                transition.on('end', onEndAnimation);
+                transition.on("end", onEndAnimation);
         }
         else {
-            valueLabels
-                .attr('x', d => attrs.x(d))
-                .attr('y', d => attrs.y(d));
+            valueLabels.attr("x", (d) => attrs.x(d)).attr("y", (d) => attrs.y(d));
         }
     }
     setClasses(textLabels, cssClasses, vfIndex) {
@@ -120,10 +110,10 @@ export class CanvasValueLabels {
     }
     render(scales, charts, data, dataOptions) {
         const valueLabelsSettings = this.options.canvas.valueLabels;
-        const chartsWithLabels = charts.filter(chart => { var _a; return (_a = chart.valueLabels) === null || _a === void 0 ? void 0 : _a.show; });
+        const chartsWithLabels = charts.filter((chart) => { var _a; return (_a = chart.valueLabels) === null || _a === void 0 ? void 0 : _a.show; });
         if (chartsWithLabels.length === 0)
             return;
-        chartsWithLabels.forEach(chart => {
+        chartsWithLabels.forEach((chart) => {
             const chartScales = this.getChartScales(scales, chart);
             const chartValueLabels = new ChartValueLabels(this.options, chart);
             this.chartsValueLabels.push(chartValueLabels);
@@ -134,14 +124,14 @@ export class CanvasValueLabels {
     }
     update(scales, charts, data, dataOptions) {
         const valueLabelsSettings = this.options.canvas.valueLabels;
-        const chartsWithLabels = charts.filter(chart => { var _a; return (_a = chart.valueLabels) === null || _a === void 0 ? void 0 : _a.show; });
+        const chartsWithLabels = charts.filter((chart) => { var _a; return (_a = chart.valueLabels) === null || _a === void 0 ? void 0 : _a.show; });
         if (chartsWithLabels.length === 0)
             return;
-        if (this.options.canvas.valueLabels.collision.otherValueLables.mode === 'hide')
+        if (this.options.canvas.valueLabels.collision.otherValueLables.mode === "hide")
             this.toggleOldValueLabelsVisibility();
         const chartsUpdatePromises = chartsWithLabels.map((chart, index) => {
             const chartScales = this.getChartScales(scales, chart);
-            return this.chartsValueLabels[index].update(chartScales, data[dataOptions.dataSource]);
+            return this.chartsValueLabels[index].update(chartScales, data[dataOptions.dataSource], chart.valueLabels);
         });
         Promise.all(chartsUpdatePromises).then(() => {
             const newValueLabels = this.getAllValueLabels();
@@ -151,14 +141,13 @@ export class CanvasValueLabels {
     toggleOldValueLabelsVisibility() {
         const oldValueLabels = this.getAllValueLabels();
         oldValueLabels.each(function () {
-            if (this.style.display === 'none')
-                select(this).style('display', 'block');
+            if (this.style.display === "none")
+                select(this).style("display", "block");
         });
     }
     getAllValueLabels() {
         const block = this.options.elementAccessors.getBlock().svg.getChartBlock();
-        return block
-            .selectAll(`.${ChartValueLabels.valueLabelClass}`);
+        return block.selectAll(`.${ChartValueLabels.valueLabelClass}`);
     }
     getChartScales(scales, chart) {
         return {

package/lib/engine/features/valueLabels/valueLabelsHelper.js

@@ -8,13 +8,13 @@ export class ValueLabelsAttrsProvider {
             textAnchor: valueLabels.textAnchor
         };
         const orient = globalOptions.canvas.keyAxisOrient;
-        if (orient === 'left' || orient === 'right') {
-            attrs.x = d => valueLabels.handleX(scales.value(valueLabels.handleScaledValue(d, datumField)));
-            attrs.y = d => valueLabels.handleY(Scale.getScaledValue(scales.key, dataRowAccessor(d)[globalOptions.data.keyFieldName]));
+        if (orient === "left" || orient === "right") {
+            attrs.x = (d) => valueLabels.handleX(scales.value(valueLabels.handleScaledValue(d, datumField)));
+            attrs.y = (d) => valueLabels.handleY(Scale.getScaledValue(scales.key, dataRowAccessor(d)[globalOptions.data.keyFieldName]));
         }
-        else if (orient === 'bottom' || orient === 'top') {
-            attrs.x = d => valueLabels.handleX(Scale.getScaledValue(scales.key, dataRowAccessor(d)[globalOptions.data.keyFieldName]));
-            attrs.y = d => valueLabels.handleY(scales.value(valueLabels.handleScaledValue(d, datumField)));
+        else if (orient === "bottom" || orient === "top") {
+            attrs.x = (d) => valueLabels.handleX(Scale.getScaledValue(scales.key, dataRowAccessor(d)[globalOptions.data.keyFieldName]));
+            attrs.y = (d) => valueLabels.handleY(scales.value(valueLabels.handleScaledValue(d, datumField)));
         }
         return attrs;
     }

package/lib/engine/features/valueLabelsCollision/valueLabelsCollision.js

@@ -4,7 +4,7 @@ export class ValueLabelsCollision {
     static resolveValueLabelsCollisions(newValueLabels, valueLabelsSettings) {
         const valueLabelElementsRectInfo = this.getValueLabelElementsRectInfo(newValueLabels);
         this.shiftValueLabelsCollision(valueLabelElementsRectInfo, valueLabelsSettings.collision.chartBlock);
-        if (valueLabelsSettings.collision.otherValueLables.mode === 'hide')
+        if (valueLabelsSettings.collision.otherValueLables.mode === "hide")
             this.toggleValueLabelElementsVisibility(valueLabelElementsRectInfo);
     }
     static getValueLabelElementsRectInfo(valueLabels) {
@@ -22,16 +22,16 @@ export class ValueLabelsCollision {
         return ValueLabelElementsReactInfo;
     }
     static shiftValueLabelsCollision(valueLabelElementsRectInfo, chartBlock) {
-        valueLabelElementsRectInfo.forEach(element => {
+        valueLabelElementsRectInfo.forEach((element) => {
             this.handleCollisionShift(chartBlock, element);
         });
     }
     static handleCollisionShift(chartBlock, element) {
         const sides = Object.keys(chartBlock);
-        sides.forEach(side => {
+        sides.forEach((side) => {
             const blockSide = chartBlock[side];
-            const axisCoordinate = side === 'left' || side === 'right' ? 'x' : 'y';
-            if (blockSide.mode === 'shift' && blockSide.hasCollision(element.boundingClientRect)) {
+            const axisCoordinate = side === "left" || side === "right" ? "x" : "y";
+            if (blockSide.mode === "shift" && blockSide.hasCollision(element.boundingClientRect)) {
                 blockSide.shiftCoordinate(element.boundingClientRect);
                 this.changeLabelElementCoordinateByAxis(element, axisCoordinate);
             }
@@ -39,14 +39,13 @@ export class ValueLabelsCollision {
     }
     static toggleValueLabelElementsVisibility(elements) {
         const labelsVisibility = ValueLabelsCollisionHelper.calculateValueLabelsVisibility(elements);
-        labelsVisibility.forEach(label => {
-            const labelInfo = elements.find(element => element.index === label.index);
+        labelsVisibility.forEach((label) => {
+            const labelInfo = elements.find((element) => element.index === label.index);
             if (labelInfo && !label.isVisible)
-                select(labelInfo.svgElement).style('display', 'none');
+                select(labelInfo.svgElement).style("display", "none");
         });
     }
     static changeLabelElementCoordinateByAxis(element, axis) {
-        select(element.svgElement)
-            .attr(axis, element.boundingClientRect[axis]);
+        select(element.svgElement).attr(axis, element.boundingClientRect[axis]);
     }
 }

package/lib/engine/features/valueLabelsCollision/valueLabelsCollisionHelper.js

@@ -3,13 +3,14 @@ export class ValueLabelsCollisionHelper {
         const sortedLabels = elements.sort((label1, label2) => label1.boundingClientRect.x - label2.boundingClientRect.x);
         const activeLabels = [];
         const labelsVisibility = new Map();
-        elements.forEach(label => {
+        elements.forEach((label) => {
             labelsVisibility.set(label.index, { index: label.index, isVisible: true });
         });
-        sortedLabels.forEach(currentLabel => {
+        sortedLabels.forEach((currentLabel) => {
             for (let i = activeLabels.length - 1; i >= 0; i--) {
                 const activeLabel = activeLabels[i];
-                if (activeLabel.boundingClientRect.x + activeLabel.boundingClientRect.width < currentLabel.boundingClientRect.x) {
+                if (activeLabel.boundingClientRect.x + activeLabel.boundingClientRect.width <
+                    currentLabel.boundingClientRect.x) {
                     activeLabels.splice(i, 1);
                 }
             }
@@ -43,5 +44,4 @@ export class ValueLabelsCollisionHelper {
             rect1.y + rect1.height < rect2.y ||
             rect1.y > rect2.y + rect2.height);
     }
-    ;
 }

package/lib/engine/filterManager/filterEventManager.js

@@ -23,20 +23,20 @@ export class FilterEventManager {
         this.fullDataset = newDataset;
     }
     isSelected(keyValue) {
-        return this.selectedKeys.findIndex(key => key === keyValue) !== -1;
+        return this.selectedKeys.findIndex((key) => key === keyValue) !== -1;
     }
     clearKeysFor2D(options) {
         this.selectedKeys = [];
         if (this.callback)
             this.callback([]);
-        this.eventEmitter.emit('change', this.selectedKeys);
+        this.eventEmitter.emit("change", this.selectedKeys);
         SelectHighlighter.clear2D(this.block, options);
     }
     clearKeysForPolar(margin, blockSize, options) {
         this.selectedKeys = [];
         if (this.callback)
             this.callback([]);
-        this.eventEmitter.emit('change', this.selectedKeys);
+        this.eventEmitter.emit("change", this.selectedKeys);
         SelectHighlighter.clearPolar(margin, blockSize, this.block, options, Donut.getAllArcGroups(this.block), options.chartCanvas);
     }
     setKey(key) {
@@ -46,11 +46,11 @@ export class FilterEventManager {
         this.selectedKeys.push(key);
     }
     removeId(key) {
-        this.selectedKeys.splice(this.selectedKeys.findIndex(k => k === key), 1);
+        this.selectedKeys.splice(this.selectedKeys.findIndex((k) => k === key), 1);
     }
     processKey(multySelect, keyValue) {
         if (multySelect) {
-            if (this.getSelectedKeys().findIndex(key => key === keyValue) === -1) {
+            if (this.getSelectedKeys().findIndex((key) => key === keyValue) === -1) {
                 this.addId(keyValue);
                 return true;
             }
@@ -73,22 +73,22 @@ export class FilterEventManager {
     setListenerPolar(margin, blockSize, options) {
         if (this.filterable) {
             this.registerEventToDonut(margin, blockSize, options, options.chartCanvas);
-            const selectedElems = Donut.getAllArcGroups(this.block).filter(d => this.selectedKeys.findIndex(sid => sid === d.data[options.data.keyField.name]) !== -1);
+            const selectedElems = Donut.getAllArcGroups(this.block).filter((d) => this.selectedKeys.findIndex((sid) => sid === d.data[options.data.keyField.name]) !== -1);
             this.selectedKeys = [];
-            selectedElems.dispatch('click', { bubbles: false, cancelable: true, detail: { multySelect: true } });
+            selectedElems.dispatch("click", { bubbles: false, cancelable: true, detail: { multySelect: true } });
         }
     }
     event2DUpdate(options) {
         if (this.filterable) {
             const removedKeys = [];
-            this.selectedKeys.forEach(key => {
-                if (this.fullDataset.findIndex(row => row[options.data.keyField.name] === key) === -1)
+            this.selectedKeys.forEach((key) => {
+                if (this.fullDataset.findIndex((row) => row[options.data.keyField.name] === key) === -1)
                     removedKeys.push(key);
             });
-            removedKeys.forEach(rKey => this.selectedKeys.splice(this.selectedKeys.findIndex(sKey => sKey === rKey), 1));
+            removedKeys.forEach((rKey) => this.selectedKeys.splice(this.selectedKeys.findIndex((sKey) => sKey === rKey), 1));
             if (removedKeys.length > 0)
                 this.eventEmitter.emit("change", this.selectedKeys);
-            this.selectedKeys.forEach(key => {
+            this.selectedKeys.forEach((key) => {
                 SelectHighlighter.click2DHandler(true, true, key, this.selectedKeys, this.block, options);
             });
         }
@@ -97,9 +97,10 @@ export class FilterEventManager {
         if (this.filterable) {
             const tipBox = TipBox.renderOrGet(this.block, margin, blockSize);
             const thisClass = this;
-            tipBox.on('click', function (e) {
+            tipBox.on("click", function (e) {
                 const multySelect = thisClass.getMultySelectParam(e);
-                const keyValue = e.detail.keyValue || TipBoxHelper.getKeyValueByPointer(pointer(e, this), options.orient, margin, blockSize, scaleKey, options.scale.key.type);
+                const keyValue = e.detail.keyValue ||
+                    TipBoxHelper.getKeyValueByPointer(pointer(e, this), options.orient, margin, blockSize, scaleKey, options.scale.key.type);
                 const appended = thisClass.processKey(multySelect, keyValue);
                 SelectHighlighter.click2DHandler(multySelect, appended, keyValue, thisClass.selectedKeys, thisClass.block, options);
                 if (thisClass.callback) {
@@ -112,7 +113,7 @@ export class FilterEventManager {
     registerEventToDonut(margin, blockSize, options, donutSettings) {
         const arcItems = Donut.getAllArcGroups(this.block);
         const thisClass = this;
-        arcItems.on('click', function (e, dataRow) {
+        arcItems.on("click", function (e, dataRow) {
             const multySelect = thisClass.getMultySelectParam(e);
             const keyValue = dataRow.data[options.data.keyField.name];
             const appended = thisClass.processKey(multySelect, keyValue);
@@ -129,7 +130,9 @@ export class FilterEventManager {
     getMultySelectParam(e) {
         const isMultyButtonToggle = this.getMultyParamByEvent(e);
         return isMultyButtonToggle === undefined
-            ? (e.detail.multySelect === undefined ? false : e.detail.multySelect)
+            ? e.detail.multySelect === undefined
+                ? false
+                : e.detail.multySelect
             : isMultyButtonToggle;
     }
 }

package/lib/engine/helpers/domHelper.d.ts

@@ -1,8 +1,8 @@
-import { Selection, BaseType } from 'd3-selection';
-import { MdtChartsDataRow } from '../../config/config';
+import { Selection, BaseType } from "d3-selection";
+import { MdtChartsDataRow } from "../../config/config";
 import { ChartStyle, TwoDimensionalChartModel } from "../../model/model";
 import { Block } from "../block/block";
-declare type StyleColorType = 'fill' | 'stroke';
+declare type StyleColorType = "fill" | "stroke";
 export declare enum SelectionCondition {
     Include = 0,
     Exclude = 1
@@ -25,7 +25,6 @@ export declare class DomHelper {
      * @returns Выборка по ключам
      */
     static getChartElementsByKeys<T extends BaseType>(initialSelection: Selection<T, MdtChartsDataRow, BaseType, unknown>, dataWrapped: boolean, keyFieldName: string, keyValues: string[], condition?: SelectionCondition): Selection<T, any, BaseType, unknown>;
-    static setChartGradientStyle(element: Selection<BaseType, unknown, BaseType, unknown>, chartIndex: number, valueIndex: number): void;
     private static setChartOpacity;
 }
 export {};

package/lib/engine/helpers/domHelper.js

@@ -1,6 +1,5 @@
 import { MarkDot } from "../features/markDots/markDot";
 import { Bar } from "../twoDimensionalNotation/bar/bar";
-import { getGradientId } from "../../model/notations/twoDimensional/styles";
 export var SelectionCondition;
 (function (SelectionCondition) {
     SelectionCondition[SelectionCondition["Include"] = 0] = "Include";
@@ -8,12 +7,12 @@ export var SelectionCondition;
 })(SelectionCondition || (SelectionCondition = {}));
 export class DomHelper {
     static setCssClasses(elem, cssClasses) {
-        cssClasses.forEach(cssClass => {
+        cssClasses.forEach((cssClass) => {
             elem.classed(cssClass, true);
         });
     }
     static get2DChartElements(block, chart) {
-        if (chart.type === 'line' || chart.type === 'area')
+        if (chart.type === "line" || chart.type === "area")
             return MarkDot.getMarkDotForChart(block, chart.cssClasses);
         else
             return Bar.get().getAllBarsForChart(block, chart.cssClasses);
@@ -32,15 +31,15 @@ export class DomHelper {
         elements.style(styleType, colorPalette[fieldIndex % colorPalette.length]);
     }
     static cropSvgLabels(labelBlocks, maxWidth) {
-        labelBlocks.nodes().forEach(node => {
+        labelBlocks.nodes().forEach((node) => {
             if (node.getBBox().width > maxWidth) {
                 const text = node.textContent;
                 let textLength = text.length;
                 while (node.getBBox().width > maxWidth && textLength > 0) {
-                    node.textContent = text.substring(0, --textLength) + '...';
+                    node.textContent = text.substring(0, --textLength) + "...";
                 }
                 if (textLength === 0)
-                    node.textContent = '';
+                    node.textContent = "";
             }
         });
     }
@@ -54,19 +53,16 @@ export class DomHelper {
      * @returns Выборка по ключам
      */
     static getChartElementsByKeys(initialSelection, dataWrapped, keyFieldName, keyValues, condition = SelectionCondition.Include) {
-        return initialSelection.filter(d => {
+        return initialSelection.filter((d) => {
             let i;
             if (dataWrapped)
-                i = keyValues.findIndex(kv => kv === d.data[keyFieldName]);
+                i = keyValues.findIndex((kv) => kv === d.data[keyFieldName]);
             else
-                i = keyValues.findIndex(kv => kv === d[keyFieldName]);
+                i = keyValues.findIndex((kv) => kv === d[keyFieldName]);
             return condition === SelectionCondition.Exclude ? i === -1 : i !== -1;
         });
     }
-    static setChartGradientStyle(element, chartIndex, valueIndex) {
-        element.style('fill', `url(#${getGradientId(chartIndex, valueIndex)})`);
-    }
     static setChartOpacity(elements, opacity) {
-        elements.attr('opacity', opacity);
+        elements.attr("opacity", opacity);
     }
 }

package/lib/engine/helpers/fontResizer/fontResizer.js

@@ -1,10 +1,10 @@
 import { resizeFont } from "./fontResizerService";
-export const FontResizer = new class {
+export const FontResizer = new (class {
     setSize(el, options) {
         const wrappedEl = new ResizedElement(el);
         resizeFont(wrappedEl, Object.assign(Object.assign({}, options), { elWrapper: new ResizedElement(options.elWrapper) }));
     }
-};
+})();
 export class ResizedElement {
     constructor(el) {
         this.el = el;

package/lib/engine/helpers/helper.js

@@ -1,21 +1,21 @@
 export class Helper {
     static getRowsByKeys(keys, keyFieldName, dataSet) {
-        return dataSet.filter(row => keys.findIndex(key => key === row[keyFieldName]) !== -1);
+        return dataSet.filter((row) => keys.findIndex((key) => key === row[keyFieldName]) !== -1);
     }
     static getKeysByIds(ids, keyFieldName, dataSet) {
         return this.extractKeysFromRows(keyFieldName, this.getRowsByIds(ids, dataSet));
     }
     static extractKeysFromRows(keyFieldName, dataSet) {
-        return dataSet.map(row => row[keyFieldName]);
+        return dataSet.map((row) => row[keyFieldName]);
     }
     static getRowsByIds(ids, dataSet) {
-        return dataSet.filter(row => ids.findIndex(id => id === row.$id) !== -1);
+        return dataSet.filter((row) => ids.findIndex((id) => id === row.$id) !== -1);
     }
     static getCssClassesLine(cssClasses) {
-        return '.' + cssClasses.join('.');
+        return "." + cssClasses.join(".");
     }
     static getCssClassesArray(cssClass) {
-        return cssClass.split(' ');
+        return cssClass.split(" ");
     }
     static getCssClassesWithElementIndex(cssClasses, index) {
         return cssClasses.concat([`chart-element-${index}`]);
@@ -27,7 +27,7 @@ export class Helper {
     static getTranslateNumbers(transformValue) {
         if (!transformValue)
             return [0, 0];
-        const translateNumbers = transformValue.substring(10, transformValue.length - 1).split(', ');
+        const translateNumbers = transformValue.substring(10, transformValue.length - 1).split(", ");
         const translateX = parseFloat(translateNumbers[0]);
         const translateY = parseFloat(translateNumbers[1]);
         return [translateX, translateY];
@@ -36,11 +36,11 @@ export class Helper {
         return numbers.reduce((acc, value) => acc + value, 0);
     }
     static parseFormattedToNumber(value, rankSpliter) {
-        return parseFloat(value.replace(rankSpliter, '.').split(/\s/).join(''));
+        return parseFloat(value.replace(rankSpliter, ".").split(/\s/).join(""));
     }
     static calcDigitsAfterDot(value) {
         const valueInString = value.toString();
-        const dotIndex = valueInString.lastIndexOf('.') === -1 ? valueInString.length : valueInString.lastIndexOf('.') + 1;
+        const dotIndex = valueInString.lastIndexOf(".") === -1 ? valueInString.length : valueInString.lastIndexOf(".") + 1;
         return valueInString.substring(dotIndex).length;
     }
     static checkDomainsEquality(oldDomain, newDomain) {
@@ -73,7 +73,12 @@ export class Helper {
      * Сравнивает старые и новые данные
      */
     static compareData(oldSource, newSource, sourceName) {
-        if (!oldSource || !newSource || !sourceName || !oldSource[sourceName] || !newSource[sourceName] || oldSource[sourceName].length !== newSource[sourceName].length)
+        if (!oldSource ||
+            !newSource ||
+            !sourceName ||
+            !oldSource[sourceName] ||
+            !newSource[sourceName] ||
+            oldSource[sourceName].length !== newSource[sourceName].length)
             return false;
         const oldData = oldSource[sourceName];
         const newData = newSource[sourceName];

package/lib/engine/helpers/namesHelper.js

@@ -3,7 +3,7 @@ export class NamesHelper {
         return this.prefix + classOfElem;
     }
     static getId(idName, blockId) {
-        return this.prefix + idName + '-' + blockId;
+        return this.prefix + idName + "-" + blockId;
     }
 }
-NamesHelper.prefix = 'mdt-charts-';
+NamesHelper.prefix = "mdt-charts-";

package/lib/engine/polarNotation/donut/DonutHelper.js

@@ -21,7 +21,7 @@ export class DonutHelper {
         return arc;
     }
     static getOuterRadius(margin, blockSize) {
-        return Math.min(blockSize.width - margin.left - margin.right, blockSize.height - margin.top - margin.bottom) / 2;
+        return (Math.min(blockSize.width - margin.left - margin.right, blockSize.height - margin.top - margin.bottom) / 2);
     }
     static getInnerRadius(outerRadius, thickness) {
         return outerRadius - thickness;
@@ -33,23 +33,21 @@ export class DonutHelper {
         };
     }
     static getArcGenerator(outerRadius, innerRadius) {
-        return arc()
-            .innerRadius(innerRadius)
-            .outerRadius(outerRadius);
+        return arc().innerRadius(innerRadius).outerRadius(outerRadius);
     }
     static getPieGenerator(valueField, padAngle) {
         return pie()
             .padAngle(padAngle)
             .sort(null)
-            .value(d => d[valueField]);
+            .value((d) => d[valueField]);
     }
     static mergeDataWithZeros(firstDataset, secondDataset, keyField, colorField) {
         const secondSet = new Set();
-        secondDataset.forEach(dataRow => {
+        secondDataset.forEach((dataRow) => {
             secondSet.add(dataRow[keyField]);
         });
         const onlyNew = firstDataset
-            .filter(d => !secondSet.has(d[keyField]))
+            .filter((d) => !secondSet.has(d[keyField]))
             .map((d, index, array) => {
             const data = {
                 keyField: array[index][keyField],
@@ -66,7 +64,7 @@ export class DonutHelper {
         if (unit === "px")
             return valueInPx;
         const minSideSize = Math.min(chartBlockSize.width, chartBlockSize.height);
-        return minSideSize / 2 * (valueInPx / 100);
+        return (minSideSize / 2) * (valueInPx / 100);
     }
     static getChartBlockSize(blockSize, margin) {
         return {

package/lib/engine/polarNotation/donut/donut.d.ts

@@ -1,8 +1,8 @@
-import { PieArcDatum } from 'd3-shape';
-import { Selection } from 'd3-selection';
+import { PieArcDatum } from "d3-shape";
+import { Selection } from "d3-selection";
 import { BlockMargin, DonutChartSettings, PolarChartModel } from "../../../model/model";
 import { Block } from "../../block/block";
-import { MdtChartsDataRow, Size } from '../../../config/config';
+import { MdtChartsDataRow, Size } from "../../../config/config";
 export interface Translate {
     x: number;
     y: number;