Commit 7ca26be0 authored by Elijah Byrd's avatar Elijah Byrd
Browse files

Styling updates to readme.

parent 28cb4494
Pipeline #15980 skipped
Accessible Google Maps shim
# Accessible Google Maps shim
WIP collaboration to make a keyboard- and screen reader-accessible shim for the Google Maps API.
To implement:
1. Load accessible_gmaps.js and accessible_gmaps.css into any page containing a Google map. jQuery is also (currently) required.
2. When creating markers or adding new markers to the map, call accessibility_addMarker(marker), where marker is the marker object.
Each marker object should have a title attribute attached. This string is used by base gMaps to provide title text for markers, and is used by the accessibility shim to provide information about the marker to screen readers.
3. After your map is loaded and has bounds (usually just before you'd display it to the user), call accessible_gmaps_onload(map, mapIdentifier, options) with these parameters:
map: the map object (created with new google.maps.Map())
mapIdentifier: a CSS identifier unique to your map, used by jQuery to add the shim elements.
options: an array of settings for the shim. Current options are:
infowindows: if set to TRUE, will create keyboard-accessible infowindows attached to map markers. This option expects each marker object to have a windowContent property, which contains an HTML string to use as the infowindow content (minus the window header, which is automatically generated from the marker's title attribute).
\ No newline at end of file
## Requirements
The shim currently requires jQuery (referenced as 'jQuery,' most versions should work fine). You can probably modify pretty easily to work with your library of choice.
## Installation
To add the shim to your project:
1. Load accessible_gmaps.js and accessible_gmaps.css into any page containing a Google map. Remember that jQuery is also required.
2. When creating markers or adding new markers to the map, call accessible_gmaps_addMarker(marker), where marker is the gMaps marker object.
*Each marker object should have a title attribute attached. This string is used by base gMaps to provide title text for markers, and is used by the accessibility shim to provide information about the marker to screen readers.*
3. After your map is loaded and has bounds (usually just before you'd display it to the user), call accessible_gmaps_onload(map, mapIdentifier, options) with these parameters:
+ **map:** the map object (created with new google.maps.Map())
+ **mapIdentifier:** a CSS identifier unique to your map, used by jQuery to add the shim elements.
+ **options:** an array of settings for the shim. Current options are:
**infowindows:** if set to TRUE, will create keyboard-accessible infowindows attached to map markers.
*This option expects each marker object to have a windowContent property, which contains an HTML string to use as the infowindow content (minus the window header, which is automatically generated from the marker's title attribute).*
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment