I have a bar chart driven by a recordType which displays the value of each bar. What happens is that these values are being placed on top of the bar for the longest bars.
I'm surprised that Appian does not automatically adjust the color when it overlaps the text onto the bar. How do we get the text readable both overlapped and not overlapped?
One easy answer is to use a lighter bar color.... However, I am required to meet WCAG AA color contrast between the white background and the bars. This means the bars have to be a dark color.
I have found that I can adjust the Y-axis maximum value to force the bars to be shorter which keeps the labels to the right of the bar.
The challenge with this solution is that the range of possible values is theoretically infinite (practically within about 10-ish years). The only way to know what the current max value would be to query the recordType ahead of time, add some buffer value to it, set the Y max to that value. But we don't know if this will create any performance issues (recordType is synced but we have small data set in development, production data set will grow over time).
Any thoughts on handling this?
Thank you,.
Discussion posts and replies are publicly visible
Hi Steven,i played a bit with bar charts.It seems that "datalabels" are just available as black letter color.So it seems to be currently a limitation of all chart features that labels are just available with this color.Perhaps worth a ticket of the support ? with a ticket it has chance to become a feature request that if the color scheme is to dark it will be a white letter font.
ok. Thanks. Will see if a ticket gets us anywhere.
hahahahanot sure if its helpful but i found a real workaround lolit seems that the background color defines the label color
Multiple problems with this work-around.
1) Our entire UI is based on white background. Implementing this would require use to rework all other screens
2) The bar chart still does not meet WCAG AA because the contrast ratio between the blue bar and the white text is 4:09:1. We need to meet 4.5:1 contrast ratio.
3) The area chart does meet the contrast requirement between the area color and the data label color (8.91:1). However, the contrast between the area (dark blue) and the background (black) is inadequate (2.35:1 contrast).
Yeah.... meeting WCAG is hard at times.
Hello Steven,you can do a lot with appian UI, but its not the ultimative custom your own CSS/HTML totally free design fit.We, as Designer/devs, need to be aware of this and be careful not to oversell appian and its capbilities on the UI front.So this i sadly a common limitation you will face with appian. UI style guides, pixel perfect implementation etc. Good luck solving it.Perhaps creating a plugin might help?