Year template goes wrong before the date 1894-01-01
dHumanities opened this issue · 1 comments
dHumanities commented
I tried to create a heatmap with with a data source
data :{source: [{date:new Date('1893-12-01'), value:1}]}
in the following template setting
domain: {type: 'year'},
subDomain: {type:'month'}
The result on the year label will goes wrong (1893 will turn into 1892) and if the date is "1832-10-01". Then the Tooltip of that month will also goes wrong.
Here is the sample html can reproduce the problems.
<html>
<head>
<script src="https://d3js.org/d3.v7.min.js"></script>
<script src="https://unpkg.com/cal-heatmap/dist/cal-heatmap.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/cal-heatmap/dist/cal-heatmap.css">
<script src="https://unpkg.com/@popperjs/core@2"></script>
<script src="https://unpkg.com/cal-heatmap/dist/plugins/Tooltip.min.js"></script>
</head>
<body>
<div id="cal-heatmap"></div>
<script>
const data = [{date: new Date('1832-10-01'),value:10}
// ,{date: new Date('1893-04-01'),count:10},{date: new Date('1893-12-01'),count:10},{date: new Date('1894-01-01'),count:1}
];
const cal = new CalHeatmap();
cal.paint({
locale: 'en',
animationDuration: 0,
itemSelector: `#cal-heatmap`,
range: 12,
date: {start: new Date('1832-10-01'),
min: new Date('1832-10-01'),
max: new Date('1894-04-01') },
domain: { type: 'year' },
subDomain: { type: 'month', label: '', width: 7, height: 45, radius:10 },
scale: { color: { type: 'linear', scheme: 'Reds', domain: [0, 50] } },
data: {
source: data,
x: 'date',
y: 'value',
defaultValue: null,
groupY: 'sum'
}
}, [[Tooltip, {text: (timestamp, value, dayjsDate) => `${value || 0} - ${dayjs(timestamp).format('YYYY-MM')}`}]])
</script>
</body>
</html>
wa0x6e commented
Very weird behavior indeed, may be due to timezone and dst not available for date with negative timestamp.
Will investigate