diff --git a/src/components/GlacierScanViz.vue b/src/components/GlacierScanViz.vue index 0605f06ca3fd6312ec7d2f23646e464d419e1862..9933bc87191886633bb932d71621d9d0811529e8 100644 --- a/src/components/GlacierScanViz.vue +++ b/src/components/GlacierScanViz.vue @@ -101,9 +101,9 @@ .attr("width", "100%") .attr("height", "100%"); + // assign aria-label for accessibility crossSectionSVG - .append("title") - .text("A shaded-relief map of the Juneau Ice Field, with markers indicating the location of ice cores and field photos. Beneath the map is a cross-section of the icefield, showing how the ice field covers the terrain. In places, the ice field is close to a kilometer thick."); + .attr("aria-label", "A shaded-relief map of the Juneau Ice Field, with markers indicating the location of ice cores and field photos. Beneath the map is a cross-section of the icefield, showing how the ice field covers the terrain. In places, the ice field is close to a kilometer thick."); // hide some components from view and from screen reader crossSectionSVG.select("#tutorial-dt-1") diff --git a/src/components/RegionalFiresViz.vue b/src/components/RegionalFiresViz.vue index 5824c1e237c70d56a3e2d15d879f2fb3ce56ba7f..ce033cdb148c7a44f2da3018b524354b0ae47a93 100644 --- a/src/components/RegionalFiresViz.vue +++ b/src/components/RegionalFiresViz.vue @@ -62,9 +62,9 @@ const aerosolsSVG = d3.select("#aerosols-grid-container").select("svg") .attr("id", "aerosols-svg") + // assign aria-label for accessibility aerosolsSVG - .append("title") - .text("A shaded-relief map of southeastern Alaska, showing the location of the Juneau Icefield. The map also shows the location of the 2015 Dennison Fork wildfire and the 2016 Steamboat Creek wildfire, both northwest of the icefield. Transparent grey lines branching out from each wildfire location show modeled paths of smoke transport from these fires. Some of the potential smoke paths pass over the Juneau Icefield, suggesting that aerosols from these fires may have been deposited on the icefield."); + .attr("aria-label", "A shaded-relief map of southeastern Alaska, showing the location of the Juneau Icefield. The map also shows the location of the 2015 Dennison Fork wildfire and the 2016 Steamboat Creek wildfire, both northwest of the icefield. Transparent grey lines branching out from each wildfire location show modeled paths of smoke transport from these fires. Some of the potential smoke paths pass over the Juneau Icefield, suggesting that aerosols from these fires may have been deposited on the icefield."); // add interactivity addInteractions(); diff --git a/src/components/WildfireAerosolsViz.vue b/src/components/WildfireAerosolsViz.vue index 4ae464c855aa2b6dc3e36469ffea87e6afdcf834..061a30dbb011185e6ebc9e308d7eabda7d287b5c 100644 --- a/src/components/WildfireAerosolsViz.vue +++ b/src/components/WildfireAerosolsViz.vue @@ -70,8 +70,7 @@ const nIndices = 4; const chart = ref(null); let chartSVG; - const chartTitle = 'Series of vertical charts representing a snow core.'; - const chartDesc = 'The charts depict particulate counts and the presence of wildfire biomarkers in layers of a 780-centimeter snow core. Markers of softwood and hardwood combustion are present throughout the core.' + const chartTitle = 'Series of vertical charts representing a snow core. The charts depict particulate counts and the presence of wildfire biomarkers in layers of a 780-centimeter snow core. Markers of softwood and hardwood combustion are present throughout the core.' let chartHeight; let chartWidth; let chartDimensions; @@ -292,17 +291,9 @@ .attr("height", "100%") .attr("id", "wrapper"); - // assign role for accessibility - chartSVG.attr("role", "img") - .attr("aria-labelledby", "chart-title chart-desc") - - chartSVG.append("title") - .attr("id", "chart-title") - .text(chartTitle) - - chartSVG.append("desc") - .attr("id", "chart-desc") - .text(chartDesc); + // assign aria-label for accessibility + chartSVG + .attr("aria-label", chartTitle) // Add group for bounds chartBounds = chartSVG.append("g")