Leaderboard

Константин написал решение общими словами. Готового кода вам не напишут. Это не входит в рамки поддержки продукции. пробуйте что-то вроде этого <script type="text/javascript"> ymaps.ready(function () { $('#myTab a').on('click', function (e) { e.preventDefault(); $(this).tab('show'); }); /...../ $('#myTab').on('shown.bs.tab', function () { myMap.container.fitToViewport(); }); }); </script> и выводить <ul id="myTab" class="nav nav-tabs"> <li><a href="#default">По умолчанию</a></li> <li><a href="#map">Карта</a></li> </ul> <div class="tab-content"> <div class="tab-pane active" id="default"> <p>Содержимое вкладки открытой по умолчанию</p> </div> <div class="tab-pane" id="map"> <p>Вкладка с картой</p> <div id="YMapsID"></div> </div> </div> Вариант № 2 ymaps.ready(init); var myMap; function init () { // Инициализация вкладок. // После исполнения команды tabs() tab-2 получит style='display:none'. // Карта будет инициализирована, но будет иметь нулевой размер. // В данном случае это хорошо, так как невидимая карта не будет загружать невидимые тайлы. $('#tabs').tabs(); myMap = new ymaps.Map('tab-2', { //........// }); // В момент показа новой вкладки будем пересчитывать размер карты. // Карта примет максимально возможные значения при активации ее таба // и нулевые, как только будет выбран первый таб. // Подписываемся на событие 'tabsshow' (а не 'tabselect', // так как требуется, чтобы элемент с картой уже был виден). $('#tabs').bind('tabsshow', function (event, ui) { myMap.container.fitToViewport(); }); } вывод <div id="tab-2" style="width: 100%; height: 250px; padding: 0;"></div> дальше разберетесь