I am creating a drill down column chart in Amcharts5. My code is as follows:
var root = am5.Root.new("chartdiv");
root.setThemes([
am5themes_Animated.new(root)
]);
var chart = root.container.children.push(
am5xy.XYChart.new(root, {
width: am5.p100,
panY: false,
wheelY: "zoomX",
layout: root.verticalLayout
})
);
// Define data
var data = [{
category: "I&W",
value1: 1000,
sub: [{ maatregel: "eerste maat", value2: 200 },
{ maatregel: "tweede maat", value2: 388 }]
}, {
category: "J&V",
value1: 1200,
}, {
category: "Def",
value1: 850,
}];
// Cretae Y-axis
let yAxis = chart.yAxes.push(
am5xy.ValueAxis.new(root, {
renderer: am5xy.AxisRendererY.new(root, {
})
})
);
// Create X-Axis
var xAxis = chart.xAxes.push(
am5xy.CategoryAxis.new(root, {
maxDeviation: 0.2,
renderer: am5xy.AxisRendererX.new(root, {
}),
categoryField: "category"
})
);
xAxis.data.setAll(data);
// Create titles
yAxis.axisHeader.children.push(am5.Label.new(root, {
text:"Uitgaven in miljoenen",
centerX: am5.p50,
centerY: am5.p50
}));
xAxis.axisHeader.children.push(am5.Label.new(root, {
text:"Begroting",
fontsize: "35",
centerX: am5.p50,
centerY: am5.p50
}));
// Create series
var series = chart.series.push(
am5xy.ColumnSeries.new(root, {
name: "2022",
xAxis: xAxis,
yAxis: yAxis,
valueYField: "value1",
categoryXField: "category",
tooltip: am5.Tooltip.new(root, {})
})
);
series.data.setAll(data);
series.columns.template.setAll({
tooltipText: "{category}: {value1}"
});
// Add legend
var legend = chart.children.push(
am5.Legend.new(root, {
}));
legend.data.setAll(chart.series.values);
//event on clicking
series.columns.template.events.on("click", function myFunction(ev) {
if (ev.target.dataItem.dataContext.sub != undefined) {
console.log("test", ev.target.dataItem.dataContext.sub);
ev.chart.data = ev.target.dataItem.dataContext.sub;
}
});
The if statement is working as intended, as if you click on the second or third column, nothing happens. The problem isthat I get the following error message:
Uncaught TypeError: Cannot set properties of undefined (setting 'data')
What am I doing wrong?