mdt-charts 1.29.0 → 1.30.0

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

@@ -1,21 +1,22 @@
 export class AxisDomHelper {
-	static updateAxisElement(axisGenerator, axisElement, translate, transitionDuration = 0) {
-		return new Promise((resolve) => {
-			let axisHandler = axisElement;
-			if (transitionDuration > 0) {
-				axisHandler = axisHandler
-					.interrupt()
-					.transition()
-					.duration(transitionDuration)
-					.on("end", () => resolve("updated"));
-			}
-			axisHandler
-				.attr("transform", `translate(${translate.translateX}, ${translate.translateY})`)
-				.call(axisGenerator.bind(this));
-			if (transitionDuration <= 0) resolve("updated");
-		});
-	}
-	static rotateElementsBack(axisElement) {
-		axisElement.selectAll(".tick text").attr("transform", null).attr("text-anchor", "middle").attr("x", null);
-	}
+    static updateAxisElement(axisGenerator, axisElement, translate, transitionDuration = 0) {
+        return new Promise((resolve) => {
+            let axisHandler = axisElement;
+            if (transitionDuration > 0) {
+                axisHandler = axisHandler
+                    .interrupt()
+                    .transition()
+                    .duration(transitionDuration)
+                    .on("end", () => resolve("updated"));
+            }
+            axisHandler
+                .attr("transform", `translate(${translate.translateX}, ${translate.translateY})`)
+                .call(axisGenerator.bind(this));
+            if (transitionDuration <= 0)
+                resolve("updated");
+        });
+    }
+    static rotateElementsBack(axisElement) {
+        axisElement.selectAll(".tick text").attr("transform", null).attr("text-anchor", "middle").attr("x", null);
+    }
 }

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

@@ -1,13 +1,9 @@
 import { AxisScale, Axis as IAxis } from "d3-axis";
 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>,
-		scaleOptions: ScaleValueModel,
-		labelsOptions: AxisLabelModel
-	): void;
-	static getBaseAxisGenerator(axisOptions: AxisModelOptions, scale: AxisScale<any>): IAxis<any>;
-	private static removeTicks;
-	private static setNumTickFormat;
+    static getAxisByOrient(orient: Orient, scale: AxisScale<any>): IAxis<any>;
+    static setValueAxisLabelsSettings(axisGenerator: IAxis<any>, 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

@@ -2,32 +2,37 @@ import { axisTop, axisBottom, axisLeft, axisRight } from "d3-axis";
 import { format } from "d3-format";
 import { AxisLabelHelper } from "./axisLabelDomHelper";
 export class AxisHelper {
-	static getAxisByOrient(orient, scale) {
-		if (orient === "top") return axisTop(scale);
-		if (orient === "bottom") return axisBottom(scale);
-		if (orient === "left") return axisLeft(scale);
-		if (orient === "right") return axisRight(scale);
-	}
-	static setValueAxisLabelsSettings(axisGenerator, scaleOptions, labelsOptions) {
-		if (labelsOptions.tickAmountSettings.policy.type === "amount")
-			axisGenerator.ticks(labelsOptions.tickAmountSettings.policy.amount);
-		if (labelsOptions.tickAmountSettings.policy.type === "constant")
-			axisGenerator.tickValues(labelsOptions.tickAmountSettings.policy.values);
-		if (scaleOptions.type === "linear") {
-			this.setNumTickFormat(axisGenerator, scaleOptions.formatter);
-		}
-	}
-	static getBaseAxisGenerator(axisOptions, scale) {
-		const axisGenerator = AxisHelper.getAxisByOrient(axisOptions.orient, scale);
-		if (!axisOptions.ticks.flag) this.removeTicks(axisGenerator);
-		AxisLabelHelper.setAxisLabelPaddingByOrient(axisGenerator, axisOptions);
-		return axisGenerator;
-	}
-	static removeTicks(axis) {
-		axis.tickSize(0);
-	}
-	static setNumTickFormat(axis, formatter) {
-		const defaultFormatter = format("~s");
-		axis.tickFormat(formatter !== null && formatter !== void 0 ? formatter : defaultFormatter);
-	}
+    static getAxisByOrient(orient, scale) {
+        if (orient === "top")
+            return axisTop(scale);
+        if (orient === "bottom")
+            return axisBottom(scale);
+        if (orient === "left")
+            return axisLeft(scale);
+        if (orient === "right")
+            return axisRight(scale);
+    }
+    static setValueAxisLabelsSettings(axisGenerator, scaleOptions, labelsOptions) {
+        if (labelsOptions.tickAmountSettings.policy.type === "amount")
+            axisGenerator.ticks(labelsOptions.tickAmountSettings.policy.amount);
+        if (labelsOptions.tickAmountSettings.policy.type === "constant")
+            axisGenerator.tickValues(labelsOptions.tickAmountSettings.policy.values);
+        if (scaleOptions.type === "linear") {
+            this.setNumTickFormat(axisGenerator, scaleOptions.formatter);
+        }
+    }
+    static getBaseAxisGenerator(axisOptions, scale) {
+        const axisGenerator = AxisHelper.getAxisByOrient(axisOptions.orient, scale);
+        if (!axisOptions.ticks.flag)
+            this.removeTicks(axisGenerator);
+        AxisLabelHelper.setAxisLabelPaddingByOrient(axisGenerator, axisOptions);
+        return axisGenerator;
+    }
+    static removeTicks(axis) {
+        axis.tickSize(0);
+    }
+    static setNumTickFormat(axis, formatter) {
+        const defaultFormatter = format("~s");
+        axis.tickFormat(formatter !== null && formatter !== void 0 ? formatter : defaultFormatter);
+    }
 }

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

@@ -4,30 +4,15 @@ import { AxisModelOptions, Orient, ScaleKeyModel, ScaleValueModel } from "../../
 import { Block } from "../../block/block";
 import { Size } from "../../../config/config";
 export declare class AxisLabelHelper {
-	static setTitles(axisElement: Selection<SVGGElement, unknown, BaseType, any>, axisOptions: AxisModelOptions): void;
-	static setAxisLabelPaddingByOrient(axis: IAxis<any>, axisOptions: AxisModelOptions): void;
-	static rotateLabels(axisElement: Selection<SVGGElement, unknown, HTMLElement, any>, keyAxisOrient: Orient): void;
-	static cropLabels(
-		block: Block,
-		scale: AxisScale<any>,
-		scaleOptions: ScaleKeyModel | ScaleValueModel,
-		axisOptions: AxisModelOptions,
-		blockSize: Size
-	): void;
-	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;
+    static setTitles(axisElement: Selection<SVGGElement, unknown, BaseType, any>, axisOptions: AxisModelOptions): void;
+    static setAxisLabelPaddingByOrient(axis: IAxis<any>, axisOptions: AxisModelOptions): void;
+    static rotateLabels(axisElement: Selection<SVGGElement, unknown, HTMLElement, any>, keyAxisOrient: Orient): void;
+    static cropLabels(block: Block, scale: AxisScale<any>, scaleOptions: ScaleKeyModel | ScaleValueModel, axisOptions: AxisModelOptions, blockSize: Size): void;
+    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

@@ -1,161 +1,157 @@
 import { select } from "d3-selection";
 import { DomHelper } from "../../helpers/domHelper";
 import { Helper } from "../../helpers/helper";
-import {
-	AXIS_HORIZONTAL_LABEL_PADDING,
-	AXIS_VERTICAL_LABEL_PADDING
-} from "../../../model/margin/twoDim/twoDimMarginModel";
+import { AXIS_HORIZONTAL_LABEL_PADDING, AXIS_VERTICAL_LABEL_PADDING } from "../../../model/margin/twoDim/twoDimMarginModel";
 export class AxisLabelHelper {
-	static setTitles(axisElement, axisOptions) {
-		axisElement.selectAll(".tick text").each(function (d, i) {
-			const tickTitle = select(this).select("title");
-			if (tickTitle.empty()) select(this).append("title").text(axisOptions.browserTooltip.format(d));
-			else {
-				tickTitle.text(axisOptions.browserTooltip.format(d));
-			}
-		});
-	}
-	static setAxisLabelPaddingByOrient(axis, axisOptions) {
-		let axisLabelPadding = AXIS_HORIZONTAL_LABEL_PADDING;
-		if (axisOptions.orient === "left" || axisOptions.orient === "right")
-			axisLabelPadding = AXIS_VERTICAL_LABEL_PADDING;
-		axis.tickPadding(axisLabelPadding);
-	}
-	static rotateLabels(axisElement, keyAxisOrient) {
-		const labelBlocks = axisElement.selectAll("text");
-		labelBlocks.attr("transform", "rotate(-90)");
-		if (keyAxisOrient === "bottom") {
-			labelBlocks.attr("text-anchor", "end").attr("x", -AXIS_HORIZONTAL_LABEL_PADDING).attr("y", -4);
-		} else if (keyAxisOrient === "top") {
-			labelBlocks.attr("text-anchor", "start").attr("x", AXIS_HORIZONTAL_LABEL_PADDING).attr("y", 6);
-		}
-	}
-	static cropLabels(block, scale, scaleOptions, axisOptions, blockSize) {
-		var _a, _b, _c;
-		const axisTextBlocks = block.getSvg().select(`.${axisOptions.cssClass}`).selectAll("text");
-		let maxLabelSize;
-		if (
-			axisOptions.orient === "left" ||
-			axisOptions.orient === "right" ||
-			(axisOptions.type === "key" && axisOptions.labels.position === "rotated")
-		)
-			maxLabelSize = axisOptions.labels.maxSize;
-		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 (
-			axisOptions.labels.position === "straight" &&
-			(axisOptions.orient === "top" || axisOptions.orient === "bottom")
-		) {
-			this.cropAndAlignExtremeLabels(block, maxLabelSize, axisOptions, blockSize);
-		}
-	}
-	static hideLabels(axisElement) {
-		axisElement.selectAll(".tick text").style("display", "none");
-	}
-	static alignLabelsInKeyAxis(axisOptions, axisElement) {
-		if (axisOptions.orient === "left")
-			this.alignLabelsInVerticalAxis(axisElement, "start", axisOptions.labels.maxSize, true);
-		else if (axisOptions.orient === "right")
-			this.alignLabelsInVerticalAxis(axisElement, "start", axisOptions.labels.maxSize, false);
-	}
-	static alignLabelsInVerticalAxis(axisElement, anchor, maxLabelSize, changeCoordinate) {
-		const axisTextBlocks = axisElement.selectAll("text");
-		const spans = axisElement.selectAll("tspan");
-		axisTextBlocks.attr("text-anchor", anchor);
-		spans.attr("text-anchor", anchor);
-		if (changeCoordinate) {
-			axisTextBlocks.attr("x", -(maxLabelSize + AXIS_VERTICAL_LABEL_PADDING));
-			spans.attr("x", -(maxLabelSize + AXIS_VERTICAL_LABEL_PADDING));
-		} else {
-			spans.attr("x", AXIS_VERTICAL_LABEL_PADDING);
-		}
-	}
-	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.empty() || lastTick.size() === 0 || lastLabel.size() === 0) return;
-		const tickTranslateX = Helper.getTranslateNumbers(lastTick.attr("transform"))[0];
-		const marginRight = blockSize.width - axisOptions.translate.translateX - tickTranslateX;
-		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)`
-			);
-			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")
-			.select("text");
-		if (firstLabel.empty()) return;
-		const axisElementTranslate = Helper.getTranslateNumbers(
-			block.getSvg().select(`.${axisOptions.cssClass}`).attr("transform")
-		)[0];
-		if (axisOptions.translate.translateX - firstLabel.node().getBBox().width / 2 < 0) {
-			firstLabel.attr("text-anchor", "start");
-			firstLabel.attr("transform", `translate(${-axisOptions.translate.translateX}, 0)`);
-			DomHelper.cropSvgLabels(firstLabel, maxLabelSize / 2 + axisElementTranslate);
-		}
-	}
-	static getTranslateNumber(maxLabelSize, lastLabel, marginRight) {
-		if (maxLabelSize / 2 > lastLabel.node().getBBox().width)
-			return -(lastLabel.node().getBBox().width - marginRight);
-		return -maxLabelSize / 2;
-		// return -Math.min(maxLabelSize / 2, lastLabel.node().getBBox().width - marginRight)
-	}
-	static wrapHandler(textBlocks, maxWidth) {
-		textBlocks.each(function () {
-			let textBlock = select(this);
-			if (!textBlock.selectAll("tspan").empty()) return;
-			textBlock.select("title").remove();
-			let textContent = textBlock.text();
-			if (textBlock.node().getBBox().width > maxWidth) {
-				let letters = textBlock.text().split("").reverse(), // split text to letters.
-					letter,
-					line = [], // one line. letters from this var into tpsans.
-					lineNumber = 0,
-					dy = 1.4,
-					tspan = textBlock
-						.text(null)
-						.append("tspan")
-						.attr("dy", dy + "em");
-				while ((letter = letters.pop())) {
-					line.push(letter);
-					tspan.text(line.join(""));
-					if (tspan.node().getComputedTextLength() > maxWidth && line.length > 1 && letters.length > 0) {
-						line.pop();
-						tspan.text(line.join(""));
-						if (lineNumber === 0 && line[line.length - 1] !== " ") tspan.text(tspan.text() + "-");
-						line = [letter];
-						if (lineNumber >= 1) {
-							// If text block has 2 lines, text cropped.
-							if (letters.length > 0) tspan.text(tspan.text().substr(0, tspan.text().length - 1) + "...");
-							break;
-						}
-						tspan = textBlock
-							.append("tspan")
-							.attr("dy", dy * lineNumber + 1 + "em")
-							.text(letter);
-						lineNumber++;
-					}
-				}
-				if (textBlock.selectAll("tspan").size() === 1) {
-					textBlock.text(textContent).attr("y", null);
-				}
-				if (!textBlock.selectAll("tspan").empty()) {
-					textBlock.attr("y", -(textBlock.node().getBBox().height / 2 + 4.8));
-				}
-			}
-		});
-	}
+    static setTitles(axisElement, axisOptions) {
+        axisElement.selectAll(".tick text").each(function (d, i) {
+            const tickTitle = select(this).select("title");
+            if (tickTitle.empty())
+                select(this).append("title").text(axisOptions.browserTooltip.format(d));
+            else {
+                tickTitle.text(axisOptions.browserTooltip.format(d));
+            }
+        });
+    }
+    static setAxisLabelPaddingByOrient(axis, axisOptions) {
+        let axisLabelPadding = AXIS_HORIZONTAL_LABEL_PADDING;
+        if (axisOptions.orient === "left" || axisOptions.orient === "right")
+            axisLabelPadding = AXIS_VERTICAL_LABEL_PADDING;
+        axis.tickPadding(axisLabelPadding);
+    }
+    static rotateLabels(axisElement, keyAxisOrient) {
+        const labelBlocks = axisElement.selectAll("text");
+        labelBlocks.attr("transform", "rotate(-90)");
+        if (keyAxisOrient === "bottom") {
+            labelBlocks.attr("text-anchor", "end").attr("x", -AXIS_HORIZONTAL_LABEL_PADDING).attr("y", -4);
+        }
+        else if (keyAxisOrient === "top") {
+            labelBlocks.attr("text-anchor", "start").attr("x", AXIS_HORIZONTAL_LABEL_PADDING).attr("y", 6);
+        }
+    }
+    static cropLabels(block, scale, scaleOptions, axisOptions, blockSize) {
+        var _a, _b, _c;
+        const axisTextBlocks = block
+            .getSvg()
+            .select(`.${axisOptions.cssClass}`)
+            .selectAll("text");
+        let maxLabelSize;
+        if (axisOptions.orient === "left" ||
+            axisOptions.orient === "right" ||
+            (axisOptions.type === "key" && axisOptions.labels.position === "rotated"))
+            maxLabelSize = axisOptions.labels.maxSize;
+        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 (axisOptions.labels.position === "straight" &&
+            (axisOptions.orient === "top" || axisOptions.orient === "bottom")) {
+            this.cropAndAlignExtremeLabels(block, maxLabelSize, axisOptions, blockSize);
+        }
+    }
+    static hideLabels(axisElement) {
+        axisElement.selectAll(".tick text").style("display", "none");
+    }
+    static alignLabelsInKeyAxis(axisOptions, axisElement) {
+        if (axisOptions.orient === "left")
+            this.alignLabelsInVerticalAxis(axisElement, "start", axisOptions.labels.maxSize, true);
+        else if (axisOptions.orient === "right")
+            this.alignLabelsInVerticalAxis(axisElement, "start", axisOptions.labels.maxSize, false);
+    }
+    static alignLabelsInVerticalAxis(axisElement, anchor, maxLabelSize, changeCoordinate) {
+        const axisTextBlocks = axisElement.selectAll("text");
+        const spans = axisElement.selectAll("tspan");
+        axisTextBlocks.attr("text-anchor", anchor);
+        spans.attr("text-anchor", anchor);
+        if (changeCoordinate) {
+            axisTextBlocks.attr("x", -(maxLabelSize + AXIS_VERTICAL_LABEL_PADDING));
+            spans.attr("x", -(maxLabelSize + AXIS_VERTICAL_LABEL_PADDING));
+        }
+        else {
+            spans.attr("x", AXIS_VERTICAL_LABEL_PADDING);
+        }
+    }
+    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.empty() || lastTick.size() === 0 || lastLabel.size() === 0)
+            return;
+        const tickTranslateX = Helper.getTranslateNumbers(lastTick.attr("transform"))[0];
+        const marginRight = blockSize.width - axisOptions.translate.translateX - tickTranslateX;
+        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)`);
+            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")
+            .select("text");
+        if (firstLabel.empty())
+            return;
+        const axisElementTranslate = Helper.getTranslateNumbers(block.getSvg().select(`.${axisOptions.cssClass}`).attr("transform"))[0];
+        if (axisOptions.translate.translateX - firstLabel.node().getBBox().width / 2 < 0) {
+            firstLabel.attr("text-anchor", "start");
+            firstLabel.attr("transform", `translate(${-axisOptions.translate.translateX}, 0)`);
+            DomHelper.cropSvgLabels(firstLabel, maxLabelSize / 2 + axisElementTranslate);
+        }
+    }
+    static getTranslateNumber(maxLabelSize, lastLabel, marginRight) {
+        if (maxLabelSize / 2 > lastLabel.node().getBBox().width)
+            return -(lastLabel.node().getBBox().width - marginRight);
+        return -maxLabelSize / 2;
+        // return -Math.min(maxLabelSize / 2, lastLabel.node().getBBox().width - marginRight)
+    }
+    static wrapHandler(textBlocks, maxWidth) {
+        textBlocks.each(function () {
+            let textBlock = select(this);
+            if (!textBlock.selectAll("tspan").empty())
+                return;
+            textBlock.select("title").remove();
+            let textContent = textBlock.text();
+            if (textBlock.node().getBBox().width > maxWidth) {
+                let letters = textBlock.text().split("").reverse(), // split text to letters.
+                letter, line = [], // one line. letters from this var into tpsans.
+                lineNumber = 0, dy = 1.4, tspan = textBlock
+                    .text(null)
+                    .append("tspan")
+                    .attr("dy", dy + "em");
+                while ((letter = letters.pop())) {
+                    line.push(letter);
+                    tspan.text(line.join(""));
+                    if (tspan.node().getComputedTextLength() > maxWidth && line.length > 1 && letters.length > 0) {
+                        line.pop();
+                        tspan.text(line.join(""));
+                        if (lineNumber === 0 && line[line.length - 1] !== " ")
+                            tspan.text(tspan.text() + "-");
+                        line = [letter];
+                        if (lineNumber >= 1) {
+                            // If text block has 2 lines, text cropped.
+                            if (letters.length > 0)
+                                tspan.text(tspan.text().substr(0, tspan.text().length - 1) + "...");
+                            break;
+                        }
+                        tspan = textBlock
+                            .append("tspan")
+                            .attr("dy", dy * lineNumber + 1 + "em")
+                            .text(letter);
+                        lineNumber++;
+                    }
+                }
+                if (textBlock.selectAll("tspan").size() === 1) {
+                    textBlock.text(textContent).attr("y", null);
+                }
+                if (!textBlock.selectAll("tspan").empty()) {
+                    textBlock.attr("y", -(textBlock.node().getBBox().height / 2 + 4.8));
+                }
+            }
+        });
+    }
 }

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

@@ -1,6 +1,6 @@
 import { Selection } from "d3-selection";
 import { Block } from "../../block/block";
 export declare class AxisLabelsEventManager {
-	static setHoverEvents(block: Block, axisElement: Selection<SVGGElement, unknown, HTMLElement, any>): void;
-	static removeEvents(axisElement: Selection<SVGGElement, unknown, HTMLElement, any>): void;
+    static setHoverEvents(block: Block, axisElement: Selection<SVGGElement, unknown, HTMLElement, any>): void;
+    static removeEvents(axisElement: Selection<SVGGElement, unknown, HTMLElement, any>): void;
 }

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

@@ -1,36 +1,36 @@
 import { pointer } from "d3-selection";
 import { TipBox } from "../tipBox/tipBox";
 export class AxisLabelsEventManager {
-	static setHoverEvents(block, axisElement) {
-		const labels = axisElement.selectAll(".tick text");
-		labels.on("mousemove", function (e, d) {
-			TipBox.get(block).dispatch("mousemove", {
-				bubbles: false,
-				cancelable: true,
-				detail: {
-					keyValue: d,
-					pointer: pointer(e, block.getWrapper().node())
-				}
-			});
-		});
-		labels.on("mouseleave", function (e, d) {
-			TipBox.get(block).dispatch("mouseleave");
-		});
-		labels.on("click", function (e, d) {
-			TipBox.get(block).dispatch("click", {
-				bubbles: false,
-				cancelable: true,
-				detail: {
-					multySelect: e.ctrlKey || e.metaKey,
-					keyValue: d
-				}
-			});
-		});
-	}
-	static removeEvents(axisElement) {
-		const labels = axisElement.selectAll(".tick text");
-		labels.on("mousemove", null);
-		labels.on("mouseleave", null);
-		labels.on("click", null);
-	}
+    static setHoverEvents(block, axisElement) {
+        const labels = axisElement.selectAll(".tick text");
+        labels.on("mousemove", function (e, d) {
+            TipBox.get(block).dispatch("mousemove", {
+                bubbles: false,
+                cancelable: true,
+                detail: {
+                    keyValue: d,
+                    pointer: pointer(e, block.getWrapper().node())
+                }
+            });
+        });
+        labels.on("mouseleave", function (e, d) {
+            TipBox.get(block).dispatch("mouseleave");
+        });
+        labels.on("click", function (e, d) {
+            TipBox.get(block).dispatch("click", {
+                bubbles: false,
+                cancelable: true,
+                detail: {
+                    multySelect: e.ctrlKey || e.metaKey,
+                    keyValue: d
+                }
+            });
+        });
+    }
+    static removeEvents(axisElement) {
+        const labels = axisElement.selectAll(".tick text");
+        labels.on("mousemove", null);
+        labels.on("mouseleave", null);
+        labels.on("click", null);
+    }
 }