realaravinth/bench-forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix heatmap first color being unused (#22157)

Browse source 
vue3-calendar-heatmap has the behaviour that the first and second colors
are mapped to values null and 0, meaning the second color was not used
as intended for values > 0. I think this is a behaviour change from
previous vue2 version that was missed during the upgrade.

This change makes first and second values the same, so the heatmap can
now use one additional color for meaningful values.

Before:
<img width="710" alt="Screenshot 2022-12-18 at 09 17 58"
src="https://user-images.githubusercontent.com/115237/208288347-df4973af-8ebd-4582-b828-bec948ffdf60.png">

After:
<img width="709" alt="Screenshot 2022-12-18 at 09 18 15"
src="https://user-images.githubusercontent.com/115237/208288350-e0b85aa2-6925-4a37-83d2-89e2518c91ce.png">

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
silverwind 2022-12-19 22:14:49 +01:00 committed by GitHub
parent d6b96627c1
commit 2774671584
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
web_src/js/components/ActivityHeatmap.vue
View file

@ -32,6 +32,7 @@ export default {
}, },
data: () => ({ data: () => ({
colorRange: [ colorRange: [
'var(--color-secondary-alpha-70)',
'var(--color-secondary-alpha-70)', 'var(--color-secondary-alpha-70)',
'var(--color-primary-light-4)', 'var(--color-primary-light-4)',
'var(--color-primary-light-2)', 'var(--color-primary-light-2)',
@ -50,6 +51,12 @@ export default {
return s; return s;
} }
}, },
mounted() {
// work around issue with first legend color being rendered twice and legend cut off
const legend = document.querySelector('.vch__external-legend-wrapper');
legend.setAttribute('viewBox', '12 0 80 10');
legend.style.marginRight = '-12px';
},
methods: { methods: {
handleDayClick(e) { handleDayClick(e) {
// Reset filter if same date is clicked // Reset filter if same date is clicked