[英]How to add an Aria Label to a Google Maps marker?
I would like to add an aria-label on a marker object. Currently I have a function that loads all the markers and want to put an aria-label as a property of the marker.我想在标记 object 上添加一个 aria-label。目前我有一个 function 加载所有标记并希望将 aria-label 作为标记的属性。 Currently I am putting the aria label as a property when I create the marker object but I think this may be wrong.
目前我在创建标记 object 时将 aria label 作为属性,但我认为这可能是错误的。 How could I add an aria label to a marker?
如何将咏叹调 label 添加到标记?
loadLocationMarkers({ lat, lng }, idx) {
const markerIcon = this.createIcon(idx);
const markerObj = new google.maps.Marker({
icon: markerIcon,
index: idx,
selected: idx === this.selected,
map: this.map,
position: new google.maps.LatLng(lat, lng),
optimized: false,
zIndex: this.calculateZIndex(idx),
'aria-label': 'Location Marker',
});
if (markerObj.selected) {
this.selectedMarkerObj = markerObj;
}
markerObj.addListener('click', () => {
const index = markerObj.get('index');
this.dispatch(updateSelected(index), this.handleClick(markerObj));
});
return markerObj;
}
Use title
which will set the aria-label
.使用将设置
aria-label
的title
。
https://developers.google.com/maps/documentation/javascript/reference/marker#MarkerOptions.title https://developers.google.com/maps/documentation/javascript/reference/marker#MarkerOptions.title
new google.maps.Marker({
icon: markerIcon,
index: idx,
selected: idx === this.selected,
map: this.map,
position: new google.maps.LatLng(lat, lng),
optimized: false,
zIndex: this.calculateZIndex(idx),
title: 'Location Marker', // <--- added this
});
From the output of the simple-markers sample with title="Hello World!"
来自
title="Hello World!"
的简单标记示例的 output . .
<div
aria-label="Hello World!"
role="img"
tabindex="-1"
...
>
<img
...
/><map
><area
tabindex="-1"
title="Hello World!"
...
/></map>
</div>
Note :
tabindex
is-1
since there is no event listener on the marker.注意:
tabindex
为-1
,因为标记上没有事件侦听器。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.