Refactor cumulative sats chart logic: Implement timeline data usage for cumulative calculations, enhancing accuracy and performance. Introduce fallback mechanism to group cost basis history by date, ensuring unique entries and improved chart rendering. Add detailed chart configuration for better user interaction and visual clarity.

This commit is contained in:
padreug 2025-06-22 17:48:18 +02:00
parent fee7ba13b2
commit d50033f834

View file

@ -258,17 +258,41 @@ window.app = Vue.createApp({
const ctx = this.$refs.dcaChart.getContext('2d') const ctx = this.$refs.dcaChart.getContext('2d')
// Use accumulation_timeline data which is already aggregated by day // Use accumulation_timeline data which is already grouped by day
const timelineData = this.analyticsData.accumulation_timeline || [] const timelineData = this.analyticsData.accumulation_timeline || []
console.log('Timeline data sample:', timelineData.slice(0, 2)) // Debug first 2 records
console.log('Timeline data:', timelineData) // If we have timeline data, use it (already grouped by day)
console.log('Timeline data length:', timelineData.length) if (timelineData.length > 0) {
// Calculate running totals from daily data
let runningSats = 0
const labels = []
const cumulativeSats = []
if (timelineData.length === 0) { timelineData.forEach(point => {
console.log('No timeline data available, falling back to cost basis data') runningSats += point.sats
// Fallback to cost_basis_history if no timeline data
const costBasisData = this.analyticsData.cost_basis_history || [] const date = new Date(point.date)
if (costBasisData.length === 0) { if (!isNaN(date.getTime())) {
labels.push(date.toLocaleDateString('en-US', {
month: 'short',
day: 'numeric'
}))
cumulativeSats.push(runningSats)
}
})
this.createChart(labels, cumulativeSats)
return
}
// Fallback to cost_basis_history but group by date to avoid duplicates
console.log('No timeline data, using cost_basis_history as fallback')
const chartData = this.analyticsData.cost_basis_history || []
console.log('Chart data sample:', chartData.slice(0, 2)) // Debug first 2 records
// Handle empty data case
if (chartData.length === 0) {
console.log('No chart data available') console.log('No chart data available')
// Create gradient for placeholder chart // Create gradient for placeholder chart
const placeholderGradient = ctx.createLinearGradient(0, 0, 0, 300) const placeholderGradient = ctx.createLinearGradient(0, 0, 0, 300)
@ -336,9 +360,9 @@ window.app = Vue.createApp({
return return
} }
// Group cost basis data by date to avoid duplicates // Group cost_basis_history by date to eliminate duplicates
const groupedData = new Map() const groupedData = new Map()
costBasisData.forEach(point => { chartData.forEach(point => {
const dateStr = new Date(point.date).toDateString() const dateStr = new Date(point.date).toDateString()
if (!groupedData.has(dateStr)) { if (!groupedData.has(dateStr)) {
groupedData.set(dateStr, point) groupedData.set(dateStr, point)
@ -351,11 +375,11 @@ window.app = Vue.createApp({
} }
}) })
const chartData = Array.from(groupedData.values()).sort((a, b) => const uniqueChartData = Array.from(groupedData.values()).sort((a, b) =>
new Date(a.date).getTime() - new Date(b.date).getTime() new Date(a.date).getTime() - new Date(b.date).getTime()
) )
const labels = chartData.map(point => { const labels = uniqueChartData.map(point => {
// Handle different date formats with enhanced timezone handling // Handle different date formats with enhanced timezone handling
let date; let date;
if (point.date) { if (point.date) {
@ -389,29 +413,7 @@ window.app = Vue.createApp({
day: 'numeric' day: 'numeric'
}) })
}) })
const cumulativeSats = chartData.map(point => point.cumulative_sats) const cumulativeSats = uniqueChartData.map(point => point.cumulative_sats)
this.createChart(labels, cumulativeSats)
return
}
// Calculate running totals for timeline data
let runningSats = 0
const labels = []
const cumulativeSats = []
timelineData.forEach(point => {
runningSats += point.sats
const date = new Date(point.date)
if (!isNaN(date.getTime())) {
labels.push(date.toLocaleDateString('en-US', {
month: 'short',
day: 'numeric'
}))
cumulativeSats.push(runningSats)
}
})
this.createChart(labels, cumulativeSats) this.createChart(labels, cumulativeSats)
}, },