@amcharts/amcharts5-mcp 1.5.0 → 1.6.0

package/extended/examples/candlestick-ohlc/ohlc-chart.md

@@ -2,7 +2,7 @@
 title: "OHLC Chart"
 source: "https://www.amcharts.com/demos/ohlc-chart/"
 category: "candlestick-ohlc"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 The OHLC chart is a very popular way to display financial (and other) data over time with open, high, low, and close values for periods.
@@ -115,10 +115,7 @@ var series = chart.series.push(am5xy.OHLCSeries.new(root, {
   legendRangeValueText: "{valueYClose}",
   tooltip: am5.Tooltip.new(root, {
     pointerOrientation: "horizontal",
-    labelText: "open: {openValueY}
-low: {lowValueY}
-high: {highValueY}
-close: {valueY}"
+    labelText: "open: {openValueY}\nlow: {lowValueY}\nhigh: {highValueY}\nclose: {valueY}"
   })
 }));
 
@@ -170,7 +167,7 @@ var sbseries = scrollbar.chart.series.push(am5xy.LineSeries.new(root, {
 
 // Add legend
 // https://www.amcharts.com/docs/v5/charts/xy-chart/legend-xy-series/
-var legend = yAxis.axisHeader.children.push(
+var legend = chart.plotContainer.children.push(
   am5.Legend.new(root, {})
 );
 

package/extended/examples/candlestick-ohlc/on-demand-data-loading.md

@@ -2,18 +2,18 @@
 title: "On-Demand Data Loading"
 source: "https://www.amcharts.com/demos/on-demand-data-loading/"
 category: "candlestick-ohlc"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 This demo shows a sample Stock chart setup which can load its data on-demand.
 Try panning the chart chart, zooming, switching granularity. The code will gracefully handle loading missing data from the backend.
 It relies on a few of the technologies implemented in amCharts 5:
- 	Incremental data loading
- 	CSV data loading and parsing
- 	Stacked axes
- 	Incremental on-demand data loading (commentary about the code behind this demo)
- 	Stacked axes
- 	XY chart
+Incremental data loading
+CSV data loading and parsing
+Stacked axes
+Incremental on-demand data loading (commentary about the code behind this demo)
+Stacked axes
+XY chart
 
 ## JavaScript
 

package/extended/examples/candlestick-ohlc/professional-candlesticks.md

@@ -2,7 +2,7 @@
 title: "Professional Candlesticks"
 source: "https://www.amcharts.com/demos/professional-candlesticks/"
 category: "candlestick-ohlc"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Professional candlestick chart is similar to the "regular" candlestick chart but applies different coloring logic. You may notice that some candlesticks are filled and some are hollow. More about this type of candlesticks can be found in the docs.
@@ -120,10 +120,7 @@ var series = chart.series.push(
     legendRangeValueText: "{valueYClose}",
     tooltip: am5.Tooltip.new(root, {
       pointerOrientation: "horizontal",
-      labelText: "open: {openValueY}
-low: {lowValueY}
-high: {highValueY}
-close: {valueY}"
+      labelText: "open: {openValueY}\nlow: {lowValueY}\nhigh: {highValueY}\nclose: {valueY}"
     })
   })
 );
@@ -183,7 +180,7 @@ var sbseries = scrollbar.chart.series.push(
 
 // Add legend
 // https://www.amcharts.com/docs/v5/charts/xy-chart/legend-xy-series/
-var legend = yAxis.axisHeader.children.push(am5.Legend.new(root, {}));
+var legend = chart.plotContainer.children.push(am5.Legend.new(root, {}));
 
 legend.data.push(series);
 

package/extended/examples/candlestick-ohlc/stock-chart-candlesticks.md

@@ -2,7 +2,7 @@
 title: "Stock Chart Candlesticks"
 source: "https://www.amcharts.com/demos/stock-chart-candlesticks/"
 category: "candlestick-ohlc"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 You can create your typical stock charts with amCharts XYChart. In this example we create a candlestick stock price graph and a volume graph under it.

package/extended/examples/column-bar/100-stacked-column-chart.md

@@ -2,15 +2,15 @@
 title: "100% Stacked Column Chart"
 source: "https://www.amcharts.com/demos/100-stacked-column-chart/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 100% stacked column or bar chart is a good way to display some categories of a whole changing over time. For example, a company may use 100% stacked column chart to display what product lines contributed to its revenue by calendar quarter. The downside is that in such a chart it is quite difficult to visually compare the changes over time (except for the first item/series).
 Key implementation details
 You don't need to perform percentage calculations in your code. You can pass your real values to amCharts and the chart will do the rest. For this purpose, we enable calculateTotals (more info here) on the value axis (the Y-axis in this case) and set its range to 0 to 100 (plus enforce it with strictMinMax to disable "smart" min/max features).
 Then, in our series we set the valueYField to our real value, as usual. But after that we take advantage of the "Display fields" feature in amCharts. Display fields allow us to reference derivative calculated values instead of raw values from our data set. In this case we want to set our respective display field (valueYFieldShow) to display the percentage share of our real value. For this we set it to the valueYTotalPercent calculated field.
- 	Calculated values on value axes
- 	Display fields - a way to show alternative values
+Calculated values on value axes
+Display fields - a way to show alternative values
 
 ## JavaScript
 

package/extended/examples/column-bar/bar-and-line-chart-mix.md

@@ -2,7 +2,7 @@
 title: "Bar and Line Chart Mix"
 source: "https://www.amcharts.com/demos/bar-and-line-chart-mix/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Mixing bar and line chart in the same visual is a good way to emphasize the difference between series while still maintaining their relationship.
@@ -40,13 +40,6 @@ var chart = root.container.children.push(am5xy.XYChart.new(root, {
 }));
 
 
-// Add legend
-// https://www.amcharts.com/docs/v5/charts/xy-chart/legend-xy-series/
-var legend = chart.children.push(am5.Legend.new(root, {
-  centerX: am5.p50,
-  x: am5.p50
-}))
-
 var data = [{
   "year": "2005",
   "income": 23.5,
@@ -112,8 +105,7 @@ var series1 = chart.series.push(am5xy.ColumnSeries.new(root, {
   sequencedInterpolation: true,
   tooltip: am5.Tooltip.new(root, {
     pointerOrientation: "horizontal",
-    labelText: "[bold]{name}[/]
-{categoryY}: {valueX}"
+    labelText: "[bold]{name}[/]\n{categoryY}: {valueX}"
   })
 }));
 
@@ -131,8 +123,7 @@ var series2 = chart.series.push(am5xy.LineSeries.new(root, {
   sequencedInterpolation: true,
   tooltip: am5.Tooltip.new(root, {
     pointerOrientation: "horizontal",
-    labelText: "[bold]{name}[/]
-{categoryY}: {valueX}"
+    labelText: "[bold]{name}[/]\n{categoryY}: {valueX}"
   })
 }));
 

package/extended/examples/column-bar/bar-chart-race.md

@@ -2,7 +2,7 @@
 title: "Bar Chart Race"
 source: "https://www.amcharts.com/demos/bar-chart-race/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Bar Chart Race is a great and highly visual way to display data changing over time in the form of an animated bar chart. It's a very comprehensible representation of time-based changes in data.
@@ -450,21 +450,14 @@ var series = chart.series.push(am5xy.ColumnSeries.new(root, {
   xAxis: xAxis,
   yAxis: yAxis,
   valueXField: "value",
-  categoryYField: "network"
+  categoryYField: "network",
+  // Each column takes its own color from the series palette
+  colorByDataItem: true
 }));
 
 // Rounded corners for columns
 series.columns.template.setAll({ cornerRadiusBR: 5, cornerRadiusTR: 5 });
 
-// Make each column to be of a different color
-series.columns.template.adapters.add("fill", function (fill, target) {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
-series.columns.template.adapters.add("stroke", function (stroke, target) {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
 // Add label bullet
 series.bullets.push(function () {
   return am5.Bullet.new(root, {

package/extended/examples/column-bar/bars-with-moving-bullets.md

@@ -2,7 +2,7 @@
 title: "Bars with Moving Bullets"
 source: "https://www.amcharts.com/demos/bars-with-moving-bullets/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Interactivity is a great way to direct viewers attention in visualizations. amCharts 5 helps you implement moving bullets in a conservative but effective bar chart to make it way more appealing without sacrificing the maximum comprehension level of this classic chart type.

package/extended/examples/column-bar/bullet-chart.md

@@ -2,7 +2,7 @@
 title: "Bullet Chart"
 source: "https://www.amcharts.com/demos/bullet-chart/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Bullet Chart (also know as Bullet graph) is a great replacement for traditional dashboard gauges and meters. It empowers to display way more information in a more compact space by getting rid of unnecessary decoration in favor of data clarity and usability.

package/extended/examples/column-bar/carbon-zero-progress.md

@@ -2,7 +2,7 @@
 title: "Carbon-zero Progress"
 source: "https://www.amcharts.com/demos/carbon-zero-progress/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 amCharts flexibility allows you to go way beyond canonical chart types and use our libraries to build vast variety of data visualizations. In this demo we use the XY chart to implement a beautiful progress bar.
@@ -248,8 +248,7 @@ series.bullets.push(function(root, target, dataItem) {
     }));
     
     var label = container.children.push(am5.Label.new(root, {
-      text: "GOAL
-[bold]ZERO[/]",
+      text: "GOAL\n[bold]ZERO[/]",
       textAlign: "center",
       //fontSize: "10",
       fill: am5.color(0xffffff),

package/extended/examples/column-bar/clustered-bar-chart.md

@@ -2,13 +2,13 @@
 title: "Clustered Bar Chart"
 source: "https://www.amcharts.com/demos/clustered-bar-chart/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Clustered Bar Chart (also known as Grouped bar chart, Multi-series bar chart) is great for displaying and comparing multiple sets of data over the same categories (like sales revenue of various departments of the company over several years).
 Key implementation details
 Clustered is the default behavior for the column/bar chart, so you don't have to do anything extra to achieve the "clustering".
-To make a horizontal Bar chart (as opposed to a vertical Column chart) we set yAxis to be a CategoryAxis and xAxis to a ValueAxis. Accordingly, we set valueXField and categoryYField properties on the series, so they know that categories go along the Y axis and values along the X. 
+To make a horizontal Bar chart (as opposed to a vertical Column chart) we set yAxis to be a CategoryAxis and xAxis to a ValueAxis. Accordingly, we set valueXField and categoryYField properties on the series, so they know that categories go along the Y axis and values along the X.
 Normally, axes start at the 0 point (bottom-left) but in this case we wanted years to go from top to bottom. To achieve this, we've set inversed: true on the category axis renderer.
 Finally, to make bars appear in a sequenced animation (one-by-one and not all at once) we enable sequencedInterpolation on the series.
 XY chart axes
@@ -42,15 +42,6 @@ var chart = root.container.children.push(am5xy.XYChart.new(root, {
   layout: root.verticalLayout
 }));
 
-
-// Add legend
-// https://www.amcharts.com/docs/v5/charts/xy-chart/legend-xy-series/
-var legend = chart.children.push(am5.Legend.new(root, {
-  centerX: am5.p50,
-  x: am5.p50
-}))
-
-
 // Data
 var data = [{
   year: "2017",
@@ -110,8 +101,7 @@ function createSeries(field, name) {
     sequencedInterpolation: true,
     tooltip: am5.Tooltip.new(root, {
       pointerOrientation: "horizontal",
-      labelText: "[bold]{name}[/]
-{categoryY}: {valueX}"
+      labelText: "[bold]{name}[/]\n{categoryY}: {valueX}"
     })
   }));
 

package/extended/examples/column-bar/clustered-column-chart.md

@@ -2,13 +2,13 @@
 title: "Clustered Column Chart"
 source: "https://www.amcharts.com/demos/clustered-column-chart/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Clustered Column Chart is the default column chart behavior where values from all series are displayed next to each other at the same category axis value.
 Key implementation details
 In this demo we emphasize the "clusters" by adding margins around them. We do this by setting cellStartLocation and cellEndLocation on the horizontal axis renderer (AxisRendererX). We set them to 0.1 and 0.9 respectively, resulting in 10% margins on both sides.
- 	Cell start/end locations
+Cell start/end locations
 
 ## JavaScript
 

package/extended/examples/column-bar/column-and-line-mix.md

@@ -2,7 +2,7 @@
 title: "Column and Line Mix"
 source: "https://www.amcharts.com/demos/column-and-line-mix/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 You can use our XYChart to mix and match various types of two-dimensional charts - line, bar, column, area, candlestick, OHLC, etc. The most common combination is the column and line chart.

package/extended/examples/column-bar/column-chart-images-top.md

@@ -2,7 +2,7 @@
 title: "Column Chart with Images on Top"
 source: "https://www.amcharts.com/demos/column-chart-images-top/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Bullets in amCharts 5 are more than just a way to display geometric shapes over the data points. You can display anything inside the bullet - from a simple circle to a fully fledged sub-chart. In this demo we display images as bullet content.
@@ -77,7 +77,9 @@ var series = chart.series.push(am5xy.ColumnSeries.new(root, {
   valueYField: "value",
   sequencedInterpolation: true,
   categoryXField: "name",
-  tooltip: am5.Tooltip.new(root, { dy: -25, labelText: "{valueY}" })
+  tooltip: am5.Tooltip.new(root, { dy: -25, labelText: "{valueY}" }),
+  // Each column takes its own color from the series palette
+  colorByDataItem: true
 }));
 
 
@@ -87,14 +89,6 @@ series.columns.template.setAll({
   strokeOpacity: 0
 });
 
-series.columns.template.adapters.add("fill", (fill, target) => {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
-series.columns.template.adapters.add("stroke", (stroke, target) => {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
 // Set data
 var data = [
   {

package/extended/examples/column-bar/column-with-rotated-series.md

@@ -2,7 +2,7 @@
 title: "Column with Rotated Labels"
 source: "https://www.amcharts.com/demos/column-with-rotated-series/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 In this demo, we create a simple column chart.
@@ -91,19 +91,12 @@ var series = chart.series.push(am5xy.ColumnSeries.new(root, {
   categoryXField: "country",
   tooltip: am5.Tooltip.new(root, {
     labelText: "{valueY}"
-  })
+  }),
+  // Each column takes its own color from the series palette
+  colorByDataItem: true
 }));
 
 series.columns.template.setAll({ cornerRadiusTL: 5, cornerRadiusTR: 5, strokeOpacity: 0 });
-series.columns.template.adapters.add("fill", function (fill, target) {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
-series.columns.template.adapters.add("stroke", function (stroke, target) {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
-
 // Set data
 var data = [{
   country: "USA",

package/extended/examples/column-bar/columns-with-grainy-gradients.md

@@ -2,7 +2,7 @@
 title: "Columns with Grainy Gradients"
 source: "https://www.amcharts.com/demos/columns-with-grainy-gradients/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Grain pattern is a special kind of pattern that can complement regular fills with overhead pixel noise to add that additional fuzzy look. It works by applying a random assortment of semi-transparent dots over existing fills.
@@ -88,6 +88,9 @@ var series = chart.series.push(am5xy.ColumnSeries.new(root, {
   tooltip: am5.Tooltip.new(root, {
     labelText: "{valueY}"
   }),
+  // Each column takes its own color, from the palette set above
+  colorByDataItem: true,
+  colors: chart.get("colors")
 }));
 
 series.columns.template.setAll({
@@ -123,10 +126,6 @@ series.columns.template.states.create("hover", {
   cornerRadiusTR: 10
 })
 
-series.columns.template.adapters.add("fill", function (fill, target) {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
 // Set data
 var data = [{
   country: "USA",

package/extended/examples/column-bar/columns-with-moving-bullets.md

@@ -2,7 +2,7 @@
 title: "Columns with Moving Bullets"
 source: "https://www.amcharts.com/demos/columns-with-moving-bullets/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Interactivity is a great way to direct viewers attention in visualizations. amCharts 5 helps you implement moving bullets in a conservative but effective bar chart to make it way more appealing without sacrificing the maximum comprehension level of this classic chart type.

package/extended/examples/column-bar/curved-columns.md

@@ -2,7 +2,7 @@
 title: "Curved Columns"
 source: "https://www.amcharts.com/demos/curved-columns/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Curved Column Chart (also known as Curved Bar Chart) is a visual variation of a "standard" bar chart. Semantically there's no difference between regular and curved column chart. The only difference is that columns are displayed in the shape of areas instead of regular rectangles. This gives the chart a fresher visual look while sacrificing clarity a bit, as curves of the columns have no meaning.
@@ -81,7 +81,9 @@ var series = chart.series.push(
     yAxis: yAxis,
     valueYField: "value",
     sequencedInterpolation: true,
-    categoryXField: "country"
+    categoryXField: "country",
+    // Each column takes its own color from the series palette
+    colorByDataItem: true
   })
 );
 
@@ -90,14 +92,6 @@ series.columns.template.setAll({
   fillOpacity: 0.9,
   strokeOpacity: 0
 });
-series.columns.template.adapters.add("fill", (fill, target) => {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
-series.columns.template.adapters.add("stroke", (stroke, target) => {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
 series.columns.template.set("draw", function(display, target) {
   var w = target.getPrivate("width", 0);
   var h = target.getPrivate("height", 0);

package/extended/examples/column-bar/divergent-stacked-bars.md

@@ -2,7 +2,7 @@
 title: "Divergent Stacked Bars"
 source: "https://www.amcharts.com/demos/divergent-stacked-bars/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Sometimes you want to stack all the bars in a bar chart on top of each other. Other times, you want some parts of the chart go into diverging directions. This demo shows you a simple way to achieve that with amCharts.
@@ -40,15 +40,6 @@ var chart = root.container.children.push(
 // Use only absolute numbers
 root.numberFormatter.set("numberFormat", "#.#s'%");
 
-// Add legend
-// https://www.amcharts.com/docs/v5/charts/xy-chart/legend-xy-series/
-var legend = chart.children.push(
-  am5.Legend.new(root, {
-    centerX: am5.p50,
-    x: am5.p50
-  })
-);
-
 // Data
 var data = [{
   category: "Search engines",

package/extended/examples/column-bar/drag-and-change-column-value.md

@@ -2,7 +2,7 @@
 title: "Drag and change column value"
 source: "https://www.amcharts.com/demos/drag-and-change-column-value/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 While amCharts libraries primarily focus on data visualization, they can also be used as UI where it makes sense, thanks to all the great interactivity features. In this demo you can adjust the values behind the columns simply by dragging the columns up and down.
@@ -119,19 +119,12 @@ var series = chart.series.push(am5xy.ColumnSeries.new(root, {
   valueXField: "date",
   tooltip: am5.Tooltip.new(root, {
     labelText: "{valueY}"
-  })
+  }),
+  // Each column takes its own color from the series palette
+  colorByDataItem: true
 }));
 
 series.columns.template.setAll({ cornerRadiusTL: 5, cornerRadiusTR: 5, strokeOpacity: 0 });
-series.columns.template.adapters.add("fill", function (fill, target) {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
-series.columns.template.adapters.add("stroke", function (stroke, target) {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
-
 // manipulating with mouse code
 var isDown = false;
 

package/extended/examples/column-bar/drag-ordering-of-bars.md

@@ -2,7 +2,7 @@
 title: "Drag-ordering of Bars"
 source: "https://www.amcharts.com/demos/drag-ordering-of-bars/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 While data visualization is the primary function of amCharts, you can also use its interactive features to let end-users adjust the charts how they see fit. In this example, viewers can re-arrange the order of bars in the chart.

package/extended/examples/column-bar/dumbbell-plot.md

@@ -2,7 +2,7 @@
 title: "Dumbbell Plot"
 source: "https://www.amcharts.com/demos/dumbbell-plot/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Dumbbell plot (also known as Dumbbell chart, Connected dot plot) is great for displaying changes between two points in time, two conditions or differences between two groups.

package/extended/examples/column-bar/floating-bar-chart.md

@@ -2,7 +2,7 @@
 title: "Floating Bar Chart"
 source: "https://www.amcharts.com/demos/floating-bar-chart/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Bars in a bar chart don't have to start at zero. In cases when you need to specify a different starting value in amCharts 5, you set an openValueXField on a ColumnSeries
@@ -125,8 +125,7 @@ var series = chart.series.push(am5xy.ColumnSeries.new(root, {
 series.columns.template.setAll({
   height: am5.percent(100),
   templateField: "columnSettings",
-  tooltipText: "[bold]{name}[/]
-{categoryY}: {valueX}"
+  tooltipText: "[bold]{name}[/]\n{categoryY}: {valueX}"
 });
 
 series.data.setAll(data);

package/extended/examples/column-bar/grouped-and-sorted-columns.md

@@ -2,7 +2,7 @@
 title: "Grouped and Sorted Columns"
 source: "https://www.amcharts.com/demos/grouped-and-sorted-columns/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 amCharts libraries are flexible in a way that even when something is not a special feature in the library, you can still easily implement it with amCharts. In this case we have a 2-level deep dataset but we want to represent it as a column chart you see here - no problem with amCharts 5!
@@ -89,7 +89,9 @@ var series = chart.series.push(
     categoryXField: "category",
     tooltip: am5.Tooltip.new(root, {
       labelText: "{provider} {realName}: {valueY}"
-    })
+    }),
+    // Each column takes its own color from the series palette
+    colorByDataItem: true
   })
 );
 
@@ -97,14 +99,6 @@ series.columns.template.setAll({
   fillOpacity: 0.9,
   strokeOpacity: 0
 });
-series.columns.template.adapters.add("fill", (fill, target) => {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
-series.columns.template.adapters.add("stroke", (stroke, target) => {
-  return chart.get("colors").getIndex(series.columns.indexOf(target));
-});
-
 var lineSeries = chart.series.push(
   am5xy.LineSeries.new(root, {
     name: "Series 2",

package/extended/examples/column-bar/grouped-stacks.md

@@ -2,7 +2,7 @@
 title: "Grouped Stacks"
 source: "https://www.amcharts.com/demos/grouped-stacks/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 This demo uses multiple stacked series to create virtual groups.

package/extended/examples/column-bar/heat-map-with-legend.md

@@ -2,16 +2,16 @@
 title: "Heat Map with Legend"
 source: "https://www.amcharts.com/demos/heat-map-with-legend/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
-Heat map (also known as Heatmap, Heat table, Shading matrix) represents data in a rectangular matrix where individual values are differentiated by color.
-Heat rules
-Heat rules allow modifying element's properties based on its related value in data, like for instance, color of the columns on this charts.
-[More about head rules](https://www.amcharts.com/docs/v5/concepts/settings/heat-rules/)
-Heat legend
-A perfect companion for any color-based heat maps, a head legend can show the spectrum of values and their relation to colors.
-Furthermore, utilizing chart events, it's possible to further enhance UX by showing exact position of hovered element in the whole spectrum.
+Heat map (also known as Heatmap, Heat table, Shading matrix) represents data in a rectangular matrix where individual values are differentiated by color.
+Heat rules
+Heat rules allow modifying element's properties based on its related value in data, like for instance, color of the columns on this charts.
+[More about head rules](https://www.amcharts.com/docs/v5/concepts/settings/heat-rules/)
+Heat legend
+A perfect companion for any color-based heat maps, a head legend can show the spectrum of values and their relation to colors.
+Furthermore, utilizing chart events, it's possible to further enhance UX by showing exact position of hovered element in the whole spectrum.
 [More about head legend](https://www.amcharts.com/docs/v5/concepts/legend/heat-legend/)
 
 ## JavaScript

package/extended/examples/column-bar/horizontal-dumbbell-plot.md

@@ -2,7 +2,7 @@
 title: "Horizontal Dumbbell Plot"
 source: "https://www.amcharts.com/demos/horizontal-dumbbell-plot/"
 category: "column-bar"
-scraped: "2026-03-15"
+scraped: "2026-09-29"
 ---
 
 Dumbbell plot (also known as Dumbbell chart, Connected dot plot) is great for displaying changes between two points in time, two conditions or differences between two groups.