Клуб API Карт

Баллуны не раскрываются повторно, как решить проблему?

tps52
17 декабря 2015, 04:19

Возникла проблема.

 После закрытия баллуна на карте, при повторном нажатии на кнопку "показать на карте" (в коде так обозначена кнопка) баллун уже не открывается.

Помогите пожалуйста устранить ошибку! Прилагаю полный код страницы....

<div id="YMapsID" style="width:100%;height:550px">&nbsp;</div>
<br clear="both">
<div id="block">
    <div>
     <h4>Список</h4>
     <ul>
        <li>
            <a href="#">Контент-1</a> (<a rel="0" href="#" class="onmap">Показать на карте</a>)
            <div class="info">
<i>Текст: </i><br>
<i>Текст: </i><br> 
<a href='#'>новости по теме</a>
   </div>
        </li>
        <li>
           <a href="#">Контент-2</a> (<a rel="1" href="#" class="onmap">Показать на карте</a>)
   <div class="info">
<i>Текст: </i><br>
<i>Текст: </i><br> 
<a href='#'>новости по теме</a>
</div>
        </li>
        <li>
   <a href="#">Контент-3</a> (<a rel="2" href="#" class="onmap">Показать на карте</a>)
            <div class="info">
<i>Текст: </i><br>
<i>Текст: </i><br> 
<a href='#'>новости по теме</a>
</div>
        </li>     
      </ul>
 </div>
 </div>
<script src="http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"  type="text/javascript"></script>
<script type="text/javascript">
window.onload = function () {
  //карта
  var myMap = new ymaps.Map('YMapsID', {
    center: [59.194265, 39.912287],
    zoom: 12
  });
  myMap.controls.add('zoomControl').add('mapTools').add('searchControl');
  var polygon = [];
  var placemark = [];
  var options = {
        draggable: false,
        opacity: 1
      };
var clusterIcons = [{
                href: 'http://vologda-portal.ru/upload/cluster.png',
                size: [33, 33],
                offset: [-16, -16]
            },
            {
                href: 'http://vologda-portal.ru/upload/cluster_big.png',
                size: [47, 47],
                offset: [-23, -23]
            }
        ];  
  var clusterNumbers = [10];
  var cluster = new ymaps.Clusterer({clusterIcons: clusterIcons, clusterNumbers: clusterNumbers });
  var collection = new ymaps.GeoObjectCollection();
//первая метка *********** 
    var properties_dot = {
          balloonContentHeader: '<a href="#" target="_blank"><b>Контент-1</b></a><br><br clear="both">',
 balloonContentBody: '<img src="#" style="float:right;margin-left: 10px;border:0px;" alt="" width="150" height="100" /><b>Контент-1</b><br>'+
'<b>Контент-1<b>',
          hintContent: "Контент-1",
          iconContent: ""
      },
      options_dot = { balloonCloseButton: true,
                  iconImageHref: 'http://vologda-portal.ru/upload/uf/c27/green_social.png',
                  iconImageSize: [30, 31],
                  iconImageOffset: [-3, -31]      };
      placemark[0] = new ymaps.Placemark([59.194265, 39.912287], properties_dot, options_dot);
 
    var geometry = [[ [59.194265, 39.912287],  ]],
      properties = {
        hintContent: "Контент-1"
      };
      polygon[0] = new ymaps.Polygon(geometry, properties, options);
      polygon[0].events.add('click', function (event) {
        placemark[0].balloon.open();
      });
 
 collection.add(polygon[0]);
//********************************
//вторая метка *********** 
    var properties_dot = {
          balloonContentHeader: '<a href="#" target="_blank"><b>Контент-2</b></a><br><br clear="both">',
 balloonContentBody: '<img src="#" style="float:right;margin-left: 10px;border:0px;" alt="" width="150" height="100" /><b>Контент-2</b><br>'+
'<b>Контент-2<b>',
          hintContent: "Контент-2",
          iconContent: ""
      },
      options_dot = { balloonCloseButton: true,
                  iconImageHref: 'http://vologda-portal.ru/upload/uf/c27/green_social.png',
                  iconImageSize: [30, 31],
                  iconImageOffset: [-3, -31]      };
      placemark[1] = new ymaps.Placemark([59.212507, 39.924393], properties_dot, options_dot);
    var geometry = [[ [59.212507, 39.924393],   ]],
      properties = {
        hintContent: "Контент-2"
      };
      polygon[1] = new ymaps.Polygon(geometry, properties, options);
     
      polygon[1].events.add('click', function (event) {
        placemark[1].balloon.open();
      });
 
       collection.add(polygon[1]);
//********************************
  
//третья метка *********** 
      var properties_dot = {
          balloonContentHeader: '<a href="#" target="_blank"><b>Контент-3</b></a><br><br clear="both">',
balloonContentBody: '<img src="#" style="float:right;margin-left: 10px;border:0px;" alt="" width="150" height="100" /><b>Контент-3</b><br>'+
'<b>Контент-3</b>',
          hintContent: "Контент-3",
          iconContent: ""
      },
      options_dot = { balloonCloseButton: true,
                  iconImageHref: 'http://vologda-portal.ru/upload/uf/c27/green_social.png',
                  iconImageSize: [30, 31],
                  iconImageOffset: [-3, -31]      };
      placemark[2] = new ymaps.Placemark([59.212529, 39.923767], properties_dot, options_dot);
    var geometry = [[ [59.212529, 39.923767],        ]],
      properties = {
        hintContent: "Контент-3"
      };
      polygon[2] = new ymaps.Polygon(geometry, properties, options);
      
      polygon[2].events.add('click', function (event) {
      placemark[2].balloon.open();
      });
 
   collection.add(polygon[2]);
//********************************
   
//кластеризуем точки
cluster.options.set({ gridSize: 64 });
cluster.add(placemark);
myMap.geoObjects.add(cluster);
//показываем коллекцию полигонов
myMap.geoObjects.add(collection);
$(".onmap").click(function() {
  window.scrollTo(0,600);
  var id = parseInt($(this).attr("rel"));
  myMap.setCenter(placemark[id].geometry.getBounds()[0], 15, {
    checkZoomRange: true,
    callback: function() {
      placemark[id].events.once('mapchange', function(e){ if( e.get('newMap') != null) {
        setTimeout(function() {
           placemark[id].balloon.open();//myMap.getCenter()
        }, 300);        
      } });
    }
  });
  return false;
});
};
//****************************************************************-----
</script>