AnnotationsA11y.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  1. /* *
  2. *
  3. * (c) 2009-2021 Øystein Moseng
  4. *
  5. * Annotations accessibility code.
  6. *
  7. * License: www.highcharts.com/license
  8. *
  9. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  10. *
  11. * */
  12. 'use strict';
  13. import HTMLUtilities from '../Utils/HTMLUtilities.js';
  14. var escapeStringForHTML = HTMLUtilities.escapeStringForHTML, stripHTMLTagsFromString = HTMLUtilities.stripHTMLTagsFromString;
  15. /**
  16. * Get list of all annotation labels in the chart.
  17. *
  18. * @private
  19. * @param {Highcharts.Chart} chart The chart to get annotation info on.
  20. * @return {Array<object>} The labels, or empty array if none.
  21. */
  22. function getChartAnnotationLabels(chart) {
  23. var annotations = chart.annotations || [];
  24. return annotations.reduce(function (acc, cur) {
  25. if (cur.options &&
  26. cur.options.visible !== false) {
  27. acc = acc.concat(cur.labels);
  28. }
  29. return acc;
  30. }, []);
  31. }
  32. /**
  33. * Get the text of an annotation label.
  34. *
  35. * @private
  36. * @param {object} label The annotation label object
  37. * @return {string} The text in the label.
  38. */
  39. function getLabelText(label) {
  40. return ((label.options &&
  41. label.options.accessibility &&
  42. label.options.accessibility.description) ||
  43. (label.graphic &&
  44. label.graphic.text &&
  45. label.graphic.text.textStr) ||
  46. '');
  47. }
  48. /**
  49. * Describe an annotation label.
  50. *
  51. * @private
  52. * @param {object} label The annotation label object to describe
  53. * @return {string} The description for the label.
  54. */
  55. function getAnnotationLabelDescription(label) {
  56. var a11yDesc = (label.options &&
  57. label.options.accessibility &&
  58. label.options.accessibility.description);
  59. if (a11yDesc) {
  60. return a11yDesc;
  61. }
  62. var chart = label.chart;
  63. var labelText = getLabelText(label);
  64. var points = label.points;
  65. var getAriaLabel = function (point) { return (point.graphic &&
  66. point.graphic.element &&
  67. point.graphic.element.getAttribute('aria-label') ||
  68. ''); };
  69. var getValueDesc = function (point) {
  70. var valDesc = (point.accessibility &&
  71. point.accessibility.valueDescription ||
  72. getAriaLabel(point));
  73. var seriesName = (point &&
  74. point.series.name ||
  75. '');
  76. return (seriesName ? seriesName + ', ' : '') + 'data point ' + valDesc;
  77. };
  78. var pointValueDescriptions = points
  79. .filter(function (p) { return !!p.graphic; }) // Filter out mock points
  80. .map(getValueDesc)
  81. .filter(function (desc) { return !!desc; }); // Filter out points we can't describe
  82. var numPoints = pointValueDescriptions.length;
  83. var pointsSelector = numPoints > 1 ? 'MultiplePoints' : numPoints ? 'SinglePoint' : 'NoPoints';
  84. var langFormatStr = 'accessibility.screenReaderSection.annotations.description' + pointsSelector;
  85. var context = {
  86. annotationText: labelText,
  87. annotation: label,
  88. numPoints: numPoints,
  89. annotationPoint: pointValueDescriptions[0],
  90. additionalAnnotationPoints: pointValueDescriptions.slice(1)
  91. };
  92. return chart.langFormat(langFormatStr, context);
  93. }
  94. /**
  95. * Return array of HTML strings for each annotation label in the chart.
  96. *
  97. * @private
  98. * @param {Highcharts.Chart} chart The chart to get annotation info on.
  99. * @return {Array<string>} Array of strings with HTML content for each annotation label.
  100. */
  101. function getAnnotationListItems(chart) {
  102. var labels = getChartAnnotationLabels(chart);
  103. return labels.map(function (label) {
  104. var desc = escapeStringForHTML(stripHTMLTagsFromString(getAnnotationLabelDescription(label)));
  105. return desc ? "<li>" + desc + "</li>" : '';
  106. });
  107. }
  108. /**
  109. * Return the annotation info for a chart as string.
  110. *
  111. * @private
  112. * @param {Highcharts.Chart} chart The chart to get annotation info on.
  113. * @return {string} String with HTML content or empty string if no annotations.
  114. */
  115. function getAnnotationsInfoHTML(chart) {
  116. var annotations = chart.annotations;
  117. if (!(annotations && annotations.length)) {
  118. return '';
  119. }
  120. var annotationItems = getAnnotationListItems(chart);
  121. return "<ul style=\"list-style-type: none\">" + annotationItems.join(' ') + "</ul>";
  122. }
  123. /**
  124. * Return the texts for the annotation(s) connected to a point, or empty array
  125. * if none.
  126. *
  127. * @private
  128. * @param {Highcharts.Point} point The data point to get the annotation info from.
  129. * @return {Array<string>} Annotation texts
  130. */
  131. function getPointAnnotationTexts(point) {
  132. var labels = getChartAnnotationLabels(point.series.chart);
  133. var pointLabels = labels
  134. .filter(function (label) { return label.points.indexOf(point) > -1; });
  135. if (!pointLabels.length) {
  136. return [];
  137. }
  138. return pointLabels.map(function (label) { return "" + getLabelText(label); });
  139. }
  140. var AnnotationsA11y = {
  141. getAnnotationsInfoHTML: getAnnotationsInfoHTML,
  142. getAnnotationLabelDescription: getAnnotationLabelDescription,
  143. getAnnotationListItems: getAnnotationListItems,
  144. getPointAnnotationTexts: getPointAnnotationTexts
  145. };
  146. export default AnnotationsA11y;