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:
parent
fee7ba13b2
commit
d50033f834
1 changed files with 140 additions and 138 deletions
|
|
@ -258,17 +258,41 @@ window.app = Vue.createApp({
|
|||
|
||||
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 || []
|
||||
console.log('Timeline data sample:', timelineData.slice(0, 2)) // Debug first 2 records
|
||||
|
||||
console.log('Timeline data:', timelineData)
|
||||
console.log('Timeline data length:', timelineData.length)
|
||||
// If we have timeline data, use it (already grouped by day)
|
||||
if (timelineData.length > 0) {
|
||||
// Calculate running totals from daily data
|
||||
let runningSats = 0
|
||||
const labels = []
|
||||
const cumulativeSats = []
|
||||
|
||||
if (timelineData.length === 0) {
|
||||
console.log('No timeline data available, falling back to cost basis data')
|
||||
// Fallback to cost_basis_history if no timeline data
|
||||
const costBasisData = this.analyticsData.cost_basis_history || []
|
||||
if (costBasisData.length === 0) {
|
||||
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)
|
||||
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')
|
||||
// Create gradient for placeholder chart
|
||||
const placeholderGradient = ctx.createLinearGradient(0, 0, 0, 300)
|
||||
|
|
@ -336,9 +360,9 @@ window.app = Vue.createApp({
|
|||
return
|
||||
}
|
||||
|
||||
// Group cost basis data by date to avoid duplicates
|
||||
// Group cost_basis_history by date to eliminate duplicates
|
||||
const groupedData = new Map()
|
||||
costBasisData.forEach(point => {
|
||||
chartData.forEach(point => {
|
||||
const dateStr = new Date(point.date).toDateString()
|
||||
if (!groupedData.has(dateStr)) {
|
||||
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()
|
||||
)
|
||||
|
||||
const labels = chartData.map(point => {
|
||||
const labels = uniqueChartData.map(point => {
|
||||
// Handle different date formats with enhanced timezone handling
|
||||
let date;
|
||||
if (point.date) {
|
||||
|
|
@ -389,29 +413,7 @@ window.app = Vue.createApp({
|
|||
day: 'numeric'
|
||||
})
|
||||
})
|
||||
const cumulativeSats = chartData.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)
|
||||
}
|
||||
})
|
||||
const cumulativeSats = uniqueChartData.map(point => point.cumulative_sats)
|
||||
|
||||
this.createChart(labels, cumulativeSats)
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue