Главное меню
Мы солидарны с Украиной. Узнайте здесь, как можно поддержать Украину.

Что значит "The Google Maps API server rejected your request. The pr..."?

Автор zwh, августа 16, 2017, 15:49

0 Пользователи и 1 гость просматривают эту тему.

zwh

Есть несложный сайт (на php) на московском хостинге, все страницы показываются нормально. А вот на телефоне (на Андроиде) на одной из страничек вылазит сабж. Причем до конца я прочесть его не могу, т.к. экран моего телефона больше не показывает. Что это может значить и как с этим бороться?

Bhudh

Погуглил. Увидев результаты, вспомнил историю об одном программисте, который настроил при возникновении ошибки автоматически открывать поиск StackOverflow с её текстом в качастве запроса.
Первые 2 результата:
https://stackoverflow.com/questions/19408066/the-google-maps-api-server-rejected-your-request
https://stackoverflow.com/questions/21934342/what-causes-the-google-maps-api-server-rejected-your-request-an-internal-error
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

zwh

Короче, разобрался. Поглядел на код внимательнее -- там стоит ссылка на Гугл-карту, которая почему-то не работает, и на дексктопе даже никакого сообщения об этом не вылазит, а только вот Андроид матерится. Ладно, сейчас попытаюсь туда Яндекс-карту вставить.

Bhudh

По второй ссылке пишут, что может слишком часто стучать запросами в гугл (>50 per minute).
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо



zwh

Сделал карту Яндекс, но ее при выводе на экран почему-то уносит вниз :(

Bhudh

Положение откуда отсчитывается? В абсолютных координатах или относительных?
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

zwh


Bhudh

И относительно чего?
У Вас вообще какая идея, чтобы при клике куда-то показывалась карта или просто разворачивалась?
Если первое: надо делать модальный слой, если второе: после раскрытия прокручивать к карте.
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

zwh

Цитата: Bhudh от августа 22, 2017, 21:37
И относительно чего?
У Вас вообще какая идея, чтобы при клике куда-то показывалась карта или просто разворачивалась?
Если первое: надо делать модальный слой, если второе: после раскрытия прокручивать к карте.
Вот два варианта, оба плохие:
http://tsvetkoff.ru/contacts.php
http://tsvetkoff.ru/contacts.html

из css:
Цитировать
.map{
    position: relative;
    padding-top: 10px;
    margin-bottom: 70px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-transition: height 0.6s ease-in-out;
    -moz-transition: height 0.6s ease-in-out;
    -ms-transition: height 0.6s ease-in-out;
    -o-transition: height 0.6s ease-in-out;
    transition: height 0.6s ease-in-out;
    z-index: 1;
}

Bhudh

А чем плох второй? У меня не уносит.

А в первом варианте это из-за
Цитировать.page {
    height: 100%;
    left: 0px;
    min-height: 730px;
    position: relative;
    top: 0px;
    width: 100%;
}
Первый блок растягивается на всю высоту экрана, а карта лежит под ним.

Во втором варианте внутри //div.page, чего ещё надо-то?

P. S. В html-варианте ещё и фавикон пропал.
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

zwh

Да, в первом варианте проблема, видимо, в слишком рано стоящем закрывающем div'е для page... Причем, если я его ставлю (уже попробовал и откатил обратно), то вид на экране начинает совпадать со вторым вариантом. В о втором же варианте не устраивает то, что карта показана не полностью, и сделать, чтоб полностью, у меня не получается :(

Bhudh

ОМГ, да через тот же CSS и сделать.
Цитировать.map {
    height: 505px; /* Высота корневого элемента <ymaps> */
}

Глупо как-то присваивать классы и ими не пользоваться.
Причём если карта на странице одна, можно заменить class="block map" на id="map" и .map на #map.
Да, и уберите, ради бога, <center> из кода, в 2017 это совсем не комильфо, он уже практически deprecated.

Цитата: Окончательный вариант#map {
    height: 505px; /* Высота корневого элемента <ymaps> */
    text-align: center; /* Центрирование содержимого в стиле CSS2 */
    padding-left: 25%; /* Если предыдущее правило не сработает. С процентажем можно поиграть. */
}
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

zwh

Тэг "center" я там ставил не от хорошей жизни, а потому. что "text-align: center;" не работал. Как не работает и сейчас. Теперь рабочий вариант -- это http://tsvetkoff.ru/contacts.php. Видно, что стиль "height: 505px;"  подтянул вверх футер, но ничуть не увеличил площадь отображения карты. Стиль map сейчас такой:
Цитировать
.map{
    position: relative;
    padding-top: 10px;
    margin-bottom: 70px;
    width: 100%;
    height: 505px;
    text-align: center;
    overflow: hidden;
    -webkit-transition: height 0.6s ease-in-out;
    -moz-transition: height 0.6s ease-in-out;
    -ms-transition: height 0.6s ease-in-out;
    -o-transition: height 0.6s ease-in-out;
    transition: height 0.6s ease-in-out;
    z-index: 1;
}

ЗЫ "padding-left: 25%;" в принципе работает, на надо ведь, чтобы страница имела разумный вид в т.ч. на планшетах и смартфонах.

Bhudh

Поищите в CSS-файле упоминания .map :eat:.
А лучше просто откройте инспектор кода в браузере (Ctrl+Shift+I) и загляните в рассчитанные стили.
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

Bhudh

Значит, так. Лёхкый гуглинг по фразе "отцентрировать яндекс-карту" дал простое решение:
Цитата: .map {
    margin: 0 auto;
    /* можно и проще — margin: auto;*/
}
Если просто это поставить, карта центрироваться не будет :green:.
Почему? Потому, что центрируются только инлайн-элементы.
А карте прямо в атрибуте приписан display: block.
Следовательно, второй шаг: это выставление правильного вида карте:
Цитата: .map > ymaps {
    display: inline-block !important;
}

После этого (и удаления перекрывающего правила ниже по стилям) всё видно целиком, полностью и как надо.
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

zwh

Вот что сейчас написано в CSS:
Цитировать
.map{
    position: relative;
    padding-top: 10px;
    width: 100%;
    height: 100%;
    text-align: center;
    margin: 0 auto;
    display: inline-block !important;
    overflow: hidden;
    -webkit-transition: height 0.6s ease-in-out;
    -moz-transition: height 0.6s ease-in-out;
    -ms-transition: height 0.6s ease-in-out;
    -o-transition: height 0.6s ease-in-out;
    transition: height 0.6s ease-in-out;
    z-index: 1;
}

Внешний вид страницы, как можно заметить, не изменился.

Bhudh

Цитата: zwh от августа 23, 2017, 13:26
Вот что сейчас написано в CSS

Я не зря советовал ПОИСКАТЬ ВХОЖДЕНИЯ .map в файле.

Цитата: Вот что сейчас написано в CSS.map{
    position: relative;
    padding-top: 10px;
    width: 100%;
    height: 100%;
    text-align: center;
    margin: 0 auto;
    display: inline-block !important;
    overflow: hidden;
    -webkit-transition: height 0.6s ease-in-out;
    -moz-transition: height 0.6s ease-in-out;
    -ms-transition: height 0.6s ease-in-out;
    -o-transition: height 0.6s ease-in-out;
    transition: height 0.6s ease-in-out;
    z-index: 1;
}
.map iframe{
    width: 100%;
    height: 100%;
}
.map .psevdo{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.contacts-block{
    position: relative;
    display: none;
    overflow: hidden;
    background-color: white;
    line-height: 1.5;
    box-shadow: 0 4px 15px -2px rgba(0,0,0,0.3);
    -webkit-transition: opacity 0.6s ease-in-out;
    -moz-transition: opacity 0.6s ease-in-out;
    -ms-transition: opacity 0.6s ease-in-out;
    -o-transition: opacity 0.6s ease-in-out;
    transition: opacity 0.6s ease-in-out;
    z-index: 2;
}
.contacts-block > div{
    position: relative;
    padding: 20px;
    width: 100%;
    font-size: 0;
    background-color: white;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 2;
}
.contacts-block:before{
    position: absolute;
    display: block;
    content: '';
    top: 50%;
    margin-top: -14px;
    right: -15px;
    width: 28px;
    height: 28px;
    background-color: white;
    box-shadow: 3px 3px 15px -2px rgba(0,0,0,0.3);
    -webkit-transform-origin: center;
    -moz-transform-origin: center;
    -ms-transform-origin: center;
    -o-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 1;
}
.contacts-block.abs{
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    margin-top: -220px;
    margin-left: -450px;
    width: 900px;
    height: 440px;
    overflow: visible;
}
.contacts-block .left{
    display: inline-block;
    padding-right: 20px;
    width: 40%;
    border-right: 1px solid #ccc;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: top;
}
.contacts-block .right{
    display: inline-block;
    margin-left: -1px;
    padding-left: 20px;
    width: 60%;
    border-left: 1px solid #ccc;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: top;
}
.contacts-block span{
    color: #52606b;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 30px;
}
.contacts-block p{
    padding-top: 15px;
    font-size: 17px;
    color: #2b3841;
    font-family: 'Open Sans', sans-serif;
}
.contacts-block ul{
    font-size: 19px;
    color: #2b3841;
    list-style-position: inside;
}
.contacts-block li{
    margin-top: 15px;
}
.contacts-block a{
    display: block;
    font-size: 30px;
    text-decoration: none;
    color: #2b3841;
}
.hiddencards{
    display: none;
}

@media screen and (max-width: 1200px){
    .menu{
        display: none;
    }
    .mmenu{
        display: block;
    }

    .g1{
        position: static;
    }
    .g2{
        position: static;
    }
    .g3{
        position: static;
    }
    .g4{
        position: static;
    }
    .g5{
        position: static;
    }
    .g6{
        position: static;
    }
    .footer .left, .footer .right{
        width: auto;
    }
    .psevdo{
        display: none;
    }
    .contacts-block.abs{
        position: relative;
        display: block;
        top: 0;
        left: 0;
        margin-top: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
        overflow: hidden;
    }
    .map{
        padding-top: 0;
        margin-bottom: 0;
        height: 35%;
    }

    .map iframe{
        width: 100%;
    }
}
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

zwh

Выкинул "height: 35%;", но ничего не поменялось. Ширина экрана у меня 1280.

Lodur

Цитата: zwh от августа 23, 2017, 15:34Выкинул "height: 35%;", но ничего не поменялось. Ширина экрана у меня 1280.
Height - высота же. Ширина - width.
8-й Девственник Лингвофорума

If the doors of perception were cleansed, everything would appear to man as it is: infinite. (W. Blake)
Какая потребителю разница, какой продукт лучше не работает?.. (Awwal12)

zwh

Цитата: Lodur от августа 23, 2017, 15:55
Цитата: zwh от августа 23, 2017, 15:34Выкинул "height: 35%;", но ничего не поменялось. Ширина экрана у меня 1280.
Height - высота же. Ширина - width.
Просто этот блок начинается с условия
Цитировать
@media screen and (max-width: 1200px){
и я не знаю, будет ли он работать для моей ширины экрана.

Bhudh

Добавьте такой же блок для (max-width: 1920px), например, да посмотрите.
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

zwh

Цитата: Bhudh от августа 23, 2017, 17:20
Добавьте такой же блок для (max-width: 1920px), например, да посмотрите.
Попробовал (и откатил) для "max-width: 1280px" -- да, в этом случае места под карту становится достаточно. Но беда в том, что этот вариант прописан для мелких экранов, а не для десктопов. Добавление к основному map'у строчек
Цитировать
padding-top: 0;
margin-bottom: 0;
ни на что не повлияло. Кроме того, центрирования карты так и нет.


Bhudh

Цитата: zwh от августа 23, 2017, 18:04Добавление к основному map'у строчек
Цитата: padding-top: 0;
margin-bottom: 0;
ни на что не повлияло. Кроме того, центрирования карты так и нет.
Конечно, не повлияло, в resetʼной части CSS и так эти значения для всех элементов уже прописаны.

А что делать для центрирования, я Вам написал вот в этом сообщении во втором шаге.

Да и высота у .map осталась 100% вместо высоты карты, из-за этого под ней широкое белое поле.

ЗЫ. А, я смотрю, Вы добавили display: inline-block !important;. Только не тому элементу...
Пиши, что думаешь, но думай, что пишешь.
MONEŌ ERGŌ MANEŌ.
Waheeba dokin ʔebi naha.
«каждый пост в интернете имеет коэффициент бреда» © Невский чукчо

Быстрый ответ

Обратите внимание: данное сообщение не будет отображаться, пока модератор не одобрит его.

Имя:
Имейл:
Проверка:
Оставьте это поле пустым:
Наберите символы, которые изображены на картинке
Прослушать / Запросить другое изображение

Наберите символы, которые изображены на картинке:

√36:
ALT+S — отправить
ALT+P — предварительный просмотр