Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Keyboard accessible markers with Google maps js api

As per the WCAG and section 508, all the informations on a website must be accessible using only the keyboard.

I have a google maps with some markers on it that open a modal with dedicated informations.

The problem is that Markers with google maps js API are invisible to keyboard and can't be focused using TAB key. So a keyboard user can't access the contents behind the Markers.

Is there a way around this ? I haven't found anything in the API documentation and no mention of "focus" on markers.

Any solution is welcome.

like image 869
Flunch Avatar asked Aug 24 '15 14:08

Flunch


People also ask

How do I move a marker in Google Maps API?

Just try to create the marker and set the draggable property to true . The code will be something as follows: Marker = new google.

How do I make Google Maps more accessible?

In the search bar, enter your destination. In the list of results, click the location you want. Click Options. Under "Routes," click Wheelchair accessible.


1 Answers

Instead of native Markers you may create the markers by using custom overlays.

The overlay in this case would be accessible when it is a link (or does have a tabIndex-property)

like image 138
Dr.Molle Avatar answered Oct 13 '22 00:10

Dr.Molle