Сегмент URL-адреса «не определен» при нажатии на элемент вchart.js ⇐ Php

[Anonymous]

У меня возникли проблемы с Chart.js: нажатие на сегмент диаграммы всегда перенаправляет на неопределенное значение. У меня есть кольцевая диаграмма, и я хочу, чтобы каждый сегмент перенаправлялся на определенный URL-адрес в зависимости от выбранного сегмента. Однако перенаправление всегда приводит к неопределенному значению.
Вот соответствующая часть моего кода:
Шаблон Blade (Laravel):

Код: Выделить всё

document.addEventListener('DOMContentLoaded', function() {
var ctx = document.getElementById('teknisiChart').getContext('2d');

var chartData = {
labels: ['4 Tahun', '2-3 Tahun', '1 Tahun', 'Under 1 Tahun'],
datasets: [{
data: [
{{ $countMoreThan4Years }},
{{ $countBetween2and3Years }},
{{ $count1YearAgo }},
{{ $countLessThan1Year }}
],
backgroundColor: [
'rgba(255, 68, 68, 0.8)',
'rgba(255, 209, 91, 0.8)',
'rgba(223, 250, 125, 0.8)',
'rgba(114, 247, 137, 0.8)'
],
borderColor: [
'rgba(255, 99, 132, 1)'
],
borderWidth: 3
}]
};

var teknisiChart = new Chart(ctx, {
type: 'doughnut',
data: chartData,
options: {
onClick: function(evt, item) {
if (item.length > 0) {
var index = item[0].index;
console.log('Index:', index);
var category = ['more-than-4-years', '2-3-years', '1-year', 'under-1-year'][
index
];
console.log('Category:', category);
window.location.href = `{{ url('/hardware') }}/${category}`;
}
},
responsive: true,
plugins: {
tooltip: {
callbacks: {
label: function(tooltipItem) {
return chartData.labels[tooltipItem.dataIndex] + ': ' + tooltipItem
.formattedValue;
}
}
}
}
}
});
});

Метод контроллера (Laravel):

Код: Выделить всё

Подробнее здесь: [url]https://stackoverflow.com/questions/79001136/url-segment-undefined-when-clicking-on-item-in-chart-js[/url]