mdt-charts 1.12.3 → 1.12.4

package/lib/engine/features/aggregator/aggregator.d.ts

@@ -6,7 +6,7 @@ export interface AggregatorInfo {
     name: string;
     value: number | string;
     format: DataType;
-    margin: number;
+    marginInPercent: number;
 }
 export declare class Aggregator {
     static readonly aggregatorValueClass = "aggregator-value";

package/lib/engine/features/aggregator/aggregator.js

@@ -15,26 +15,28 @@ export class Aggregator {
             name: settings.content.title,
             value: settings.content.value,
             format: valueField.format,
-            margin: settings.margin
+            marginInPercent: settings.margin
         };
     }
     static renderText(block, innerRadius, aggregatorInfo, fontSize, translate) {
-        if (innerRadius > 40) {
+        if (innerRadius > 30) {
             const aggregatorObject = this.renderAggregatorObject(block, innerRadius, translate);
             const wrapper = this.renderWrapper(aggregatorObject);
             wrapper
                 .append('div')
                 .attr('class', this.aggregatorValueClass)
+                .attr('title', this.formatValue(aggregatorInfo.format, aggregatorInfo.value))
                 .style('text-align', 'center')
                 .style('font-size', `${fontSize}px`)
                 .text(this.formatValue(aggregatorInfo.format, aggregatorInfo.value));
-            wrapper
+            const titleBlock = wrapper
                 .append('div')
                 .attr('class', this.aggregatorTitleClass)
                 .attr('title', aggregatorInfo.name)
                 .style('text-align', 'center')
                 .text(aggregatorInfo.name);
-            this.reCalculateAggregatorFontSize(aggregatorObject.node().getBoundingClientRect().width, block, aggregatorInfo.margin);
+            this.setTitleFontSize(titleBlock, innerRadius);
+            this.reCalculateAggregatorFontSize(aggregatorObject.node().getBoundingClientRect().width, block, aggregatorInfo.marginInPercent);
         }
     }
     static formatValue(format, value) {
@@ -63,26 +65,25 @@ export class Aggregator {
             const interpolateFunc = interpolateNumber(oldValue, newValue);
             return t => {
                 this.textContent = thisClass.formatValue(newAggregator.format, parseFloat((interpolateFunc(t)).toFixed(precision)));
-                thisClass.reCalculateAggregatorFontSize(aggregatorObject.node().getBoundingClientRect().width, block, newAggregator.margin);
+                thisClass.reCalculateAggregatorFontSize(aggregatorObject.node().getBoundingClientRect().width, block, newAggregator.marginInPercent);
             };
         });
     }
     static reCalculateAggregatorFontSize(wrapperSize, block, pad) {
         const aggregatorValue = block.getSvg()
             .select(`.${this.aggregatorValueClass}`);
-        const aggregatorTitle = block.getSvg()
-            .select(`.${this.aggregatorTitleClass}`);
-        let fontSize = parseInt(aggregatorValue.style('font-size'));
-        while (aggregatorValue.node().getBoundingClientRect().width > wrapperSize - pad * 2 && fontSize > 12) {
+        const sizeCoefficient = 0.25;
+        let fontSize = wrapperSize * sizeCoefficient;
+        aggregatorValue.style('font-size', `${fontSize}px`);
+        const margin = pad / 100 * wrapperSize;
+        while (aggregatorValue.node().getBoundingClientRect().width > wrapperSize - margin * 2 && fontSize > 12) {
             aggregatorValue.style('font-size', `${fontSize -= 2}px`);
         }
-        while (aggregatorValue.node().getBoundingClientRect().width < wrapperSize - pad * 2 && fontSize < 60) {
-            aggregatorValue.style('font-size', `${fontSize += 2}px`);
-        }
-        this.setTitleFontSize(aggregatorTitle, fontSize);
     }
-    static setTitleFontSize(aggregatorTitle, valueFontSize) {
-        aggregatorTitle.style('font-size', `${Math.round(valueFontSize * 0.5)}px`);
+    static setTitleFontSize(aggregatorTitle, innerRadius) {
+        const sizeCoefficient = 0.15;
+        aggregatorTitle.style('font-size', `${Math.round(innerRadius * sizeCoefficient)}px`);
+        aggregatorTitle.style('max-height', `${sizeCoefficient * 100}%`);
     }
     static renderAggregatorObject(block, innerRadius, translate) {
         return block.getSvg()

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

@@ -30,12 +30,12 @@ export class LegendModel {
                 },
                 right: {
                     size: 0,
-                    margin: { top: canvasModel.titleCanvas.getAllNeededSpace(), bottom: mb, left: 10, right: 0 },
+                    margin: { top: canvasModel.titleCanvas.getAllNeededSpace(), bottom: mb, left: 5, right: 0 },
                     pad: 0
                 },
                 top: {
                     size: 0,
-                    margin: { top: 10, bottom: 10, left: 20, right: 20 },
+                    margin: { top: 5, bottom: 10, left: 0, right: 0 },
                     pad: canvasModel.titleCanvas.getAllNeededSpace()
                 }
             },

package/lib/model/featuresModel/titleModel.js

@@ -4,7 +4,7 @@ export class TitleModel {
         const pad = titleText ? defaultPads : 0;
         return {
             margin: {
-                bottom: 10,
+                bottom: 5,
                 left: 0,
                 right: 0,
                 top: 0

package/lib/model/modelBuilder.js

@@ -30,16 +30,16 @@ function getChartBlockModel(modelInstance) {
         margin: modelInstance.canvasModel.getMargin()
     };
 }
-function getOptions(config, designerConfig, modelInstance, dataScope, data) {
+function getOptions(config, designerConfig, modelInstance, data) {
     //TODO: migrate to polymorphism
     if (config.options.type === '2d') {
-        return TwoDimensionalModel.getOptions(config.options, designerConfig, dataScope, data, modelInstance);
+        return TwoDimensionalModel.getOptions(config.options, designerConfig, data, modelInstance);
     }
     else if (config.options.type === 'polar') {
-        return PolarModel.getOptions(config.options, data, designerConfig, modelInstance);
+        return PolarModel.getOptions(config.options, designerConfig, modelInstance);
     }
     else if (config.options.type === 'interval') {
-        return IntervalModel.getOptions(config, designerConfig, modelInstance.canvasModel.getMargin(), dataScope, data, modelInstance);
+        return IntervalModel.getOptions(config, designerConfig, modelInstance.canvasModel.getMargin(), modelInstance.dataModel.getScope(), data, modelInstance);
     }
 }
 function getDataSettings(dataScope, designerConfig) {
@@ -57,7 +57,7 @@ function getTransitions(designerConfig) {
     return designerConfig.transitions;
 }
 export function assembleModel(config, data, designerConfig) {
-    const modelInstance = ModelInstance.create(config);
+    const modelInstance = ModelInstance.create(config, data);
     if (!data || Object.keys(data).length === 0)
         return {
             blockCanvas: getBlockCanvas(config, modelInstance),
@@ -71,15 +71,14 @@ export function assembleModel(config, data, designerConfig) {
     MarginModel.initMargin(designerConfig, config, otherComponents, data, modelInstance);
     DataManagerModel.initDataScope(config, data, designerConfig, otherComponents.legendBlock, modelInstance);
     const preparedData = DataManagerModel.getPreparedData(data, modelInstance.dataModel.getAllowableKeys(), config);
+    modelInstance.dataModel.repository.initScopedFullSource(preparedData);
     if (config.options.type === '2d' && config.options.axis.key.visibility)
         MarginModel.recalcMarginByVerticalAxisLabel(modelInstance, config, designerConfig, modelInstance.dataModel.getScope());
     const blockCanvas = getBlockCanvas(config, modelInstance);
     const chartBlock = getChartBlockModel(modelInstance);
-    const options = getOptions(config, designerConfig, modelInstance, modelInstance.dataModel.getScope(), preparedData);
+    const options = getOptions(config, designerConfig, modelInstance, preparedData);
     const dataSettings = getDataSettings(modelInstance.dataModel.getScope(), designerConfig);
     const transitions = getTransitions(designerConfig);
-    // if (options.type === 'polar')
-    //     MarginModel.recalcPolarMarginWithScopedData(modelInstance, designerConfig, config, otherComponents.legendBlock, modelInstance.dataModel.getScope(), options);
     modelInstance.canvasModel.roundMargin();
     return {
         blockCanvas,

package/lib/model/modelInstance/dataModel/dataModel.d.ts

@@ -0,0 +1,14 @@
+import { DataScope } from "../../model";
+import { DataRepositoryModel } from "./dataRepository";
+export declare const DEFAULT_MAX_RECORDS_AMOUNT = 50;
+export declare class DataModelInstance {
+    repository: DataRepositoryModel;
+    constructor();
+    private maxRecordsAmount;
+    private scope;
+    initMaxRecordsAmount(amount: number): void;
+    getMaxRecordsAmount(): number;
+    initScope(scope: DataScope): void;
+    getScope(): DataScope;
+    getAllowableKeys(): string[];
+}

package/lib/model/modelInstance/dataModel/dataModel.js

@@ -0,0 +1,26 @@
+import { DataRepositoryModel } from "./dataRepository";
+export const DEFAULT_MAX_RECORDS_AMOUNT = 50;
+export class DataModelInstance {
+    constructor() {
+        //TODO: create dataScopeModel. 
+        this.maxRecordsAmount = DEFAULT_MAX_RECORDS_AMOUNT;
+        this.repository = new DataRepositoryModel();
+    }
+    initMaxRecordsAmount(amount) {
+        if (typeof amount === "number" && amount > 0) {
+            this.maxRecordsAmount = amount;
+        }
+    }
+    getMaxRecordsAmount() {
+        return this.maxRecordsAmount;
+    }
+    initScope(scope) {
+        this.scope = scope;
+    }
+    getScope() {
+        return this.scope;
+    }
+    getAllowableKeys() {
+        return this.getScope().allowableKeys;
+    }
+}

package/lib/model/modelInstance/dataModel/dataRepository.d.ts

@@ -0,0 +1,12 @@
+import { MdtChartsDataSource } from "../../../config/config";
+export declare class DataRepositoryModel {
+    private rawFullSource;
+    private scopedFullSource;
+    private sourceName;
+    initSourceName(sourceName: string): void;
+    initRawFullSource(rawSource: MdtChartsDataSource): void;
+    getRawRows(): import("../../../config/config").MdtChartsDataRow[];
+    initScopedFullSource(scopedSource: MdtChartsDataSource): void;
+    getScopedFullSource(): MdtChartsDataSource;
+    getScopedRows(): import("../../../config/config").MdtChartsDataRow[];
+}

package/lib/model/modelInstance/dataModel/dataRepository.js

@@ -0,0 +1,20 @@
+export class DataRepositoryModel {
+    initSourceName(sourceName) {
+        this.sourceName = sourceName;
+    }
+    initRawFullSource(rawSource) {
+        this.rawFullSource = rawSource;
+    }
+    getRawRows() {
+        return this.rawFullSource[this.sourceName];
+    }
+    initScopedFullSource(scopedSource) {
+        this.scopedFullSource = scopedSource;
+    }
+    getScopedFullSource() {
+        return this.scopedFullSource;
+    }
+    getScopedRows() {
+        return this.scopedFullSource[this.sourceName];
+    }
+}

package/lib/model/modelInstance/modelInstance.d.ts

@@ -1,8 +1,8 @@
-import { MdtChartsConfig } from "../../main";
+import { MdtChartsConfig, MdtChartsDataSource } from "../../config/config";
 import { CanvasModel } from "./canvasModel/canvasModel";
-import { DataModelInstance } from "./dataModel";
+import { DataModelInstance } from "./dataModel/dataModel";
 export declare class ModelInstance {
-    static create(config: MdtChartsConfig): ModelInstance;
+    static create(config: MdtChartsConfig, data: MdtChartsDataSource): ModelInstance;
     private static initInitialParams;
     canvasModel: CanvasModel;
     dataModel: DataModelInstance;

package/lib/model/modelInstance/modelInstance.js

@@ -1,17 +1,19 @@
 import { CanvasModel } from "./canvasModel/canvasModel";
-import { DataModelInstance } from "./dataModel";
+import { DataModelInstance } from "./dataModel/dataModel";
 export class ModelInstance {
     constructor() {
         this.canvasModel = new CanvasModel();
         this.dataModel = new DataModelInstance();
     }
-    static create(config) {
+    static create(config, data) {
         const modelInstance = new ModelInstance();
-        this.initInitialParams(modelInstance, config);
+        this.initInitialParams(modelInstance, config, data);
         return modelInstance;
     }
-    static initInitialParams(modelInstance, config) {
+    static initInitialParams(modelInstance, config, data) {
         modelInstance.canvasModel.initBlockSize(config.canvas.size);
         modelInstance.dataModel.initMaxRecordsAmount(config.options.data.maxRecordsAmount);
+        modelInstance.dataModel.repository.initSourceName(config.options.data.dataSource);
+        modelInstance.dataModel.repository.initRawFullSource(data);
     }
 }

package/lib/model/notations/polar/donut/donutAggregatorService.js

@@ -1,7 +1,7 @@
 export const AGGREGATOR_DEFAULT_TITLE = "Сумма";
 export class DonutAggregatorService {
     getContent(aggregatorOptions, dataOptions) {
-        if (!(aggregatorOptions === null || aggregatorOptions === void 0 ? void 0 : aggregatorOptions.content))
+        if (!(aggregatorOptions === null || aggregatorOptions === void 0 ? void 0 : aggregatorOptions.content) || !dataOptions.rows)
             return this.generateDefaultContent(dataOptions);
         const content = aggregatorOptions.content({ data: dataOptions.rows });
         if (this.doesValueExist(content.value) && content.title)
@@ -19,7 +19,7 @@ export class DonutAggregatorService {
     generateDefaultContent(dataOptions) {
         return {
             title: AGGREGATOR_DEFAULT_TITLE,
-            value: dataOptions.rows.reduce((acc, row) => acc + row[dataOptions.valueFieldName], 0)
+            value: dataOptions.rows ? dataOptions.rows.reduce((acc, row) => acc + row[dataOptions.valueFieldName], 0) : 0
         };
     }
 }

package/lib/model/notations/polar/donut/donutModel.d.ts

@@ -4,7 +4,7 @@ import { DonutChartSettings } from "../../../model";
 export declare class DonutModel {
     private thicknessService;
     private aggregatorService;
-    getSettings(settingsFromConfig: DonutOptionsCanvas, chartOptions: PolarChart, dataRows: MdtChartsDataRow[]): DonutChartSettings;
+    getSettings(settingsFromConfig: DonutOptionsCanvas, chartOptions: PolarChart, rawDataRows: MdtChartsDataRow[]): DonutChartSettings;
     private getThicknessOptions;
     private getAggregatorOptions;
 }

package/lib/model/notations/polar/donut/donutModel.js

@@ -5,11 +5,11 @@ export class DonutModel {
         this.thicknessService = new DonutThicknessService();
         this.aggregatorService = new DonutAggregatorService();
     }
-    getSettings(settingsFromConfig, chartOptions, dataRows) {
+    getSettings(settingsFromConfig, chartOptions, rawDataRows) {
         return {
             padAngle: settingsFromConfig.padAngle,
             thickness: this.getThicknessOptions(settingsFromConfig.thickness),
-            aggregator: this.getAggregatorOptions(settingsFromConfig, chartOptions, dataRows)
+            aggregator: this.getAggregatorOptions(settingsFromConfig, chartOptions, rawDataRows)
         };
     }
     getThicknessOptions(settingsFromConfig) {
@@ -20,11 +20,11 @@ export class DonutModel {
             value: this.thicknessService.valueToNumber(settingsFromConfig.value),
         };
     }
-    getAggregatorOptions(settingsFromConfig, chartOptions, dataRows) {
+    getAggregatorOptions(settingsFromConfig, chartOptions, rawDataRows) {
         return {
             margin: settingsFromConfig.aggregatorPad,
             content: this.aggregatorService.getContent(chartOptions.aggregator, {
-                rows: dataRows,
+                rows: rawDataRows,
                 valueFieldName: chartOptions.data.valueField.name
             })
         };

package/lib/model/notations/polar/polarModel.d.ts

@@ -1,13 +1,12 @@
-import { MdtChartsDataSource, MdtChartsPolarOptions } from "../../../config/config";
+import { MdtChartsPolarOptions } from "../../../config/config";
 import { DesignerConfig } from "../../../designer/designerConfig";
 import { PolarOptionsModel, LegendCoordinate } from "../../model";
 import { CanvasModel } from "../../modelInstance/canvasModel/canvasModel";
 import { ModelInstance } from "../../modelInstance/modelInstance";
-/** If donut block has width less than this const, legend change postion from "right" to "bottom" */
 export declare const MIN_DONUT_BLOCK_SIZE = 120;
 export declare class PolarModel {
     private static donutModel;
-    static getOptions(options: MdtChartsPolarOptions, data: MdtChartsDataSource, designerConfig: DesignerConfig, modelInstance: ModelInstance): PolarOptionsModel;
+    static getOptions(options: MdtChartsPolarOptions, designerConfig: DesignerConfig, modelInstance: ModelInstance): PolarOptionsModel;
     static getLegendPositionByBlockSize(canvasModel: CanvasModel): "bottom" | "right";
     static doesChartBlockHasEnoughWidthForContainsLegend(chartBlockWidth: number, legendWidth: number, legendCoordinate: LegendCoordinate): boolean;
     static doesChartBlockHasEnoughHeightForContainsLegend(chartBlockHeight: number, legendCoordinate: LegendCoordinate): boolean;

package/lib/model/notations/polar/polarModel.js

@@ -1,19 +1,17 @@
 import { ChartStyleModelService } from "../../chartStyleModel/chartStyleModel";
 import { DonutModel } from "./donut/donutModel";
-/** If donut block has width less than this const, legend change postion from "right" to "bottom" */
 export const MIN_DONUT_BLOCK_SIZE = 120;
 export class PolarModel {
-    static getOptions(options, data, designerConfig, modelInstance) {
-        const dataRows = data[options.data.dataSource];
+    static getOptions(options, designerConfig, modelInstance) {
         return {
             type: options.type,
             selectable: !!options.selectable,
             title: options.title,
             data: Object.assign({}, options.data),
-            charts: this.getChartsModel(options.chart, dataRows.length, designerConfig.chartStyle),
+            charts: this.getChartsModel(options.chart, modelInstance.dataModel.repository.getScopedRows().length, designerConfig.chartStyle),
             legend: modelInstance.canvasModel.legendCanvas.getModel(),
             tooltip: options.tooltip,
-            chartCanvas: this.getDonutSettings(designerConfig.canvas.chartOptions.donut, options.chart, dataRows)
+            chartCanvas: this.getDonutSettings(designerConfig.canvas.chartOptions.donut, options.chart, modelInstance.dataModel.repository.getRawRows())
         };
     }
     //TODO: type for returned value

package/lib/model/notations/twoDimensionalModel.d.ts

@@ -1,9 +1,9 @@
 import { ChartOrientation, MdtChartsDataSource, MdtChartsTwoDimensionalChart, MdtChartsTwoDimensionalOptions } from "../../config/config";
 import { BarOptionsCanvas, DesignerConfig } from "../../designer/designerConfig";
-import { DataScope, TwoDimensionalOptionsModel, TwoDimChartElementsSettings } from "../model";
+import { TwoDimensionalOptionsModel, TwoDimChartElementsSettings } from "../model";
 import { ModelInstance } from "../modelInstance/modelInstance";
 export declare class TwoDimensionalModel {
-    static getOptions(options: MdtChartsTwoDimensionalOptions, designerConfig: DesignerConfig, dataScope: DataScope, data: MdtChartsDataSource, modelInstance: ModelInstance): TwoDimensionalOptionsModel;
+    static getOptions(options: MdtChartsTwoDimensionalOptions, designerConfig: DesignerConfig, data: MdtChartsDataSource, modelInstance: ModelInstance): TwoDimensionalOptionsModel;
     static getChartsEmbeddedLabelsFlag(charts: MdtChartsTwoDimensionalChart[], chartOrientation: ChartOrientation): boolean;
     /**
      * Сортирует список чартов в порядке: area - bar - line.

package/lib/model/notations/twoDimensionalModel.js

@@ -3,7 +3,7 @@ import { TwoDimensionalChartStyleModel } from "../chartStyleModel/TwoDimensional
 import { AxisModel } from "../featuresModel/axisModel";
 import { ScaleModel } from "../featuresModel/scaleModel";
 export class TwoDimensionalModel {
-    static getOptions(options, designerConfig, dataScope, data, modelInstance) {
+    static getOptions(options, designerConfig, data, modelInstance) {
         const canvasModel = modelInstance.canvasModel;
         return {
             legend: canvasModel.legendCanvas.getModel(),
@@ -11,7 +11,7 @@ export class TwoDimensionalModel {
             selectable: !!options.selectable,
             orient: options.orientation,
             scale: {
-                key: ScaleModel.getScaleKey(dataScope.allowableKeys, options.orientation, canvasModel, options.charts, this.getChartsByType(options.charts, 'bar')),
+                key: ScaleModel.getScaleKey(modelInstance.dataModel.getAllowableKeys(), options.orientation, canvasModel, options.charts, this.getChartsByType(options.charts, 'bar')),
                 value: ScaleModel.getScaleLinear(options, data, canvasModel)
             },
             axis: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mdt-charts",
-  "version": "1.12.3",
+  "version": "1.12.4",
   "description": "",
   "main": "lib/main.js",
   "scripts": {