Version 5.18.0

Author: martynasma

build/tasks/build-script.js

@@ -327,7 +327,8 @@ module.exports = async (state) => {
 				{
 					test: /\.js$/,
 					enforce: "pre",
-					use: ["source-map-loader"]
+					use: ["source-map-loader"],
+					exclude: /node_modules/,
 				},
 			]
 		},

build/tasks/generate-classes.js

@@ -11,6 +11,10 @@ function mapClass(name) {
 	case "DurationAxis":
 	case "GaplessDateAxis":
 		return `${name}<AxisRenderer>`;
+	case "GanttCategoryAxis":
+		return `${name}<GanttCategoryAxisRenderer>`;
+	case "GanttDateAxis":
+		return `${name}<GanttDateAxisRenderer>`;
 	default:
 		return name;
 	}
@@ -102,8 +106,8 @@ async function writeJson(state, classes, keys) {
 
 		imports.push(`import type { ${className} } from "./${chunk}";`);
 		types.push(`\t"${key}": () => Promise<typeof ${className}>;`);
-		properties.push(`\t"${key}": () => import(/* webpackExports: "${className}", webpackChunkName: "json_${chunkName(chunk)}" */ "./${chunk}").then((m) => m.${className}),`);
-		propertiesScript.push(`\t"${key}": () => import(/* webpackExports: "${className}", webpackMode: "weak" */ "./${chunk}").then((m) => m.${className}),`);
+		properties.push(`\t"${key}": () => import(/* webpackChunkName: "json_${chunkName(chunk)}" */ "./${chunk}").then((m) => m.${className}),`);
+		propertiesScript.push(`\t"${key}": () => import(/* webpackMode: "weak" */ "./${chunk}").then((m) => m.${className}),`);
 	});
 
 	await writeFile(state.dir("src", ".internal", "plugins", "json", "Classes.ts"), `/**

package.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "name": "@amcharts/amcharts5",
-  "version": "5.17.3",
+  "version": "5.18.0",
   "author": "amCharts <contact@amcharts.com> (https://www.amcharts.com/)",
   "description": "amCharts 5",
   "homepage": "https://www.amcharts.com/",
@@ -53,12 +53,16 @@
     "d3-voronoi-treemap": "^1.1.2",
     "flatpickr": "^4.6.13",
     "markerjs2": "^2.29.4",
-    "pdfmake": "^0.2.2",
+    "pdfmake": "~0.3.9",
     "polylabel": "^1.1.0",
     "seedrandom": "^3.0.5",
     "svg-arc-to-cubic-bezier": "^3.2.0",
     "tslib": "^2.2.0"
   },
+  "resolutions": {
+    "@types/node": "^18.0.0",
+    "@types/d3-dispatch": "3.0.6"
+  },
   "devDependencies": {
     "@types/seedrandom": "^3.0.5",
     "ansi-colors": "^4.1.1",

packages/shared/CHANGELOG.md

@@ -5,6 +5,21 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/).
 Please note, that this project, while following numbering syntax, it DOES NOT
 adhere to [Semantic Versioning](http://semver.org/spec/v2.0.0.html) rules.
 
+## [5.18.0] - 2026-06-04
+
+### Added
+- `fitNodes` (default: `false`) setting added to `Tree` chart. If set to `true`, hidden nodes will excluded from the layout, giving more space for visible ones.
+
+### Changed
+- `pdfmake` dependency updated to `^0.3.9`. For those using only amCharts Exporting API, nothing changes. Only if you are accessing pdfmake object directly, there are some breaking API changes. [More info](https://www.amcharts.com/docs/v5/tutorials/pdfmake-upgrade-notice-02-03/).
+- Renamed `type` setting to `maType` on moving average indicators (`MovingAverage`, `MovingAverageDeviation`, `MovingAverageEnvelope`, `BollingerBands`). (setting `type` will work as well, but it's deprecated)
+- Renamed `type` setting to `shapeType` on `VoronoiTreemap`. (setting `type` will work as well, but it's deprecated)
+
+### Fixed
+- `PictorialStackedSeries` was not correctly guarding against `NaN` scale values, which could result in invalid scale being applied to the series mask and graphics.
+- Saving/serializing `StockChart` now includes `fontFamily`, `fontWeight`, and `fontStyle` settings for labels.
+
+
 ## [5.17.3] - 2026-05-29
 
 ### Added

src/.internal/charts/funnel/PictorialStackedSeries.ts

@@ -74,7 +74,7 @@ export class PictorialStackedSeries extends PyramidSeries {
 		else {
 			scale = h / mh;
 		}
-		if (scale != Infinity && scale != NaN) {
+		if (scale != Infinity && !Number.isNaN(scale)) {
 			seriesMask.set("scale", scale);
 			seriesMask.set("x", w / 2);
 			seriesMask.set("y", h / 2);

src/.internal/charts/hierarchy/HierarchyDefaultTheme.ts

@@ -459,7 +459,7 @@ export class HierarchyDefaultTheme extends Theme {
 
 		{
 			r("VoronoiTreemap").setAll({
-				type: "polygon",
+				shapeType: "polygon",
 				minWeightRatio: 0.005,
 				convergenceRatio: 0.005,
 				maxIterationCount: 100,

src/.internal/charts/hierarchy/Tree.ts

@@ -1,8 +1,11 @@
 import type { DataItem } from "../../core/render/Component";
 import type { IPoint } from "../../core/util/IPoint";
+import type { IHierarchyDataObject, IHierarchyDataItem } from "./Hierarchy";
 
 import { LinkedHierarchy, ILinkedHierarchyPrivate, ILinkedHierarchySettings, ILinkedHierarchyDataItem, ILinkedHierarchyEvents } from "./LinkedHierarchy";
 
+import * as $array from "../../core/util/Array";
+import * as $type from "../../core/util/Type";
 import * as d3hierarchy from "d3-hierarchy";
 
 export interface ITreeDataObject {
@@ -66,6 +69,15 @@ export interface ITreeSettings extends ILinkedHierarchySettings {
 	 */
 	nodeSeparation?: (a: DataItem<ITreeDataItem>, b: DataItem<ITreeDataItem>) => number;
 
+	/**
+	 * If set to `true`, hidden or disabled nodes are excluded from the layout
+	 * so that visible nodes spread out to fill the available chart area.
+	 *
+	 * @default false
+	 * @since 5.18.0
+	 */
+	fitNodes?: boolean;
+
 }
 
 export interface ITreePrivate extends ILinkedHierarchyPrivate {
@@ -106,6 +118,10 @@ export class Tree extends LinkedHierarchy {
 	public _packData: ITreeDataObject | undefined;
 
 	public _prepareChildren() {
+		if (this.isDirty("fitNodes")) {
+			this._valuesDirty = true;
+		}
+
 		super._prepareChildren();
 
 		if (this.isDirty("clustered")) {
@@ -118,6 +134,67 @@ export class Tree extends LinkedHierarchy {
 		}
 	}
 
+	protected _makeHierarchyData(data: IHierarchyDataObject, dataItem: DataItem<IHierarchyDataItem>) {
+		if (!this.get("fitNodes")) {
+			super._makeHierarchyData(data, dataItem);
+			return;
+		}
+
+		data.dataItem = dataItem;
+		const children = (dataItem as DataItem<ITreeDataItem>).get("children");
+		if (children) {
+			const childrenDataArray: Array<IHierarchyDataObject> = [];
+			data.children = childrenDataArray;
+			$array.each(children, (childDataItem) => {
+				if (childDataItem.isHidden()) {
+					return;
+				}
+				const node = childDataItem.get("node");
+				if (node && node.isHidden()) {
+					return;
+				}
+				const childData = {};
+				childrenDataArray.push(childData);
+				this._makeHierarchyData(childData, childDataItem);
+			});
+		}
+
+		const value = dataItem.get("valueWorking");
+		if ($type.isNumber(value)) {
+			data.value = value;
+		}
+	}
+
+	public async hideDataItem(dataItem: DataItem<this["_dataItemSettings"]>, duration?: number): Promise<void> {
+		const result = super.hideDataItem(dataItem, duration);
+		if (this.get("fitNodes")) {
+			this.markDirtyValues();
+		}
+		return result;
+	}
+
+	public async showDataItem(dataItem: DataItem<this["_dataItemSettings"]>, duration?: number): Promise<void> {
+		const result = super.showDataItem(dataItem, duration);
+		if (this.get("fitNodes")) {
+			this.markDirtyValues();
+		}
+		return result;
+	}
+
+	public disableDataItem(dataItem: DataItem<this["_dataItemSettings"]>, duration?: number) {
+		super.disableDataItem(dataItem, duration);
+		if (this.get("fitNodes")) {
+			this.markDirtyValues();
+		}
+	}
+
+	public enableDataItem(dataItem: DataItem<this["_dataItemSettings"]>, maxDepth?: number, depth?: number, duration?: number) {
+		super.enableDataItem(dataItem, maxDepth, depth, duration);
+		if (this.get("fitNodes")) {
+			this.markDirtyValues();
+		}
+	}
+
 	protected _updateVisuals() {
 		if (this._rootNode) {
 			const layout = this._hierarchyLayout;

src/.internal/charts/hierarchy/VoronoiTreemap.ts

@@ -46,14 +46,21 @@ export interface IVoronoiTreemapSettings extends IHierarchySettings {
 	 * @see {@link https://www.amcharts.com/docs/v5/charts/hierarchy/voronoi-treemap/#Diagram_type} for more info
 	 * @default "polygon"
 	 */
+	shapeType?: "rectangle" | "polygon"
+
+	/**
+	 * Type of the diagram's shape.
+	 * Left for backward compatibility. Please use `shapeType` instead.
+	 * @ignore
+	 */
 	type?: "rectangle" | "polygon"
 
 	/**
-	 * Number of corners when type is `"polygon"`.
+	 * Number of corners when `shapeType` is `"polygon"`.
 	 *
 	 * `120` means the polygon will look like a circle.
 	 *
-	 * NOTE: this setting is ignored if `type="rectangle"`.
+	 * NOTE: this setting is ignored if `shapeType="rectangle"`.
 	 *
 	 * @default 120
 	 */
@@ -154,6 +161,11 @@ export class VoronoiTreemap extends Hierarchy {
 	public _prepareChildren() {
 		super._prepareChildren();
 
+		if (this.isDirty("type") && this.get("type") !== undefined) {
+			this.set("shapeType", this.get("type"));
+			this.setRaw("type", undefined);
+		}
+
 		const width = this.innerWidth() / 2;
 		const height = this.innerHeight() / 2;
 
@@ -168,15 +180,15 @@ export class VoronoiTreemap extends Hierarchy {
 		this.voronoi.maxIterationCount((this.get("maxIterationCount", 100)));
 		this.voronoi.minWeightRatio((this.get("minWeightRatio", 0.005)));
 
-		if (this.isDirty("type")) {
-			if (this.get("type") == "polygon") {
+		if (this.isDirty("shapeType")) {
+			if (this.get("shapeType") == "polygon") {
 				this.voronoi.clip(this.getCirclePolygon(1));
 				this._updateVisuals();
 			}
 		}
 
 		if (this._sizeDirty) {
-			if (this.get("type") == "rectangle") {
+			if (this.get("shapeType") == "rectangle") {
 				this.voronoi.prng(seedrandom("X"));
 				this.voronoi.clip([[-width, -height], [-width, height], [width, height], [width, -height]])(node);
 				this._updateVisuals();
@@ -199,7 +211,7 @@ export class VoronoiTreemap extends Hierarchy {
 			let coordinates: any = [];
 
 			let d = 1;
-			if (this.get("type") == "polygon") {
+			if (this.get("shapeType") == "polygon") {
 				d = Math.min(this.innerWidth(), this.innerHeight()) / 2;
 			}
 

src/.internal/charts/stock/StockChartDefaultTheme.ts

@@ -765,7 +765,7 @@ export class StockChartDefaultTheme extends Theme {
 
 		r("LineSeries", ["indicator", "bollingerbands"]).setAll({
 			legendValueText: "[{lowerColor} bold]{lower.formatNumber('#.00')}[/] [{seriesColor} bold]{valueY.formatNumber('#.00')}[/] [{upperColor} bold]{upper.formatNumber('#.00')}[/]",
-			legendLabelText: "{shortName} ({period.formatNumber('#.')},{field},{standardDeviations.formatNumber('#.')},{type})"
+			legendLabelText: "{shortName} ({period.formatNumber('#.')},{field},{standardDeviations.formatNumber('#.')},{maType})"
 		})
 
 		r("LineSeries", ["indicator", "macross"]).setAll({
@@ -820,7 +820,7 @@ export class StockChartDefaultTheme extends Theme {
 
 		r("LineSeries", ["movingaverage"]).setAll({
 			legendValueText: "[{seriesColor} bold]{valueY.formatNumber('#.00')}[/]",
-			legendLabelText: "{shortName} ({period.formatNumber('#.')},{field},{type},{offset.formatNumber('#.')})"
+			legendLabelText: "{shortName} ({period.formatNumber('#.')},{field},{maType},{offset.formatNumber('#.')})"
 		})
 
 		r("ColumnSeries", ["movingaveragedeviation"]).setAll({
@@ -829,7 +829,7 @@ export class StockChartDefaultTheme extends Theme {
 
 		r("LineSeries", ["indicator", "movingaverageenvelope"]).setAll({
 			legendValueText: "[{lowerColor} bold]{lower.formatNumber('#.00')}[/] [{seriesColor} bold]{valueY.formatNumber('#.00')}[/] [{upperColor} bold]{upper.formatNumber('#.00')}[/]",
-			legendLabelText: "{shortName} ({period.formatNumber('#.')},{field},{shiftType},{shift.formatNumber('#.')},{type})"
+			legendLabelText: "{shortName} ({period.formatNumber('#.')},{field},{shiftType},{shift.formatNumber('#.')},{maType})"
 		})
 
 		r("LineSeries", ["onbalancevolume"]).setAll({
@@ -974,7 +974,7 @@ export class StockChartDefaultTheme extends Theme {
 			name: l.translateAny("Moving Average"),
 			shortName: l.translateAny("MA"),
 			seriesColor: color(0xab82da),
-			type: "simple",
+			maType: "simple",
 			field: "close",
 			period: 20,
 			offset: 0
@@ -1004,7 +1004,7 @@ export class StockChartDefaultTheme extends Theme {
 			seriesColor: color(0xff903f),
 			upperColor: color(0xffc948),
 			lowerColor: color(0xffaf74),
-			type: "simple",
+			maType: "simple",
 			field: "close",
 			period: 20,
 			offset: 0,
@@ -1017,7 +1017,7 @@ export class StockChartDefaultTheme extends Theme {
 			shortName: l.translateAny("MA Dev"),
 			increasingColor: ic.get("positive"),
 			decreasingColor: ic.get("negative"),
-			type: "simple",
+			maType: "simple",
 			field: "close",
 			period: 20
 		})

src/.internal/charts/stock/indicators/BollingerBands.ts

@@ -81,7 +81,7 @@ export class BollingerBands extends MovingAverage {
 		type: "dropdown",
 		options: ["open", "close", "low", "high", "hl/2", "hlc/3", "hlcc/4", "ohlc/4"]
 	}, {
-		key: "type",
+		key: "maType",
 		name: this.root.language.translateAny("Type"),
 		type: "dropdown",
 		options: ["simple", "weighted", "exponential", "dema", "tema"]