mdt-charts 1.17.2 → 1.18.0

package/lib/config/config.d.ts

@@ -130,6 +130,7 @@ export interface NumberDomain {
 }
 export interface NumberAxisLabel {
     format: (v: number) => string;
+    stepSize?: number;
 }
 export declare type AxisLabelFormatter = (v: number) => string;
 export interface DiscreteAxisOptions extends AxisOptions {

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

@@ -31,7 +31,7 @@ export class Axis {
     static renderAxis(block, scale, scaleOptions, axisOptions, blockSize) {
         const axisGenerator = AxisHelper.getBaseAxisGenerator(axisOptions, scale);
         if (axisOptions.type === 'value' && (scaleOptions.type === 'linear' || scaleOptions.type === 'datetime'))
-            AxisHelper.setValueAxisLabelsSettings(axisGenerator, scale.range(), scaleOptions);
+            AxisHelper.setValueAxisLabelsSettings(axisGenerator, scale.range(), scaleOptions, axisOptions.labels);
         else
             axisGenerator.tickFormat(axisOptions.labels.showTick);
         const axisElement = block.getSvg()
@@ -60,7 +60,7 @@ export class Axis {
     }
     static updateValueAxis(block, scaleValue, scaleOptions, axisOptions) {
         const axisGenerator = AxisHelper.getBaseAxisGenerator(axisOptions, scaleValue);
-        AxisHelper.setValueAxisLabelsSettings(axisGenerator, scaleValue.range(), scaleOptions);
+        AxisHelper.setValueAxisLabelsSettings(axisGenerator, scaleValue.range(), scaleOptions, axisOptions.labels);
         const axisElement = block.getSvg().select(`g.${axisOptions.cssClass}`);
         AxisDomHelper.updateAxisElement(axisGenerator, axisElement, axisOptions.translate, block.transitionManager.durations.chartUpdate)
             .then(() => {

package/lib/engine/features/axis/axisHelper.d.ts

@@ -1,8 +1,8 @@
 import { AxisScale, Axis as IAxis } from 'd3-axis';
-import { AxisModelOptions, Orient, ScaleValueModel } from "../../../model/model";
+import { AxisLabelModel, AxisModelOptions, Orient, ScaleValueModel } from "../../../model/model";
 export declare class AxisHelper {
     static getAxisByOrient(orient: Orient, scale: AxisScale<any>): IAxis<any>;
-    static setValueAxisLabelsSettings(axisGenerator: IAxis<any>, range: number[], scaleOptions: ScaleValueModel): void;
+    static setValueAxisLabelsSettings(axisGenerator: IAxis<any>, range: number[], scaleOptions: ScaleValueModel, labelsOptions: AxisLabelModel): void;
     static getBaseAxisGenerator(axisOptions: AxisModelOptions, scale: AxisScale<any>): IAxis<any>;
     private static removeTicks;
     private static setNumTickFormat;

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

@@ -1,8 +1,6 @@
 import { axisTop, axisBottom, axisLeft, axisRight } from 'd3-axis';
-import { max, min } from 'd3-array';
 import { format } from 'd3-format';
 import { AxisLabelHelper } from './axisLabelDomHelper';
-const MINIMAL_STEP_SIZE = 60;
 export class AxisHelper {
     static getAxisByOrient(orient, scale) {
         if (orient === 'top')
@@ -14,18 +12,14 @@ export class AxisHelper {
         if (orient === 'right')
             return axisRight(scale);
     }
-    static setValueAxisLabelsSettings(axisGenerator, range, scaleOptions) {
+    static setValueAxisLabelsSettings(axisGenerator, range, scaleOptions, labelsOptions) {
         const axisLength = range[1] - range[0];
-        let ticksAmount;
-        if (axisLength / 10 < MINIMAL_STEP_SIZE) {
-            if (Math.floor(axisLength / MINIMAL_STEP_SIZE) > 2) {
-                ticksAmount = Math.floor(axisLength / MINIMAL_STEP_SIZE);
-                axisGenerator.ticks(Math.floor(axisLength / MINIMAL_STEP_SIZE));
-            }
-            else {
-                ticksAmount = 2;
-                axisGenerator.tickValues([min(scaleOptions.domain), max(scaleOptions.domain)]);
-            }
+        const minimalStepSize = labelsOptions.linearTickStep;
+        if (Math.floor(axisLength / minimalStepSize) > 2) {
+            axisGenerator.ticks(Math.floor(axisLength / minimalStepSize));
+        }
+        else {
+            axisGenerator.ticks(1);
         }
         if (scaleOptions.type === 'linear') {
             this.setNumTickFormat(axisGenerator, scaleOptions.formatter);

package/lib/engine/features/axis/axisLabelDomHelper.d.ts

@@ -11,6 +11,7 @@ export declare class AxisLabelHelper {
     static hideLabels(axisElement: Selection<SVGGElement, unknown, BaseType, unknown>): void;
     static alignLabelsInKeyAxis(axisOptions: AxisModelOptions, axisElement: Selection<SVGGElement, unknown, HTMLElement, any>): void;
     private static alignLabelsInVerticalAxis;
+    static alignHorizontalAxisLastLabel(block: Block, maxLabelSize: number, axisOptions: AxisModelOptions, blockSize: Size, crop: boolean): void;
     private static cropAndAlignExtremeLabels;
     private static getTranslateNumber;
     static wrapHandler(textBlocks: Selection<SVGGElement, unknown, BaseType, any>, maxWidth: number): void;

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

@@ -46,7 +46,7 @@ export class AxisLabelHelper {
         else
             maxLabelSize = ((_c = (_b = (_a = scale).step) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : Infinity) - 4;
         DomHelper.cropSvgLabels(axisTextBlocks, maxLabelSize);
-        if (scaleOptions.type === 'point' && axisOptions.labels.position === 'straight' && (axisOptions.orient === 'top' || axisOptions.orient === 'bottom')) {
+        if (axisOptions.labels.position === 'straight' && (axisOptions.orient === 'top' || axisOptions.orient === 'bottom')) {
             this.cropAndAlignExtremeLabels(block, maxLabelSize, axisOptions, blockSize);
         }
     }
@@ -72,7 +72,7 @@ export class AxisLabelHelper {
             spans.attr('x', AXIS_VERTICAL_LABEL_PADDING);
         }
     }
-    static cropAndAlignExtremeLabels(block, maxLabelSize, axisOptions, blockSize) {
+    static alignHorizontalAxisLastLabel(block, maxLabelSize, axisOptions, blockSize, crop) {
         const lastTick = block.getSvg().select(`.${axisOptions.cssClass}`).select('.tick:last-of-type');
         const lastLabel = lastTick.select('text');
         if (lastTick.size() === 0 || lastLabel.size() === 0)
@@ -82,8 +82,12 @@ export class AxisLabelHelper {
         if (tickTranslateX + lastLabel.node().getBBox().width + axisOptions.translate.translateX > blockSize.width) {
             lastLabel.attr('text-anchor', 'start');
             lastLabel.attr('transform', `translate(${this.getTranslateNumber(maxLabelSize, lastLabel, marginRight)}, 0)`);
-            DomHelper.cropSvgLabels(lastLabel, maxLabelSize / 2 + marginRight);
+            if (crop)
+                DomHelper.cropSvgLabels(lastLabel, maxLabelSize / 2 + marginRight);
         }
+    }
+    static cropAndAlignExtremeLabels(block, maxLabelSize, axisOptions, blockSize) {
+        this.alignHorizontalAxisLastLabel(block, maxLabelSize, axisOptions, blockSize, true);
         const firstLabel = block.getSvg()
             .select(`.${axisOptions.cssClass}`)
             .select('.tick:first-of-type')

package/lib/engine/features/markDots/markDot.js

@@ -23,6 +23,8 @@ export class MarkDot {
             .selectAll(`.${this.markerDotClass}${Helper.getCssClassesLine(chart.cssClasses)}.chart-element-${vfIndex}`)
             .data(newData);
         dots.exit().remove();
+        if (chart.markersOptions.show)
+            dots.classed(this.hiddenDotClass, false);
         const attrs = MarkDotHelper.getDotAttrs(keyAxisOrient, scales, margin, keyField, valueFieldName, chart.isSegmented);
         const newDots = dots
             .enter()

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

@@ -7,6 +7,8 @@ export interface LabelSize {
     width: number;
     height: number;
 }
+export declare const MINIMAL_VERTICAL_STEP_SIZE = 60;
+export declare const MINIMAL_HORIZONTAL_STEP_SIZE = 100;
 export declare class AxisModel {
     private static service;
     static getKeyAxis(options: MdtChartsTwoDimensionalOptions, data: MdtChartsDataSource, labelConfig: AxisLabelCanvas, canvasModel: CanvasModel, tooltipSettings: TooltipSettings, getZeroCoordinate?: () => number): AxisModelOptions;

package/lib/model/featuresModel/axisModel.js

@@ -3,6 +3,8 @@ import { AxisType, CLASSES } from "../modelBuilder";
 import { DataManagerModel } from "../dataManagerModel/dataManagerModel";
 import { TwoDimensionalModel } from "../notations/twoDimensionalModel";
 import { AxisModelService, AxisModelTickCalculator, showAllTicks } from "./axisModelService";
+export const MINIMAL_VERTICAL_STEP_SIZE = 60;
+export const MINIMAL_HORIZONTAL_STEP_SIZE = 100;
 export class AxisModel {
     static getKeyAxis(options, data, labelConfig, canvasModel, tooltipSettings, getZeroCoordinate) {
         var _a;
@@ -21,12 +23,14 @@ export class AxisModel {
                 position: AxisModel.getKeyAxisLabelPosition(canvasModel, DataManagerModel.getDataValuesByKeyField(data, dataOptions.dataSource, dataOptions.keyField.name).length, axisConfig),
                 visible: !TwoDimensionalModel.getChartsEmbeddedLabelsFlag(charts, orientation),
                 defaultTooltip: tooltipSettings.position === 'fixed',
-                showTick: tickCalculator.createFunctionCalculator(this.getAxisLength(orientation, canvasModel))
+                showTick: tickCalculator.createFunctionCalculator(this.getAxisLength(orientation, canvasModel)),
+                linearTickStep: MINIMAL_HORIZONTAL_STEP_SIZE
             },
             visibility: axisConfig.visibility
         };
     }
     static getValueAxis(orient, axisConfig, labelConfig, canvasModel) {
+        var _a, _b;
         return {
             type: 'value',
             orient: AxisModel.getAxisOrient(AxisType.Value, orient, axisConfig.position),
@@ -41,7 +45,8 @@ export class AxisModel {
                 position: 'straight',
                 visible: true,
                 defaultTooltip: true,
-                showTick: showAllTicks
+                showTick: showAllTicks,
+                linearTickStep: (_b = (_a = axisConfig.labels) === null || _a === void 0 ? void 0 : _a.stepSize) !== null && _b !== void 0 ? _b : (orient === "horizontal" ? MINIMAL_HORIZONTAL_STEP_SIZE : MINIMAL_VERTICAL_STEP_SIZE)
             },
             visibility: axisConfig.visibility
         };

package/lib/model/model.d.ts

@@ -123,6 +123,7 @@ export interface AxisLabelModel {
     visible: boolean;
     defaultTooltip: boolean;
     showTick: ShowTickFn;
+    linearTickStep: number;
 }
 export interface AdditionalElementsOptions {
     gridLine: GridLineOptions;

package/lib/model/notations/twoDimensionalModel.js

@@ -9,11 +9,9 @@ export class TwoDimensionalModel {
     static getOptions(configReader, designerConfig, modelInstance) {
         const options = configReader.options;
         const canvasModel = modelInstance.canvasModel;
-        const dataModelRep = modelInstance.dataModel.repository;
-        const dataRows = dataModelRep.getRawRows();
-        const resolvedTitle = getResolvedTitle(options.title, dataRows);
+        const resolvedTitle = getResolvedTitle(options.title, modelInstance.dataModel.repository.getRawRows());
         const scaleModel = new ScaleModel();
-        const scaleMarginRecalcer = new ScaleAxisRecalcer(() => scaleModel.getScaleLinear(options, dataModelRep.getScopedRows(), canvasModel, configReader));
+        const scaleMarginRecalcer = new ScaleAxisRecalcer(() => scaleModel.getScaleLinear(options, modelInstance.dataModel.repository.getScopedRows(), canvasModel, configReader));
         scaleMarginRecalcer.recalculateMargin(canvasModel, options.orientation, options.axis.key);
         const scaleValueInfo = scaleMarginRecalcer.getScaleValue();
         return {
@@ -26,12 +24,12 @@ export class TwoDimensionalModel {
                 value: scaleValueInfo.scale
             },
             axis: {
-                key: AxisModel.getKeyAxis(options, dataModelRep.getScopedFullSource(), designerConfig.canvas.axisLabel, canvasModel, designerConfig.elementsOptions.tooltip, () => scaleValueInfo.scaleFn(0)),
+                key: AxisModel.getKeyAxis(options, modelInstance.dataModel.repository.getScopedFullSource(), designerConfig.canvas.axisLabel, canvasModel, designerConfig.elementsOptions.tooltip, () => scaleValueInfo.scaleFn(0)),
                 value: AxisModel.getValueAxis(options.orientation, options.axis.value, designerConfig.canvas.axisLabel, canvasModel)
             },
             type: options.type,
             data: Object.assign({}, options.data),
-            charts: this.getChartsModel(options.charts, options.orientation, designerConfig),
+            charts: this.getChartsModel(options.charts, options.orientation, designerConfig, modelInstance.dataModel.repository),
             additionalElements: this.getAdditionalElements(options),
             tooltip: options.tooltip,
             chartSettings: this.getChartsSettings(designerConfig.canvas.chartOptions, options.orientation)
@@ -59,7 +57,7 @@ export class TwoDimensionalModel {
             lineLike: { shape: parseShape(chartOrientation, (_a = chartOptions.line) === null || _a === void 0 ? void 0 : _a.shape) }
         };
     }
-    static getChartsModel(charts, chartOrientation, designerConfig) {
+    static getChartsModel(charts, chartOrientation, designerConfig, dataModelRep) {
         const styleModel = new TwoDimensionalChartStyleModel(charts, designerConfig.chartStyle);
         this.sortCharts(charts);
         const chartsModel = [];
@@ -74,7 +72,7 @@ export class TwoDimensionalModel {
                 style: styleModel.getChartStyle(chart, index),
                 embeddedLabels: this.getEmbeddedLabelType(chart, chartOrientation),
                 markersOptions: {
-                    show: chart.markers.show,
+                    show: dataModelRep.getScopedRows().length === 1 ? true : chart.markers.show,
                     styles: {
                         highlighted: {
                             size: { radius: (_c = (_b = (_a = designerConfig.canvas.markers) === null || _a === void 0 ? void 0 : _a.highlighted) === null || _b === void 0 ? void 0 : _b.radius) !== null && _c !== void 0 ? _c : 4, borderSize: '3.5px' }

package/package.json

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