Rank 1
Iron
Hi Team,
I've added everything to make sure charts are accessible but the issue is our data points are clickable and when we click on our data points the pivot/grid below the charts updates just like power bi charts.
I saw one document shared by kendo UI on charts accessibility:
The fundamental requirement that refers to and is fulfilled by the Kendo UI data visualization components is:
- Section 508—"(a) A text equivalent for every non-text element shall be provided (e.g., via
alt,longdesc, or in-element content)." - WCAG 2.1—"Guideline 1.1 Text Alternatives: Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language."
but this holds true when charts are not clickable.
Like this we're expecting to have focus on each data points:
Power bi is also using svg image and all data points and the x and y axis are operable through the keyboard. Please have a look.
1. Either any shortcut key so that it can navigate all the data points.
2. or Simple Navigation : Enter => and then arrow keys to navigate inside options.
Step 1: container is clickable
Step 2:
Tab to navigate in between
Enter to go inside
esc: to exit
Step 3: After pressing enter, it goes inside.
Is it possible to create something like this.. This will make charts more accessible.
For more inspiration: Miro currently make it canvas objects accessible in June release with the help of help keys + hidden messages for screen readers.
-----------
Is it possible to add custom patterns like pattern fill instead of solid fill inside the charts so that we create differentiation apart from the colors also?
Hi Akash,
Regarding the accessibility topic, I need to check this with the team. I will get back to you later.
As it comes to the texture pattern series below I will post some threads discussing this topic:
SO: https://stackoverflow.com/questions/36012520/kendo-bar-chart-with-texture-pattern
Forum: https://www.telerik.com/forums/change-line-style-from-solid-to-dashed
Regards,
Nikolay
Hi Akash,
Please accept my apologies for the delay in my reply.
First of all, I want to thank you for the feedback on the CHart accessibility topic, It is important and it has bee forwarded to the respective people.
The Team is already working on improving the Chart A11Y and Keyboard Navigation. Here are the two GitHub issues:
However, these I believe are in a private repo and so I will summarize them here.
Action plan:
- Add base support for accessibility – configuration options, events, element roles and focus management.
- Implement accessibility rendering for SVG – roles, titles, focus management. The a11y specification will be based on it.
- Experiment with accessible overlay for Canvas.
- The Canvas element supports accessible content which is typically used as a fallback for browsers that don't support it.
- The accessible content is now being repurposed to act as an accessibility overlay, accessible to screen readers.
- The overlay is not visible and does not receive pointer events.
- The overlay includes all focusable elements such as titles, legend items series points.
- The drawFocusIfNeeded method can be used to draw focus rings on the Canvas when overlay elements are focused.
This Keyboard Navigation feature aims to add keyboard support to the Chart widget. Keyboard navigation will be enabled for points of the chart series, as well as legend items. Moving focus along these points allows screen readers to access the points' accessibility attributes.
Assistive technologies treat components like the various Charts and Gauges as images. To make them accessible, add a descriptive label or an alternative representation of the data. For example, a Chart may be represented by a table that duplicates the data in an accessible form.
This is pointed out in the following documentation article: https://www.telerik.com/kendo-angular-ui-develop/components/accessibility/accessibility-compliance/#toc-special-considerations
Regards,
Thanks, Nikolay, for the response.
Does the above thing only work for bar charts and pie charts?
Our Pie chart, Gauge chart, and doughnut Chart are also interactive through the mouse. Other chart libraries like Highcharts Power BI charts are keyboard accessible.
Charts Like:
Also, what about the pattern fill support?
Hi Akash,
I need dome time to investigate and will get back to you shortly.
Regards,
Nikolay
Hi Akash,
The Keyboard Navigation for all Chart types is on its way. I am attaching a small md file where you can find detailed descriptions of different Chart types Accessibility and Keyboard support to be announced.
Regarding the series pattern fill currently not all Chart types are supporting it. There is a feature request for this and I recommend casting your vote in the below link:
Regards,
Nikolay
Thank you, Nikolay. I have voted and left a comment for the requested feature. However, I noticed that this feature has been requested since 2016 and is still unplanned. Is there an estimated timeline for when we can expect this feature and the keyboard support mentioned above to be released?
Hi Akash,
There is no timeframe for this to be implemented. Feature requests are prioritized based on their demand and business needs.
Nevertheless, I will bring up this feature to the planning meeting.
Regards,
Nikolay
Hi Akash,
The Charts Keyboard Support has been pushed with thaltest release. Here is the official demo:
Regarding the series pattern fills it is still unplanned.
Regards,
Nikolay