Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
121 lines (110 sloc) 5.78 KB
<!DOCTYPE html>
<html>
<head>
<title>Map Localization - Azure Maps Web SDK Samples</title>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="IE=Edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="This sample lets you switch the map between all its supported languages." />
<meta name="keywords" content="map, gis, API, SDK, language, culture, localization, user region" />
<meta name="author" content="Microsoft Azure Maps" />
<!-- Add references to the Azure Maps Map control JavaScript and CSS files. -->
<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.css" type="text/css" />
<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.js"></script>
<script type='text/javascript'>
var map;
function GetMap() {
//Initialize a map instance.
map = new atlas.Map('myMap', {
center: [20, 50],
zoom: 4,
//Set the language of the map.
language: 'en-US',
//Set the regional view of the map.
view: 'Auto',
//Add your Azure Maps subscription key to the map SDK. Get an Azure Maps key at https://azure.com/maps
authOptions: {
authType: 'subscriptionKey',
subscriptionKey: '<Your Azure Maps Key>'
}
});
}
function updateLanguage() {
var langOptions = document.getElementById('langOptions');
var lang = langOptions.options[langOptions.selectedIndex].value;
//Update the language of the map instance.
map.setStyle({
language: lang
});
}
</script>
</head>
<body onload="GetMap()">
<div id="myMap" style="position:relative;width:100%;min-width:290px;height:600px;"></div>
<div style="clear:both;padding-top:10px;">
Language:
<select id="langOptions" onchange="updateLanguage()">
<option value="NGT">Neutral Ground Truth (NGT)</option>
<option value="NGT-Latn">Neutral Ground Truth - Latin exonyms (NGT-Latn)</option>
<option value="ar">Arabic (ar)</option>
<option value="bg">Bulgarian (bg)</option>
<option value="bg-BG">Bulgarian (Bulgaria) (bg-BG)</option>
<option value="ca-ES">Catalan (Spain) (ca-ES)</option>
<option value="cs">Czech (cs)</option>
<option value="cs-CZ">Czech (Czech Republic) (cs-CZ)</option>
<option value="da">Danish (da)</option>
<option value="da-DK">Danish (Denmark) (da-DK)</option>
<option value="nl">Dutch (Netherlands) (nl)</option>
<option value="nl-NL">Dutch (Netherlands) (nl-NL)</option>
<option value="en">English (en)</option>
<option value="en-AU">English (Australia) (en-AU)</option>
<option value="en-CA">English (Canada) (en-CA)</option>
<option value="en-GB">English (United Kingdom) (en-GB)</option>
<option value="en-NZ">English (New Zealand) (en-NZ)</option>
<option value="en-US" selected="selected">English (United States) (en-US)</option>
<option value="fi">Finnish (fi)</option>
<option value="fi-FI">Finnish (Finland) (fi-FI)</option>
<option value="fr">French (fr)</option>
<option value="fr-FR">French (France) (fr-FR)</option>
<option value="de">German (de)</option>
<option value="de-DE">German (Germany) (de-DE)</option>
<option value="el">Greek (el)</option>
<option value="el-GR">Greek (el-GR)</option>
<option value="hu">Hungarian (hu)</option>
<option value="hu-HU">Hungarian (hu-HU)</option>
<option value="id">Indonesian (id)</option>
<option value="id-ID">Indonesian (id-ID)</option>
<option value="it">Italian (it)</option>
<option value="it-IT">Italian (it-IT)</option>
<option value="lt">Lithuanian (lt)</option>
<option value="lt-LT">Lithuanian (lt-LT)</option>
<option value="ms-MY">Malay (ms-MY)</option>
<option value="nb-NO">Norwegian, Bokmal (Norway) (nb-NO)</option>
<option value="pl">Polish (pl)</option>
<option value="pl-PL">Polish (Poland) (pl-PL)</option>
<option value="pt">Portuguese (Brazil) (pt)</option>
<option value="pt-BR">Portuguese (Brazil) (pt-BR)</option>
<option value="pt-PT">Portuguese (Portugal) (pt-PT)</option>
<option value="ru">Russian (ru)</option>
<option value="ru-RU">Russian (Russia) (ru-RU)</option>
<option value="sk">Slovak (sk)</option>
<option value="sk-SK">Slovak (Slovakia) (sk-SK)</option>
<option value="sl">Slovenian (sl)</option>
<option value="sl-SI">Slovenian (sl-SI)</option>
<option value="es">Spanish (es)</option>
<option value="es-ES">Spanish (Spain) (es-ES)</option>
<option value="es-MX">Spanish (Mexico) (es-MX)</option>
<option value="sv">Swedish (sv)</option>
<option value="sv-SE">Swedish (sv-SE)</option>
<option value="th">Thai (th)</option>
<option value="th-TH">Thai - Thailand (th-TH)</option>
<option value="tr">Turkish (tr)</option>
<option value="tr-TR">Turkish (tr-TR)</option>
</select>
</div>
<fieldset style="width:calc(100% - 30px);min-width:290px;margin-top:10px;">
<legend>Map Localization</legend>
This sample lets you switch the map between all its supported languages.
</fieldset>
</body>
</html>
You can’t perform that action at this time.