Merge pull request #551 from Sammy-T/chart-text

Prevent bar chart label overlap
This commit is contained in:
Mike Cao 2021-03-17 07:21:03 -07:00 committed by GitHub
commit 6a8028ded9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -40,7 +40,7 @@ export default function BarChart({
function renderXLabel(label, index, values) { function renderXLabel(label, index, values) {
if (loading) return ''; if (loading) return '';
const d = new Date(values[index].value); const d = new Date(values[index].value);
const w = canvas.current.width; const sw = canvas.current.width / window.devicePixelRatio;
switch (unit) { switch (unit) {
case 'minute': case 'minute':
@ -48,18 +48,27 @@ export default function BarChart({
case 'hour': case 'hour':
return dateFormat(d, 'p', locale); return dateFormat(d, 'p', locale);
case 'day': case 'day':
if (records > 31) { if (records > 25) {
if (w <= 500) { if (sw <= 275) {
return index % 10 === 0 ? dateFormat(d, 'M/d', locale) : ''; return index % 10 === 0 ? dateFormat(d, 'M/d', locale) : '';
} }
return index % 5 === 0 ? dateFormat(d, 'M/d', locale) : ''; if (sw <= 550) {
return index % 5 === 0 ? dateFormat(d, 'M/d', locale) : '';
}
if (sw <= 700) {
return index % 2 === 0 ? dateFormat(d, 'M/d', locale) : '';
}
return dateFormat(d, 'MMM d', locale);
} }
if (w <= 500) { if (sw <= 375) {
return index % 2 === 0 ? dateFormat(d, 'MMM d', locale) : ''; return index % 2 === 0 ? dateFormat(d, 'MMM d', locale) : '';
} }
if (sw <= 425) {
return dateFormat(d, 'MMM d', locale);
}
return dateFormat(d, 'EEE M/d', locale); return dateFormat(d, 'EEE M/d', locale);
case 'month': case 'month':
if (w <= 660) { if (sw <= 330) {
return index % 2 === 0 ? dateFormat(d, 'MMM', locale) : ''; return index % 2 === 0 ? dateFormat(d, 'MMM', locale) : '';
} }
return dateFormat(d, 'MMM', locale); return dateFormat(d, 'MMM', locale);