mdt-charts 1.12.10 → 1.12.14

package/lib/config/config.d.ts

@@ -158,8 +158,8 @@ export interface MdtChartsAggregatorModel {
     data: MdtChartsDataRow[];
 }
 export interface MdtChartsAggregatorContent {
-    value: string | number;
-    title: string;
+    value?: string | number;
+    title?: string;
 }
 interface IntervalChartData {
     valueField1: MdtChartsValueField;

package/lib/designer/designerConfig.d.ts

@@ -30,7 +30,7 @@ interface BlockMargin {
     right: number;
 }
 export interface LegendBlockCanvas {
-    maxWidth: number;
+    maxWidth: number | string;
 }
 interface ChartOptionsCanvas {
     bar: BarOptionsCanvas;

package/lib/engine/features/axis/axis.js

@@ -1,11 +1,11 @@
 import { Scale } from "../scale/scale";
-import { AXIS_VERTICAL_LABEL_PADDING } from "../../../model/marginModel";
 import { NamesHelper } from '../../helpers/namesHelper';
 import { AxisHelper } from './axisHelper';
 import { AxisLabelHelper } from './axisLabelDomHelper';
 import { AxisDomHelper } from './axisDomHelper';
 import { select } from 'd3-selection';
 import { AxisLabelsEventManager } from './axisLabelsEventManager';
+import { AXIS_VERTICAL_LABEL_PADDING } from '../../../model/margin/twoDim/twoDimMarginModel';
 const MINIMAL_STEP_SIZE_FOR_WRAPPING = 38;
 export class Axis {
     static render(block, scales, scaleModel, axisModel, blockSize) {

package/lib/engine/features/axis/axisLabelDomHelper.js

@@ -1,7 +1,7 @@
 import { select } from 'd3-selection';
-import { AXIS_HORIZONTAL_LABEL_PADDING, AXIS_VERTICAL_LABEL_PADDING } from "../../../model/marginModel";
 import { DomHelper } from '../../helpers/domHelper';
 import { Helper } from '../../helpers/helper';
+import { AXIS_HORIZONTAL_LABEL_PADDING, AXIS_VERTICAL_LABEL_PADDING } from '../../../model/margin/twoDim/twoDimMarginModel';
 export class AxisLabelHelper {
     static setTitles(axisElement) {
         axisElement.selectAll('.tick text')

package/lib/model/chartStyleModel/TwoDimensionalChartStyleModel.js

@@ -1,5 +1,5 @@
 import * as chroma from "chroma-js";
-import { ModelHelper } from "../modelHelper";
+import { ModelHelper } from "../helpers/modelHelper";
 import { ChartStyleModelService } from "./chartStyleModel";
 export class TwoDimensionalChartStyleModel {
     constructor(charts, chartStyleConfig) {

package/lib/model/dataManagerModel/dataManagerModel.d.ts

@@ -11,8 +11,10 @@ export interface DataLegendParams {
 }
 export declare class DataManagerModel {
     private static service;
+    private static polarMarginCalculator;
     static getPreparedData(data: MdtChartsDataSource, allowableKeys: string[], config: MdtChartsConfig): MdtChartsDataSource;
     static initDataScope(config: MdtChartsConfig, data: MdtChartsDataSource, designerConfig: DesignerConfig, legendBlock: LegendBlockModel, modelInstance: ModelInstance): void;
+    private static initScopedData;
     static getDataValuesByKeyField(data: MdtChartsDataSource, dataSourceName: string, keyFieldName: string): string[];
     private static initDataScopeFor2D;
     private static initDataScopeForPolar;

package/lib/model/dataManagerModel/dataManagerModel.js

@@ -1,9 +1,9 @@
 import { AxisModel } from "../featuresModel/axisModel";
 import { LegendCanvasModel } from "../featuresModel/legendModel/legendCanvasModel";
-import { LegendPolarMarginCalculator } from "../featuresModel/legendModel/polarMarginCalculator";
-import { ModelHelper } from "../modelHelper";
+import { ModelHelper } from "../helpers/modelHelper";
 import { MIN_DONUT_BLOCK_SIZE, PolarModel } from "../notations/polar/polarModel";
 import { DataManagerModelService } from "./dataManagerModelService";
+import { LegendPolarMarginCalculator } from "../featuresModel/legendModel/polarMarginCalculator";
 export class DataManagerModel {
     static getPreparedData(data, allowableKeys, config) {
         const scopedData = this.getScopedData(data, allowableKeys, config);
@@ -17,6 +17,11 @@ export class DataManagerModel {
         else if (config.options.type === 'polar') {
             this.initDataScopeForPolar(config.options, modelInstance, data, legendBlock, designerConfig.canvas.legendBlock);
         }
+        this.initScopedData(data, modelInstance, config);
+    }
+    static initScopedData(data, modelInstance, config) {
+        const preparedData = DataManagerModel.getPreparedData(data, modelInstance.dataModel.getAllowableKeys(), config);
+        modelInstance.dataModel.repository.initScopedFullSource(preparedData);
     }
     static getDataValuesByKeyField(data, dataSourceName, keyFieldName) {
         return data[dataSourceName].map(dataRow => dataRow[keyFieldName]);
@@ -66,14 +71,13 @@ export class DataManagerModel {
         //TODO: global refactor of method
         const allowableKeys = keys.slice(0, maxItemsNumber);
         const hidedRecordsAmount = keys.length - maxItemsNumber;
-        const marginCalculator = new LegendPolarMarginCalculator();
-        marginCalculator.updateMargin(position, canvasModel, legendBlock, position === "bottom" ? size.height : size.width);
+        this.polarMarginCalculator.updateMargin(position, canvasModel, legendBlock, position === "bottom" ? size.height : size.width);
         modelInstance.dataModel.initScope(this.limitAllowableKeys(allowableKeys, hidedRecordsAmount, modelInstance.dataModel));
     }
     //TODO: position type
     static getLegendDataParams(position, keys, legendCanvas, canvasModel, legendBlock) {
         if (position === 'right') {
-            return LegendCanvasModel.findElementsAmountByLegendSize(keys, position, legendCanvas.maxWidth, canvasModel.getChartBlockHeight() - legendBlock.coordinate.bottom.margin.bottom);
+            return LegendCanvasModel.findElementsAmountByLegendSize(keys, position, this.polarMarginCalculator.getMaxLegendWidth(legendCanvas, canvasModel.getBlockSize().width), canvasModel.getChartBlockHeight() - legendBlock.coordinate.bottom.margin.bottom);
         }
         else {
             return LegendCanvasModel.findElementsAmountByLegendSize(keys, position, canvasModel.getChartBlockWidth() - legendBlock.coordinate.bottom.margin.left - legendBlock.coordinate.bottom.margin.right, canvasModel.getChartBlockHeight() - legendBlock.coordinate.bottom.margin.bottom - legendBlock.coordinate.bottom.margin.top - MIN_DONUT_BLOCK_SIZE);
@@ -143,3 +147,4 @@ export class DataManagerModel {
     }
 }
 DataManagerModel.service = new DataManagerModelService();
+DataManagerModel.polarMarginCalculator = new LegendPolarMarginCalculator();

package/lib/model/featuresModel/axisModel.js

@@ -1,4 +1,4 @@
-import { ModelHelper } from "../modelHelper";
+import { ModelHelper } from "../helpers/modelHelper";
 import { AxisType, CLASSES } from "../modelBuilder";
 import { DataManagerModel } from "../dataManagerModel/dataManagerModel";
 import { TwoDimensionalModel } from "../notations/twoDimensionalModel";

package/lib/model/featuresModel/legendModel/legendCanvasModel.d.ts

@@ -2,7 +2,6 @@ import { DataLegendParams } from "../../dataManagerModel/dataManagerModel";
 import { LegendPosition } from "../../model";
 export declare type LegendItemsDirection = 'row' | 'column';
 export declare class LegendCanvasModel {
-    static getLegendHeight(texts: string[], chartBlockWidth: number, itemsDirection: LegendItemsDirection, legendPosition: LegendPosition): number;
     static getLegendItemWidth(text: string): number;
     static findElementsAmountByLegendSize(texts: string[], position: LegendPosition, legendBlockWidth: number, legendBlockHeight: number): DataLegendParams;
     private static getLegendWrapperEl;

package/lib/model/featuresModel/legendModel/legendCanvasModel.js

@@ -1,30 +1,5 @@
 import { CLASSES } from "../../modelBuilder";
 export class LegendCanvasModel {
-    static getLegendHeight(texts, chartBlockWidth, itemsDirection, legendPosition) {
-        const legendWrapper = this.getLegendWrapperEl(chartBlockWidth, itemsDirection);
-        texts.forEach(text => {
-            const itemWrapper = document.createElement('div');
-            const colorBlock = document.createElement('span');
-            const textBlock = document.createElement('span');
-            itemWrapper.classList.add("legend-item");
-            if (legendPosition === 'bottom') {
-                itemWrapper.classList.add('legend-item-inline');
-                textBlock.classList.add('legend-label-nowrap');
-            }
-            else {
-                itemWrapper.classList.add('legend-item-row');
-            }
-            colorBlock.classList.add(CLASSES.legendColor);
-            textBlock.classList.add(CLASSES.legendLabel);
-            textBlock.textContent = text;
-            itemWrapper.append(colorBlock, textBlock);
-            legendWrapper.append(itemWrapper);
-        });
-        document.body.append(legendWrapper);
-        const height = legendWrapper.offsetHeight;
-        legendWrapper.remove();
-        return height + 1;
-    }
     static getLegendItemWidth(text) {
         const itemWrapper = document.createElement('div');
         itemWrapper.style.opacity = '0';

package/lib/model/featuresModel/legendModel/legendModel.d.ts

@@ -1,11 +1,7 @@
-import { ChartNotation, Size } from "../../../config/config";
-import { ILegendModel, LegendBlockModel, Orient } from "../../model";
+import { LegendBlockModel } from "../../model";
 import { CanvasModel } from "../../modelInstance/canvasModel/canvasModel";
 import { LegendItemsDirection } from "./legendCanvasModel";
 export declare class LegendModel {
-    static getLegendSize(chartNotation: ChartNotation, position: Orient, texts: string[], legendMaxWidth: number, blockSize: Size, legendBlockModel: LegendBlockModel): number;
-    static getBaseLegendBlockModel(notation: ChartNotation, canvasModel: CanvasModel): LegendBlockModel;
-    static getLegendModel(chartNotation: ChartNotation, legendShow: boolean, canvasModel: CanvasModel): ILegendModel;
+    static getBaseLegendBlockModel(canvasModel: CanvasModel): LegendBlockModel;
     static getLegendItemClass(itemsPosition: LegendItemsDirection): string;
-    private static getLegendWidth;
 }

package/lib/model/featuresModel/legendModel/legendModel.js

@@ -1,20 +1,5 @@
-import { ModelHelper } from "../../modelHelper";
-import { PolarModel } from "../../notations/polar/polarModel";
-import { LegendCanvasModel } from "./legendCanvasModel";
 export class LegendModel {
-    static getLegendSize(chartNotation, position, texts, legendMaxWidth, blockSize, legendBlockModel) {
-        if (position === 'left' || position === 'right')
-            return this.getLegendWidth(texts, legendMaxWidth);
-        //TODO: rm duplicate
-        if (chartNotation === '2d' || chartNotation === 'interval') {
-            return LegendCanvasModel.getLegendHeight(texts, blockSize.width - legendBlockModel.coordinate[position].margin.left - legendBlockModel.coordinate[position].margin.right, 'row', position);
-        }
-        else if (chartNotation === 'polar') {
-            const size = LegendCanvasModel.getLegendHeight(texts, blockSize.width - legendBlockModel.coordinate[position].margin.left - legendBlockModel.coordinate[position].margin.right, 'row', position);
-            return size;
-        }
-    }
-    static getBaseLegendBlockModel(notation, canvasModel) {
+    static getBaseLegendBlockModel(canvasModel) {
         const mt = 20, mb = 20, ml = 20, mr = 20;
         return {
             coordinate: {
@@ -25,12 +10,12 @@ export class LegendModel {
                 },
                 bottom: {
                     size: 0,
-                    margin: { top: 0, bottom: 20, left: 0, right: 0 },
+                    margin: { top: 10, bottom: 20, left: 0, right: 0 },
                     pad: 0
                 },
                 right: {
                     size: 0,
-                    margin: { top: canvasModel.titleCanvas.getAllNeededSpace(), bottom: mb, left: 5, right: 0 },
+                    margin: { top: canvasModel.titleCanvas.getAllNeededSpace(), bottom: mb, left: 15, right: 0 },
                     pad: 0
                 },
                 top: {
@@ -38,38 +23,10 @@ export class LegendModel {
                     margin: { top: 5, bottom: 10, left: 0, right: 0 },
                     pad: canvasModel.titleCanvas.getAllNeededSpace()
                 }
-            },
-            standartTooltip: notation === 'polar' ? false : true
-        };
-    }
-    static getLegendModel(chartNotation, legendShow, canvasModel) {
-        if (!legendShow)
-            return {
-                position: 'off'
-            };
-        let legendPosition = 'off';
-        if (chartNotation === '2d' || chartNotation === 'interval')
-            legendPosition = 'top';
-        else if (chartNotation === 'polar') {
-            legendPosition = PolarModel.getLegendPositionByBlockSize(canvasModel);
-        }
-        return {
-            position: legendPosition
+            }
         };
     }
     static getLegendItemClass(itemsPosition) {
         return itemsPosition === 'column' ? 'legend-item-row' : 'legend-item-inline';
     }
-    static getLegendWidth(texts, legendMaxWidth) {
-        let longestText = '';
-        let biggestScore = 0;
-        texts.forEach(text => {
-            if (ModelHelper.getStringScore(text) > biggestScore) {
-                longestText = text;
-                biggestScore = ModelHelper.getStringScore(text);
-            }
-        });
-        const maxWidth = LegendCanvasModel.getLegendItemWidth(longestText + '?'); // One letter reserve
-        return maxWidth > legendMaxWidth ? legendMaxWidth : maxWidth;
-    }
 }

package/lib/model/featuresModel/legendModel/polarMarginCalculator.d.ts

@@ -1,11 +1,8 @@
-import { MdtChartsDataSource, MdtChartsPolarOptions } from "../../../config/config";
+import { LegendBlockCanvas } from "../../../designer/designerConfig";
 import { LegendBlockModel } from "../../model";
 import { CanvasModel } from "../../modelInstance/canvasModel/canvasModel";
-import { ModelInstance } from "../../modelInstance/modelInstance";
 export declare class LegendPolarMarginCalculator {
-    recalcMargin(modelInstance: ModelInstance, options: MdtChartsPolarOptions, legendMaxWidth: number, legendBlockModel: LegendBlockModel, data: MdtChartsDataSource): void;
     updateMargin(legendPosition: "right" | "bottom", canvasModel: CanvasModel, legendBlockModel: LegendBlockModel, size: number): void;
+    getMaxLegendWidth(legendCanvas: LegendBlockCanvas, blockWidth: number): number;
     private updateMarginObj;
-    private getLegendSize;
-    private getLegendItemsContent;
 }

package/lib/model/featuresModel/legendModel/polarMarginCalculator.js

@@ -1,30 +1,20 @@
-import { DataManagerModel } from "../../dataManagerModel/dataManagerModel";
-import { MarginModel } from "../../marginModel";
-import { MIN_DONUT_BLOCK_SIZE } from "../../notations/polar/polarModel";
-import { LegendModel } from "./legendModel";
+import { getPxPercentUnitByValue } from "../../helpers/unitsFromConfigReader";
+import { MarginModel } from "../../margin/marginModel";
 export class LegendPolarMarginCalculator {
-    recalcMargin(modelInstance, options, legendMaxWidth, legendBlockModel, data) {
-        const canvasModel = modelInstance.canvasModel;
-        let legendPosition = LegendModel.getLegendModel(options.type, options.legend.show, modelInstance.canvasModel).position;
-        modelInstance.canvasModel.legendCanvas.setPosition(legendPosition);
-        if (legendPosition === "off")
-            return;
-        let legendSize = this.getLegendSize(options, legendMaxWidth, legendBlockModel, data, canvasModel, legendPosition);
-        if (legendPosition === "right" && canvasModel.getChartBlockWidth() - legendSize < MIN_DONUT_BLOCK_SIZE) {
-            legendSize = this.getLegendSize(options, legendMaxWidth, legendBlockModel, data, canvasModel, "bottom");
-            legendPosition = "bottom";
-            modelInstance.canvasModel.legendCanvas.setPosition(legendPosition);
-        }
-        if (legendSize !== 0) {
-            canvasModel.increaseMarginSide(legendPosition, legendSize);
-            MarginModel.appendToGlobalMarginValuesLegendMargin(canvasModel, legendPosition, legendBlockModel);
-        }
-        legendBlockModel.coordinate[legendPosition].size = legendSize;
-    }
     updateMargin(legendPosition, canvasModel, legendBlockModel, size) {
         canvasModel.legendCanvas.setPosition(legendPosition);
         this.updateMarginObj(legendBlockModel, legendPosition, size, canvasModel);
     }
+    getMaxLegendWidth(legendCanvas, blockWidth) {
+        const maxWidth = legendCanvas.maxWidth;
+        if (typeof maxWidth === "number")
+            return maxWidth;
+        const unit = getPxPercentUnitByValue(maxWidth);
+        const maxWidthNumber = parseInt(maxWidth);
+        if (unit === "px")
+            return maxWidthNumber;
+        return maxWidthNumber / 100 * blockWidth;
+    }
     updateMarginObj(legendBlockModel, legendPosition, legendSize, canvasModel) {
         if (legendSize !== 0) {
             canvasModel.increaseMarginSide(legendPosition, legendSize);
@@ -32,11 +22,4 @@ export class LegendPolarMarginCalculator {
         }
         legendBlockModel.coordinate[legendPosition].size = legendSize;
     }
-    getLegendSize(options, legendMaxWidth, legendBlockModel, data, canvasModel, legendPosition) {
-        const legendItemsContent = this.getLegendItemsContent(options, data);
-        return LegendModel.getLegendSize(options.type, legendPosition, legendItemsContent, legendMaxWidth, canvasModel.getBlockSize(), legendBlockModel);
-    }
-    getLegendItemsContent(options, data) {
-        return DataManagerModel.getDataValuesByKeyField(data, options.data.dataSource, options.data.keyField.name);
-    }
 }

package/lib/model/featuresModel/legendModel/twoDimLegendModel.d.ts

@@ -0,0 +1,7 @@
+import { LegendBlockModel } from "../../model";
+import { ModelInstance } from "../../modelInstance/modelInstance";
+export declare class TwoDimLegendModel {
+    recalcMarginWith2DLegend(modelInstance: ModelInstance, legendBlockModel: LegendBlockModel): void;
+    private getLegendSize;
+    private getLegendModel;
+}

package/lib/model/featuresModel/legendModel/twoDimLegendModel.js

@@ -0,0 +1,24 @@
+import { MarginModel } from "../../margin/marginModel";
+export class TwoDimLegendModel {
+    recalcMarginWith2DLegend(modelInstance, legendBlockModel) {
+        const canvasModel = modelInstance.canvasModel;
+        const legendPosition = this.getLegendModel().position;
+        modelInstance.canvasModel.legendCanvas.setPosition(legendPosition);
+        if (legendPosition !== 'off') {
+            const legendSize = this.getLegendSize();
+            canvasModel.increaseMarginSide(legendPosition, legendSize);
+            if (legendSize !== 0)
+                MarginModel.appendToGlobalMarginValuesLegendMargin(canvasModel, legendPosition, legendBlockModel);
+            legendBlockModel.coordinate[legendPosition].size = legendSize;
+        }
+    }
+    getLegendSize() {
+        const heightOfLegendItemWithoutWordWrapping = 20;
+        return heightOfLegendItemWithoutWordWrapping;
+    }
+    getLegendModel() {
+        return {
+            position: "top"
+        };
+    }
+}

package/lib/model/featuresModel/otherComponents.d.ts

@@ -1,11 +1,9 @@
 import { OtherCommonComponents } from "../model";
 import { ElementsOptions } from "../../designer/designerConfig";
-import { ChartNotation } from "../../config/config";
 import { ModelInstance } from "../modelInstance/modelInstance";
 interface OtherComponentsModelDependencies {
     elementsOptions: ElementsOptions;
     title: string;
-    notation: ChartNotation;
 }
 export declare class OtherComponentsModel {
     static getOtherComponentsModel(dependencies: OtherComponentsModelDependencies, modelInstance: ModelInstance): OtherCommonComponents;

package/lib/model/featuresModel/otherComponents.js

@@ -6,7 +6,7 @@ export class OtherComponentsModel {
         const canvasModel = modelInstance.canvasModel;
         canvasModel.titleCanvas.init(TitleModel.getTitleModel(dependencies.title));
         return {
-            legendBlock: LegendModel.getBaseLegendBlockModel(dependencies.notation, canvasModel),
+            legendBlock: LegendModel.getBaseLegendBlockModel(canvasModel),
             titleBlock: canvasModel.titleCanvas.getModel(),
             tooltipBlock: TooltipModel.getTooltipModel(dependencies.elementsOptions.tooltip)
         };

package/lib/model/featuresModel/scaleModel/scaleAxisRecalcer.js

@@ -19,7 +19,9 @@ export class ScaleAxisRecalcer {
                 : canvasModel.getChartBlockWidth()) - scaleValueFn(0));
         const key = chartOrientation === "vertical" ? keyAxisLabelVerticalLog : keyAxisLabelHorizontalLog;
         const logInfo = canvasModel.marginService.getDataByKey(key);
-        canvasModel.decreaseMarginSide(logInfo.side, logInfo.byValue - coordinateOnChartBlock < 0 ? logInfo.byValue : coordinateOnChartBlock);
+        if (logInfo) {
+            canvasModel.decreaseMarginSide(logInfo.side, logInfo.byValue - coordinateOnChartBlock < 0 ? logInfo.byValue : coordinateOnChartBlock);
+        }
     }
     getScaleValue() {
         const scale = this.generateScaleLinear();

package/lib/model/featuresModel/scaleModel/scaleModel.d.ts

@@ -7,10 +7,10 @@ export declare enum ScaleType {
 }
 export declare class ScaleModel {
     static getScaleKey(allowableKeys: string[], orient: ChartOrientation, canvasModel: CanvasModel, charts: MdtChartsTwoDimensionalChart[], barCharts: MdtChartsTwoDimensionalChart[]): ScaleKeyModel;
-    static getScaleLinear(options: MdtChartsTwoDimensionalOptions, data: MdtChartsDataSource, canvasModel: CanvasModel): ScaleValueModel;
+    static getScaleLinear(options: MdtChartsTwoDimensionalOptions, dataRows: MdtChartsDataRow[], canvasModel: CanvasModel): ScaleValueModel;
     static getRangePeek(scaleType: ScaleType, chartOrientation: string, canvasModel: CanvasModel): number;
     static getDateValueDomain(data: MdtChartsDataSource, chart: IntervalChart, keyAxisPosition: AxisPosition, dataSource: string): [Date, Date];
-    static getLinearDomain(configDomain: NumberDomain, data: MdtChartsDataSource, configOptions: MdtChartsTwoDimensionalOptions): [number, number];
+    static getLinearDomain(configDomain: NumberDomain, dataRows: MdtChartsDataRow[], configOptions: MdtChartsTwoDimensionalOptions): [number, number];
     static getScaleKeyType(charts: MdtChartsTwoDimensionalChart[]): ScaleKeyType;
     static getScaleValueType(charts: MdtChartsTwoDimensionalChart[] | IntervalChart[]): ScaleValueType;
     static getElementsAmount(barCharts: MdtChartsTwoDimensionalChart[]): number;

package/lib/model/featuresModel/scaleModel/scaleModel.js

@@ -1,4 +1,4 @@
-import { ModelHelper } from "../../modelHelper";
+import { ModelHelper } from "../../helpers/modelHelper";
 export var ScaleType;
 (function (ScaleType) {
     ScaleType[ScaleType["Key"] = 0] = "Key";
@@ -16,9 +16,9 @@ export class ScaleModel {
             elementsAmount: this.getElementsAmount(barCharts)
         };
     }
-    static getScaleLinear(options, data, canvasModel) {
+    static getScaleLinear(options, dataRows, canvasModel) {
         return {
-            domain: ScaleModel.getLinearDomain(options.axis.value.domain, data, options),
+            domain: ScaleModel.getLinearDomain(options.axis.value.domain, dataRows, options),
             range: {
                 start: 0,
                 end: ScaleModel.getRangePeek(ScaleType.Value, options.orientation, canvasModel)
@@ -43,15 +43,15 @@ export class ScaleModel {
             return [domainPeekMin, domainPeekMax];
         return [domainPeekMax, domainPeekMin];
     }
-    static getLinearDomain(configDomain, data, configOptions) {
+    static getLinearDomain(configDomain, dataRows, configOptions) {
         let domainPeekMin;
         let domainPeekMax;
         if (configDomain.start === -1)
-            domainPeekMin = this.getScaleMinValue(configOptions.charts, data[configOptions.data.dataSource]);
+            domainPeekMin = this.getScaleMinValue(configOptions.charts, dataRows);
         else
             domainPeekMin = configDomain.start;
         if (configDomain.end === -1)
-            domainPeekMax = this.getScaleMaxValue(configOptions.charts, data[configOptions.data.dataSource]);
+            domainPeekMax = this.getScaleMaxValue(configOptions.charts, dataRows);
         else
             domainPeekMax = configDomain.end;
         if (configOptions.axis.key.position === 'start')

package/lib/model/{modelHelper.d.ts → helpers/modelHelper.d.ts}

@@ -1,4 +1,4 @@
-import { MdtChartsDataSource, IntervalChart } from "../config/config";
+import { MdtChartsDataSource, IntervalChart } from "../../config/config";
 export declare class ModelHelper {
     static getSum(items: number[]): number;
     static getMinAndMaxOfIntervalData(data: MdtChartsDataSource, dataSource: string, chart: IntervalChart): [Date, Date];

package/lib/model/helpers/unitsFromConfigReader.d.ts

@@ -0,0 +1,2 @@
+import { UnitsFromConfig } from "../model";
+export declare function getPxPercentUnitByValue(value: number | string): UnitsFromConfig;

package/lib/model/helpers/unitsFromConfigReader.js

@@ -0,0 +1,7 @@
+import { UnitsReader } from "./unitsReader";
+export function getPxPercentUnitByValue(value) {
+    const unitsReader = new UnitsReader();
+    const defaultUnit = "px";
+    const units = ["%", "px"];
+    return unitsReader.getUnitByValue(value, defaultUnit, units);
+}

package/lib/model/helpers/unitsReader.d.ts

@@ -0,0 +1,5 @@
+import { UnitsFromConfig } from "../model";
+export declare class UnitsReader {
+    getUnitByValue<T extends string = UnitsFromConfig>(value: string | number, defaultUnit: T, units: T[]): T;
+    private getLastUnitFromString;
+}

package/lib/model/helpers/unitsReader.js

@@ -0,0 +1,15 @@
+export class UnitsReader {
+    getUnitByValue(value, defaultUnit, units) {
+        if (typeof value !== "string")
+            return defaultUnit;
+        return this.getLastUnitFromString(value, units) || defaultUnit;
+    }
+    getLastUnitFromString(value, units) {
+        let resultUnit = null;
+        units.forEach(unit => {
+            if (value.endsWith(unit))
+                resultUnit = unit;
+        });
+        return resultUnit;
+    }
+}

package/lib/model/margin/marginModel.d.ts

@@ -0,0 +1,11 @@
+import { MdtChartsConfig, MdtChartsDataSource, MdtChartsTwoDimensionalOptions } from "../../config/config";
+import { DesignerConfig } from "../../designer/designerConfig";
+import { LegendBlockModel, Orient, OtherCommonComponents } from "../model";
+import { ModelInstance } from "../modelInstance/modelInstance";
+import { CanvasModel } from "../modelInstance/canvasModel/canvasModel";
+export declare class MarginModel {
+    static initMargin(designerConfig: DesignerConfig, config: MdtChartsConfig, otherComponents: OtherCommonComponents, data: MdtChartsDataSource, modelInstance: ModelInstance): void;
+    static recalcMarginByVerticalAxisLabel(modelInstance: ModelInstance, options: MdtChartsTwoDimensionalOptions, designerConfig: DesignerConfig): void;
+    static appendToGlobalMarginValuesLegendMargin(canvasModel: CanvasModel, position: Orient, legendBlockModel: LegendBlockModel): void;
+    private static recalcMarginByTitle;
+}

package/lib/model/margin/marginModel.js

@@ -0,0 +1,26 @@
+import { TwoDimMarginModel } from "./twoDim/twoDimMarginModel";
+export class MarginModel {
+    static initMargin(designerConfig, config, otherComponents, data, modelInstance) {
+        const canvasModel = modelInstance.canvasModel;
+        canvasModel.initMargin(Object.assign({}, designerConfig.canvas.chartBlockMargin));
+        this.recalcMarginByTitle(canvasModel, otherComponents.titleBlock);
+        if (config.options.type === '2d') {
+            const twoDimModel = new TwoDimMarginModel();
+            twoDimModel.recalcMargin(designerConfig, config.options, otherComponents, data, modelInstance);
+        }
+    }
+    static recalcMarginByVerticalAxisLabel(modelInstance, options, designerConfig) {
+        const twoDimModel = new TwoDimMarginModel();
+        twoDimModel.recalcMarginByVerticalAxisLabel(modelInstance, options, designerConfig);
+    }
+    static appendToGlobalMarginValuesLegendMargin(canvasModel, position, legendBlockModel) {
+        const legendCoordinate = legendBlockModel.coordinate;
+        if (position === 'left' || position === 'right')
+            canvasModel.increaseMarginSide(position, legendCoordinate[position].margin.left + legendCoordinate[position].margin.right);
+        else
+            canvasModel.increaseMarginSide(position, legendCoordinate[position].margin.top + legendCoordinate[position].margin.bottom);
+    }
+    static recalcMarginByTitle(canvasModel, titleBlockModel) {
+        canvasModel.increaseMarginSide("top", titleBlockModel.margin.top + titleBlockModel.size + titleBlockModel.margin.bottom);
+    }
+}

package/lib/model/margin/twoDim/twoDimMarginModel.d.ts

@@ -0,0 +1,14 @@
+import { MdtChartsDataSource, MdtChartsTwoDimensionalOptions } from "../../../config/config";
+import { DesignerConfig } from "../../../designer/designerConfig";
+import { OtherCommonComponents } from "../../model";
+import { ModelInstance } from "../../modelInstance/modelInstance";
+export declare const AXIS_HORIZONTAL_LABEL_PADDING = 15;
+export declare const AXIS_VERTICAL_LABEL_PADDING = 10;
+export declare class TwoDimMarginModel {
+    private twoDimLegendModel;
+    recalcMargin(designerConfig: DesignerConfig, options: MdtChartsTwoDimensionalOptions, otherComponents: OtherCommonComponents, data: MdtChartsDataSource, modelInstance: ModelInstance): void;
+    recalcMarginByVerticalAxisLabel(modelInstance: ModelInstance, options: MdtChartsTwoDimensionalOptions, designerConfig: DesignerConfig): void;
+    private getHorizontalMarginByAxisLabels;
+    private recalcVerticalMarginByAxisLabelHeight;
+    private recalcHorizontalMarginByAxisLabelWidth;
+}

package/lib/model/margin/twoDim/twoDimMarginModel.js

@@ -0,0 +1,69 @@
+import { DataManagerModel } from "../../dataManagerModel/dataManagerModel";
+import { AxisModel } from "../../featuresModel/axisModel";
+import { TwoDimLegendModel } from "../../featuresModel/legendModel/twoDimLegendModel";
+import { keyAxisLabelHorizontalLog, keyAxisLabelVerticalLog } from "../../featuresModel/scaleModel/scaleAxisRecalcer";
+import { AxisType } from "../../modelBuilder";
+import { TwoDimensionalModel } from "../../notations/twoDimensionalModel";
+export const AXIS_HORIZONTAL_LABEL_PADDING = 15;
+export const AXIS_VERTICAL_LABEL_PADDING = 10;
+export class TwoDimMarginModel {
+    constructor() {
+        this.twoDimLegendModel = new TwoDimLegendModel();
+    }
+    recalcMargin(designerConfig, options, otherComponents, data, modelInstance) {
+        const canvasModel = modelInstance.canvasModel;
+        this.twoDimLegendModel.recalcMarginWith2DLegend(modelInstance, otherComponents.legendBlock);
+        const labelSize = this.getHorizontalMarginByAxisLabels(designerConfig.canvas.axisLabel.maxSize.main, options.axis, data, options);
+        this.recalcVerticalMarginByAxisLabelHeight(labelSize, canvasModel, options.orientation, options.axis);
+        // Если встроенный лейбл показывает ключи, то лейблы оси ключей не показываются
+        // При этом все графики должны иметь: embeddedLabels = 'key'
+        // И все графики должны быть типа bar. 
+        const showingFlag = options.type === '2d'
+            ? !TwoDimensionalModel.getChartsEmbeddedLabelsFlag(options.charts, options.orientation)
+            : true;
+        this.recalcHorizontalMarginByAxisLabelWidth(labelSize, canvasModel, options.orientation, options.axis, showingFlag);
+    }
+    recalcMarginByVerticalAxisLabel(modelInstance, options, designerConfig) {
+        if (options.orientation === 'vertical') {
+            const dataModel = modelInstance.dataModel;
+            const axisLabelSize = AxisModel.getLabelSize(designerConfig.canvas.axisLabel.maxSize.main, dataModel.getAllowableKeys());
+            const axisConfig = AxisModel.getKeyAxisLabelPosition(modelInstance.canvasModel, dataModel.getAllowableKeys().length, options.axis.key);
+            const marginOrient = options.axis.key.position === 'end' ? 'bottom' : 'top';
+            if (axisConfig === 'rotated') {
+                modelInstance.canvasModel.decreaseMarginSide(marginOrient, axisLabelSize.height);
+                modelInstance.canvasModel.increaseMarginSide(marginOrient, axisLabelSize.width, keyAxisLabelVerticalLog);
+            }
+        }
+    }
+    getHorizontalMarginByAxisLabels(labelsMaxWidth, axis, data, options) {
+        const keyAxisOrient = AxisModel.getAxisOrient(AxisType.Key, options.orientation, axis.key.position);
+        let labelsTexts;
+        if (keyAxisOrient === 'left' || keyAxisOrient === 'right') {
+            labelsTexts = DataManagerModel.getDataValuesByKeyField(data, options.data.dataSource, options.data.keyField.name);
+        }
+        else {
+            labelsTexts = ['0000'];
+        }
+        return AxisModel.getLabelSize(labelsMaxWidth, labelsTexts);
+    }
+    recalcVerticalMarginByAxisLabelHeight(labelSize, canvasModel, orientation, axis) {
+        const keyAxisOrient = AxisModel.getAxisOrient(AxisType.Key, orientation, axis.key.position);
+        const valueAxisOrient = AxisModel.getAxisOrient(AxisType.Value, orientation, axis.value.position);
+        if ((keyAxisOrient === 'bottom' || keyAxisOrient === 'top')) {
+            if (axis.key.visibility)
+                canvasModel.increaseMarginSide(keyAxisOrient, labelSize.height + AXIS_HORIZONTAL_LABEL_PADDING, keyAxisLabelVerticalLog);
+        }
+        else if (axis.value.visibility)
+            canvasModel.increaseMarginSide(valueAxisOrient, labelSize.height + AXIS_HORIZONTAL_LABEL_PADDING);
+    }
+    recalcHorizontalMarginByAxisLabelWidth(labelSize, canvasModel, orientation, axis, isShow) {
+        const keyAxisOrient = AxisModel.getAxisOrient(AxisType.Key, orientation, axis.key.position);
+        const valueAxisOrient = AxisModel.getAxisOrient(AxisType.Value, orientation, axis.value.position);
+        if ((keyAxisOrient === 'left' || keyAxisOrient === 'right') && isShow && axis.key.visibility) {
+            canvasModel.increaseMarginSide(keyAxisOrient, labelSize.width + AXIS_VERTICAL_LABEL_PADDING, keyAxisLabelHorizontalLog);
+        }
+        else if ((valueAxisOrient === 'left' || valueAxisOrient === 'right') && axis.value.visibility) {
+            canvasModel.increaseMarginSide(valueAxisOrient, labelSize.width + AXIS_VERTICAL_LABEL_PADDING);
+        }
+    }
+}