Azure Maps Resize + Javascript не заставит его работать - PullRequest
Новая
       15

Azure Maps Resize + Javascript не заставит его работать

0 голосов
/ 25 февраля 2019

Я создал вид Asp.net MVC, где у меня есть карта из карт Azure.У меня также есть боковая панель, которую я могу свернуть, чтобы стать меньше.

Код для свертывания панели следующий (и включен в файл _layout): 

 function collapse2() {
        $('#sidebar').toggleClass('active');
    $('#content').toggleClass('active');

}
window.onload = function () {

    $("#sidebarCollapse").on('click', collapse2);
 }

В представлении я добавил следующий javascript. 

  function resize() {
                    map.map.resize();
                }
     $(document).ready(function () {



    GetMap();
    $(document).click('#resizea', resize);
     $(document).click('#sidebarCollapse', resize);
 });

Когда я нажимаю кнопку с идентификатором sidebarCollapse , боковая панель сворачивается, но карта не изменяется (она не растягивает 100%).Но если я щелкну по тегу ссылки с идентификатором resizea после свертывания, карта изменит размер до правильного размера.

Может кто-нибудь привести меня в правильном направлении?

Спасибо заранее!

1 Ответ

0 голосов
/ 03 апреля 2019

Как я уже упоминал в комментариях, я подозреваю, что размер div еще не изменился.HTML не предоставляет никаких событий, когда размер элемента DOM отличается от размера окна.Чтобы узнать, изменяется ли что-то, вы должны следить за этим, что является болью для себя.Поскольку вы используете jquery, вы можете использовать функцию изменения размера: https://api.jquery.com/resize/ Это работает с divs.

Если это не работает.Похоже, проблема заключается в том, когда вы нажимаете кнопку сброса боковой панели.Я предполагаю, что эта кнопка также сворачивает боковую панель, возможно, с отдельным событием щелчка.Попробуйте объединить их вместе и вызвать функцию изменения размера после вызова кода для свертывания боковой панели.Если у вас есть анимация при свертывании, это может не сработать, в этом случае оберните функцию изменения размера setTimeout и используйте промежуток времени, который немного больше, чем анимация.

...