创建一个屏幕阅读器可访问的画布图形描述。
gridOutput()
在网页中添加概括性描述、图形列表以及图形表格。概括性描述包含画布尺寸、画布颜色和图形数量。例如:gray canvas, 100 by 100 pixels, contains 2 shapes: 1 circle 1 square
。
gridOutput()
将图形表格用作网格。网格中的每个图形都放在一个单元格中,该单元格的行和列就是图形在画布上的位置。网格单元格描述了该位置的颜色和图形类型。例如:red circle
,选中这些描述可以获取更多详细信息。这不同于 textOutput(),它是将图形表用作列表。
然后是图形列表,它描述了图形的颜色、类型、位置和面积。例如:red circle, location = middle, area = 3 %
。
display
参数是可选项,它决定了描述的展示方式。如果它的值是 LABEL
,例如:gridOutput(LABEL)
描述将会展示在画布旁边的 div 元素中。 LABEL
并没有实际用处,它只是屏幕阅读器中的重复项。仅在开发环境中使用 LABEL
。如果是 FALLBACK
,例如:gridOutput(FALLBACK)
,描述仅对屏幕阅读器可见,这是默认模式。
了解更多关于制作无障碍绘图的信息,请参阅 编写无障碍的画布描述。
示例
语法
gridOutput([display])
参数
FALLBACK 或 LABEL
相关参考
cursor
改变光标样式。 第一个参数,type,设置要显示的光标类型。内置选项有: ARROW、CROSS、 HAND、MOVE、TEXT和 WAIT。 "cursor() 也可以识别以字符串形式传递的标准 CSS 光标属性: 'help','wait','crosshair'," "'not-allowed','zoom-in' 和 'grab'。" 如果传递的是图像路径,例如: "cursor('/assets/target.png'),那么光标将以图像的形式展现出来。" 图像格式必须是 .cur、.gif、.jpg、.jpeg 或 .png,要以这样的形式传递: ,最高像素为 32x32。 参数 x 和 y 都是可选项。如果用图像作光标,x 和 y 用来设置图像中指向的位置。 它们初始值都是 0,此时光标指向图像左上角。并且 x 和 y 的值必须分别小于图像的宽高。.
deltaTime
Number 变量用来记录绘制上一帧所需的毫秒数。 deltaTime 包含了在上一帧中执行 draw() 函数所需的时间。这对于物理模拟非常有用。.
describe
创建屏幕阅读器可访问的画布描述。 第一个参数,text,是对画布的描述。 "第二个参数,display 是可选项,它决定了画布描述的展示方式。如果它的值是 LABEL,例如:describe('A description.', LABEL),描述将会展示在画布旁边的 div 元素中。如果是 FALLBACK,例如:describe('A description.', FALLBACK),描述仅对屏幕阅读器可见,这是默认模式。" 了解更多关于制作无障碍绘图的信息,请参阅 编写无障碍的画布描述。 .
describeElement
在画布中创建屏幕阅读器可访问的元素描述。 元素是有实际意义的图形或图形组合。 例如,几个重叠的圆可以构成“眼睛”这个元素。 第一个参数,name,是元素的名称。 第二个参数,text,是对元素的描述。 "第三个参数,display,是可选项。它决定了描述的展示方式。如果它的值是 LABEL,例如:describe('A description.', LABEL),描述将会展示在画布旁边的 div 元素中。使用 LABEL 并没有实际用处,它只是屏幕阅读器中的重复项。仅在开发环境中使用 LABEL。如果是 FALLBACK,例如:describe('A description.'," FALLBACK),描述仅对屏幕阅读器可见,这是默认模式。 了解更多关于制作无障碍绘图的信息,请参阅 编写无障碍的画布描述。 .