Zh GoogleMap Troubleshooting/ru: Difference between revisions

From Documentation
Jump to navigation Jump to search
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
__TOC__
__TOC__


== Ошибка: link.hasClass is not a function ==


[[File:Bug_-_linkHasClass.JPG]]
== Ошибка: Oops! Something went wrong ==


Смотрите: [[Zh_GoogleMap_Description/ru#CompatibilityModeAnchor|Режим совместимости]]
Если вы на странице получили сообщение об ошибке типа


[[File:Error-Oops-Key.png]]


И в консоли браузера вы видите сообщения:


== Заголовок метки слишком большой ==
Google Maps API error: MissingKeyMapError
Эта проблема вызвана стилями, определенными в Вашем шаблоне


В моем шаблоне такой проблемы нет, по этой причине я его подкорректировал чтобы воспроизвести ситуацию :)
Google Maps API warning: NoApiKeys


Это вызвано тем, что Google начал требовать ключ (Google Maps JS API Key) для новых сайтов (позднее 22 июня 2016)


[[File:Bug-H1-1.JPG]]
[https://cloud.google.com/maps-platform/pricing Узнать больше]


Для решения данной проблемы будем использовать Firebug для FireFox.  
Вы должны получить ключ и ввести его в [[Zh_GoogleMap_Description#OptionsAnchor|опциях компонента]].


Установите Firebug для Firefox, вызовите Firefox и откройте Вашу карту на сайте.<br />
== Ошибка: link.hasClass is not a function ==
Откройте всплывающее окно метки<br />
Нажмите Ctrl+Shift+C<br />
Вы увидите окно firebug со стилями<br />


Переместите мышь на заголовок метки (он подсветится). Если необходимо, повторите нажатия и выделите заголовок.
[[File:Bug_-_linkHasClass.JPG]]


[[File:Bug-H1-2-1.JPG]]
Смотрите: [[Zh_GoogleMap_Description/ru#CompatibilityModeAnchor|Режим совместимости]]


И Вы увидите все стили в списке справа.


[[File:Bug-H1-2-2.JPG]]


Найдите текущий стиль для h1
== Заголовок метки слишком большой ==
Для заголовка метки создается тег h2 или h3.


В моем случае, я получил (для моего шаблона)
Какой именно - зависит от опции, установленной в настройках компонента. Нажмите кнопку "Options" (например, в списке карт), прокрутите вниз и найдите поле '''HTML tag for InfoWin Title'''.
<pre>
 
#jsn-master.jsn-textstyle-personal.jsn-specialfont h1
Проблема большого заголовка вызвана стилями шаблона.
</pre>


Откройте CSS файл вашего шаблона и добавьте строки в конец файла для переопределения стилей.


Теперь добавим несколько строк в файл css шаблона, чтобы переопределить данный стиль
Например, изменить стили для обоих тегов


<pre>
<pre>
#jsn-master.jsn-textstyle-personal.jsn-specialfont h1.placemarkHead {
h2.placemarkHead,
  font-family: Arial, Helvetica, sans-serif;
h3.placemarkHead {
  font-size: 1.4em;
  font-size: 1.4em;
}
}
</pre>
</pre>


[[File:Bug-H1-3.JPG]]
Или определить различный размер для h2 и h3 тегов


<pre>
h2.placemarkHead {
  font-size: 1.4em;
}


Это только пример.  
h3.placemarkHead {
 
  font-size: 1em;
Как можно заметить, я добавил класс
}
<code>
</pre>
.placemarkHead
</code>
к h1
 
И заголовок метки теперь выглядит по-другому
 
[[File:Bug-H1-4.JPG]]
 


Или определить для всего класса, в данном случае это будет работать для любого значения опции


<pre>
.placemarkHead {
  font-size: 1em;
}
</pre>


== Infowin (всплывающее окно) или Zoom control (элемент масштабирования) имееют неправильную форму ==
== Infowin (всплывающее окно) или Zoom control (элемент масштабирования) имееют неправильную форму ==
Line 129: Line 128:
Когда ваша карта отображается, но вы не видите ни одного объекта на карте в консоли вашего браузера может быть ошибка, похожая на эту
Когда ваша карта отображается, но вы не видите ни одного объекта на карте в консоли вашего браузера может быть ошибка, похожая на эту


[File:JQuery is not defined.png]
[[File:JQuery_is_not_defined.png]]


Это означает, что ваш шаблон не загружает библиотеку JQuery.
Это означает, что ваш шаблон не загружает библиотеку JQuery.

Latest revision as of 12:05, 12 May 2020


Ошибка: Oops! Something went wrong

Если вы на странице получили сообщение об ошибке типа

И в консоли браузера вы видите сообщения:

Google Maps API error: MissingKeyMapError

Google Maps API warning: NoApiKeys

Это вызвано тем, что Google начал требовать ключ (Google Maps JS API Key) для новых сайтов (позднее 22 июня 2016)

Узнать больше

Вы должны получить ключ и ввести его в опциях компонента.

Ошибка: link.hasClass is not a function

Смотрите: Режим совместимости


Заголовок метки слишком большой

Для заголовка метки создается тег h2 или h3.

Какой именно - зависит от опции, установленной в настройках компонента. Нажмите кнопку "Options" (например, в списке карт), прокрутите вниз и найдите поле HTML tag for InfoWin Title.

Проблема большого заголовка вызвана стилями шаблона.

Откройте CSS файл вашего шаблона и добавьте строки в конец файла для переопределения стилей.

Например, изменить стили для обоих тегов

h2.placemarkHead, 
h3.placemarkHead {
   font-size: 1.4em;
}

Или определить различный размер для h2 и h3 тегов

h2.placemarkHead {
   font-size: 1.4em;
}

h3.placemarkHead {
   font-size: 1em;
}

Или определить для всего класса, в данном случае это будет работать для любого значения опции

.placemarkHead {
   font-size: 1em;
}

Infowin (всплывающее окно) или Zoom control (элемент масштабирования) имееют неправильную форму

Эта проблема возникает из-за стилей шаблона.

Для исправления этого необходимо откорректировать css-файл шаблона.

Если вы проанализируете стили всплывающего окна, вы увидите установленный атрибут для тего img в значение max-width: 100%


Например, вот так


img {
  border: none;
  max-width: 100%;
  height: auto;
}


Если нет никаких ограничений, просто удаляем или комментируем данную строку


img {
  border: none;
  height: auto;
}

После чего изображения для zoom control и infowin отображаются правильно

Экран регистрации при выводе карты

Когда выводится карта неожиданно появляется окно регистрации.

Смотрите: Режим совместимости для файлов ресурсов


Сообщение об ошибке OVER_QUERY_LIMIT при выводе карты

Когда вы отображаете карту, появляется сообщение об ошибке OVER_QUERY_LIMIT, при этом не отображаются все метки.

Это вызвано ограничением google на геокодироние. Т.е. вы определяете метки через текстовое значение адреса. Когда формируется карта , все указанные адреса необходимо перевести в величины широты и долготы. И для снижения нагрузки на сервис геокодирования google ограничивает количество одновременных запросов к сервису.

Для исправления данной проблемы в компоненте вам следует перейти к подробностям метки. Когда вы откроете страницу подробностей , вы увидите вашу метку на карте. Остается только слегка ее передвинуть, при этом автоматически заполнятся поля широты и долготы.

После этого отпадет необходимость в использовании сервиса геокодирования, метки будут создаваться сразу и без каких-либо ограничений. И процесс создания будет быстрее, так как не требуется время на геокодироние адреса.



Сообщение об ошибке JQuery is not defined

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

Это означает, что ваш шаблон не загружает библиотеку JQuery.

Исправить это можно

1 - проверьте, может ли шаблон загрузить данную библиотеку

2 - если шаблон не поддерживает загрузку, то вы можете:

2.1 - открыть подробности карты, открыть секцию Advanced options

2.2 - в поле Additional JavaScript files for loading добавить ссылки на JQuery

2.3 - проверить, что проблема решена

Например, по умолчанию joomla имеет библиотеку JQuery, просто попробуйте ввести эти две строчки

/media/jui/js/jquery.min.js
/media/jui/js/jquery-noconflict.js

3 - если вы используете мой шаблон для полноэкранного отображения карты, то он также не загружает эту библиотеку, но вы можете указать URL для загрузки библиотеки в свойствах шаблона (а не карты)



Language: English  • русский