Google Maps v3 - using accented characters in marker titles

Question

I'm building a Google Maps implementation for a Swedish company, so the language has lots of uses of ä, å, and ö. I have no problems getting the special characters to display correctly (the site charset is UTF-8) except in the "title" attributes for each map marker. My code for the markers is (you can ignore everything in square brackets):

var marker = new google.maps.Marker({
    position: [coordinates],
    map: [map container div],
    icon: [icon image],
    title: "Läs mer om "+[text from JSON]  //THIS IS WHERE THE PROBLEM IS
});

When I hover over the marker on the map, the tooltip comes up as "L�s mer om...". If I change the "ä" to ä in the Javascript, the tooltip displays "Läs mer om..." instead.

The kicker is that using special characters anywhere else in the site, either directly in raw HTML or generated text placed by CMS or what-have-you works just fine. It's only in the Google Maps implementation that it's cracking.

Again, given that the site is entirely in Swedish, this could be a fairly significant issue. Any bright ideas from SO resident geniuses?

Answer 1

I had give it a try and it worked here ,

if you need to test it so fast try console.log("L\u00e4s mer om") or alert("L\u00e4s mer om") it would output "Läs mer om "

Source : http://www.ietf.org/rfc/rfc4627.txt

2.5.  Strings
   The representation of strings is similar to conventions used in the C
   family of programming languages.  A string begins and ends with
   quotation marks.  All Unicode characters may be placed within the
   quotation marks except for the characters that must be escaped:
   quotation mark, reverse solidus, and the control characters (U+0000
   through U+001F).

   Any character may be escaped.  If the character is in the Basic
   Multilingual Plane (U+0000 through U+FFFF), then it may be
   represented as a six-character sequence: a reverse solidus, followed
   by the lowercase letter u, followed by four hexadecimal digits that
   encode the character's code point.  The hexadecimal letters A though
   F can be upper or lowercase.  So, for example, a string containing
   only a single reverse solidus character may be represented as
   "\u005C".

   Alternatively, there are two-character sequence escape
   representations of some popular characters.  So, for example, a
   string containing only a single reverse solidus character may be
   represented more compactly as "\\".

   To escape an extended character that is not in the Basic Multilingual
   Plane, the character is represented as a twelve-character sequence,
   encoding the UTF-16 surrogate pair.  So, for example, a string
   containing only the G clef character (U+1D11E) may be represented as
   "\uD834\uDD1E".

explanation :

since the marker is an JS object , so it should follow the upper listed rules

{
    position: [coordinates],
    map: [map container div],
    icon: [icon image],
    title: "Läs mer om "+[text from JSON]  //THIS IS WHERE THE PROBLEM IS
}

okay then what to do ??? use <?php echo json_encode("Läs mer om "); ?> or what ever your serverside language is

and append the value to your JSON object or write it manually and Go on !!