How do I change the scale displayed in Google Maps API v3 to imperial (miles) units

Question

I\'m simply displaying a map, with no routing or directions. I can add the control with mapOptions = {...scaleControl: true,...} but I could find no documentation about cha

Answer 1

The answer by Memory Leak does not work for all cases since at some zoom levels " m" is used instead of " km", requiring a RegExp treatment (and his solution requires jQuery). I was able to get the solution by Xion Dark to work after expanding the RegExp to (m|km) and changing to innerHTML - using innerText did not work for me in Firefox (and may explain why James Bell could not get that answer to work).

My complete solution (where I've hard-wired the required map id "map_canvas")

var scaleInterval = setInterval( function() {
  var spn = document.getElementById('map_canvas').getElementsByTagName('span');
  var pattern = /\d+\s+(m|km)/i;
  for(var i in spn) {
    if ( pattern.test(spn[i].innerHTML) ) {
      spn[i].click();
      clearInterval(scaleInterval);
    }
  }
}, 500);
setTimeout( function() { clearInterval(scaleInterval) }, 20000 );

This works in Firefox 31 and Chrome 37 and IE 10. The setTimeout is included to prevent it running indefinitely, since this is sort of a kludge and might stop working should GM change their scale html - and in case the scale units someday start out with the desired ft/mi units instead of the current metric units.

Note: when first testing this with IE 10 as a white box appeared in the scale area. I first thought that was due to my code but the same occurred when I removed the code. Finally I determined it was due to "Compatability View" (an IE 7 emulator which I'd not known about as I seldom use IE) being inadvertently turned on - for which, the scale bar does not display correctly. Using IE 10 in "standard" mode, the GM scale did display correctly (and my code did work). Just wanted to warn any others without much experience of IE who might run into the same thing and get confused, as I was