Stacked bar chart legend label alignment is off in Chrome

dc-js / dc.js

Multi-Dimensional charting built to work natively with crossfilter rendered with d3.js

Apache License 2.0

7.41k stars 1.81k forks source link

Stacked bar chart legend label alignment is off in Chrome #1855

Open mgd722 opened 2 years ago

mgd722 commented 2 years ago

Opening the stacked bar chart example in Chrome 96.0.4664.110 (Official Build) (arm64) on an M1 MacBook Pro, the labels in the legend are offset:

Same page opened on the same computer, but using Safari 15.1 (17612.2.9.1.20):

This must have been caused by a recent Chrome update, because I would have noticed this before in my code.

mgd722 commented 2 years ago

Same with Chrome 97.0.4692.71. Not sure when exactly this broke but I am certain that this wasn't an issue before using this same code, so it must have been something that changed within Chrome.

kum-deepak commented 2 years ago

I think it is the new Chrome. One of the automated tests started failing in Chrome recently (the automated tests pull the latest Chrome). See https://github.com/dc-js/dc.js/issues/1852. The failing test is related to legend label positioning.

congineer commented 2 years ago

If someone will fix this please expose sub-label 'x', 'y', and 'LABEL_GAP' in dc.js API because hacking around is always bad for maintainability dc js-chrome-clientHeight-bug-fix-Screenshot_20220113_152726 .