diff --git a/app.js b/app.js index 200373c..3afd415 100644 --- a/app.js +++ b/app.js @@ -784,8 +784,8 @@ function renderChart(data) { myChart.setOption(option, { replaceMerge: ['series'] }); - // Update hover events with the new data structure - setupHoverEvents({ total: params.value, data: newData }); + // Update hover events with the new data structure, passing the drilled-down name + setupHoverEvents({ total: params.value, data: newData }, params.name); } }); @@ -1165,7 +1165,7 @@ function adjustChartSize() { } // Add mouseover handler to update details box -function setupHoverEvents(sunburstData) { +function setupHoverEvents(sunburstData, contextName = null) { const topItemsElement = document.getElementById('top-items'); // Create a container for details header with name and amount @@ -1521,9 +1521,10 @@ function setupHoverEvents(sunburstData) { // Show the default view with top categories function showDefaultView() { - // Use month name instead of "Total" + // Use context name (drilled-down sector) if provided, otherwise use month name const selectedMonth = document.getElementById('month-select').value; const monthName = getRussianMonthName(selectedMonth); + const displayName = contextName || monthName; // Create a virtual "data" object for the total view that contains all transactions const allTransactions = []; @@ -1532,13 +1533,13 @@ function setupHoverEvents(sunburstData) { allTransactions.push(...category.transactions); } }); - const totalData = { name: monthName, transactions: allTransactions }; + const totalData = { name: displayName, transactions: allTransactions }; currentHoveredData = totalData; detailsHeader.innerHTML = ` - ${monthName} + ${displayName}