Как я могу изменить язык Google Maps на ходу?

Question

Я не хочу менять геокодирование и получать адрес на двух языках - арабском и английском, поэтому я хочу получить его на одном языке, затем изменить язык API и получить адрес на другом языке, поскольку я не могунайти параметр для отправки в геокодер для определения языка.Есть предложения?

Answer 1

Язык можно выбрать при загрузке API, добавив language=XX к URL-адресу API, где XX - это двухсимвольный код языка (en для английского, ar для арабского и т. Д.) В URL в вызове API. См. http://code.google.com/apis/maps/documentation/javascript/basics.html#Localization для документации.

Это не позволит вам изменить это на лету, и я не думаю, что вы можете сделать это. Вы можете попробовать загрузить API второй раз после получения необходимой информации на одном языке. Но это, похоже, может вызвать проблемы.

Более чистый способ сделать это - создать отдельную страницу, которая будет для вас своего рода веб-службой. Он принимает два параметра: код языка и адрес. Он загружает API, используя запрашиваемый код языка, и геокодирует адрес в обратном порядке, предоставляя результат. Ваша страница будет вызывать эту вещь, похожую на веб-сервис, дважды, один раз для каждого языка, а затем использовать результаты по желанию.

Answer 2

Я создал функцию для изменения языка Карт Google на ходу.
Так как он возвращает Promise, вы можете легко дождаться загрузки API для выполнения какого-либо другого кода.

Демо

---

Пример использования

setAPILanguage('fr', ['places'], 'xxxxxx').then(() => {
    //The API is loaded here
});

---

Документация

/**
 * Changes the language of the Google Maps API
 * @param {String}   lang      - Google Maps new language
 * @param {String[]} libraries - The list of libraries needed
 * @param {String}   key       - Your API key
 * @returns {Promise}          - Resolves when Google Maps API has finished loading
 */

---

Источник

const setAPILanguage = (lang, libraries, key) => {
  //Destroy old API
  document.querySelectorAll('script[src^="https://maps.googleapis.com"]').forEach(script => {
    script.remove();
  });
  if(google) delete google.maps;

  //Generate new Google Maps API script
  let newAPI = document.createElement('script');
  newAPI.src = 'https://maps.googleapis.com/maps/api/js?libraries=' + libraries.join(',') + '&key=' + key + '&language=' + lang + '&callback=googleMapsAPILoaded';

  //Callback for the Google Maps API src
  window.googleMapsAPILoaded = () => {
    let event = new CustomEvent('googleMapsAPILoaded');
    window.dispatchEvent(event);
  }

  //Wait for the callback to be executed
  let apiLoaded = new Promise(resolve => {
    window.addEventListener('googleMapsAPILoaded', () => {
      resolve();
    });
  });

  //Start the script
  document.querySelector('head').appendChild(newAPI);

  return apiLoaded;
}

---

Демо

Answer 3

Как уже указывалось, это нельзя изменить после загрузки карты, но для тех, кто может позволить себе обновление страницы, это может сработать:

HTML

<script type="text/javascript">
    //load map based on current lang
    var scriptTag = document.createElement('script');

    var currentLang = window.localStorage && window.localStorage.getItem('language');
    var scriptSrc = '//maps.googleapis.com/maps/api/js?libraries=drawing,places&key=YOUR_KEY_HERE';
    if (currentLang)
        scriptSrc = '//maps.googleapis.com/maps/api/js?language=' + currentLang + '&libraries=drawing,places&key=YOUR_KEY_HERE';

    scriptTag.setAttribute('src', scriptSrc);
    scriptTag.setAttribute('async', '');
    document.head.appendChild(scriptTag);
</script>

JS

function changeLangAndReload(lang) {
    window.localStorage.setItem('language', lang);
    window.location.reload();//or use your preferred way to refresh 
}

Answer 4

В следующем примере отображается карта на японском языке и устанавливается регион Японии:

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&language=ja&region=JP">
</script>

Источник