Клуб API Карт

Пользовательский масштабируемый оверлей

Пост в архиве.
e607yc
23 сентября 2009, 15:15

Всем привет.

Как, используя api яндекс карт, сделать масштабируемый пользовательский оверлей, такой-же как на этой страничке http://www.pokrovsky.su/about/?id=location (тут реализация с помощью гуглокарт).

6 комментариев
Вы имеете ввиду ломанную линию?
Нет, линия как раз проблем на вызывает, там картинка генплана в формате png и она масштабируется вместе с картой.
Необходимо созадть свой слой, соблюдая нумерацию тайлов.
Можно релизовать интерфейс YMaps.IOverlay и создать новый оверлей.
var GroundOverlay = function (src, bounds) {
    var map,
        $element = YMaps.jQuery.browser.msie && jQuery.browser.version < 7 ?
                        YMaps.jQuery('') :
                        YMaps.jQuery('');

    this.onAddToMap = function (oMap, parentContainer) {
        map = oMap;
        this.onMapUpdate();
        $element.appendTo(parentContainer);
    }
   
    this.onRemoveFromMap = function () {
        $element.remove();
        map = null;
    }
   
    this.onMapUpdate = function () {
        var pixelLeftTop = map.converter.coordinatesToMapPixels(bounds.getLeftTop()),
            pixelSize = pixelLeftTop.diff(map.converter.coordinatesToMapPixels(bounds.getRightBottom()));
       
        $element.css({
            left: pixelLeftTop.getX() + 'px',
            top: pixelLeftTop.getY() + 'px',
            width: pixelSize.getX() + 'px',
            height: pixelSize.getY() + 'px'
        });
    }
}

window.onload = function () {
    var map = new YMaps.Map(document.getElementById('YMapsID')),
        bounds = new YMaps.GeoBounds(new YMaps.GeoPoint(36.963157653808594, 55.80144981927096), new YMaps.GeoPoint(36.976633071899414, 55.80924015622303)),
        customMap = new GroundOverlay('http://www.pokrovsky.su/img/pokrg.png', bounds);
   
    map.setCenter(new YMaps.GeoPoint(36.987876892089844, 55.8072625712663), 12);
    map.addOverlay(customMap);
}
Хм, весьма нетривиально получилось, большое спасибо, потому что мои попытки не увенчались успехом.
А какой код применить и куда его поставить если нужно указать просто здание как на яндекс карте пример http://api.yandex.ru/maps/articles/examples/mapcontrolscustomizing.html можно без поля (список городов)
Пока удалось сделать только простую карту (вставив скрипт который предлогался) сдание видно всё ок, но хотелось бы чтоб ещё и табличка всплывала с названием.