Легенда карты

Пост в архиве.

mixa-ua

13 ноября 2010, 19:31

Вопрос простой, но перерыв документацию. ответат так и не нашел.

Как создать что-то типа легенды карты? Т.е закрпеленный абсолютно в одном из углов карты прямоугольник, в котором можно вывести статический html-код

Буду признателен за помощь!

4 комментария

Авторизуйтесь, чтобы оставить комментарий

rodlex

28 января 2016, 06:51

Это легко сделать с помощью своего контрола:

function Legend () {
    var content = YMaps.jQuery('Легенда карты');

    content.css({
        position: "absolute",
        zIndex : YMaps.ZIndex.CONTROL
    });

    this.onAddToMap = function (map, position) {
        content.appendTo(map.getContainer());
        position = position || new YMaps.ControlPosition(YMaps.ControlPosition.BOTTOM_RIGHT, new YMaps.Point(5, 50));
        position.apply(content);
    };

    this.onRemoveFromMap = function () {
        content.remove();
    };
};

Ну и использовать так:

map.addControl(new Legend());

mixa-ua

28 января 2016, 06:51

Огромнейшее спасибо!!!

mixa-ua

28 января 2016, 06:51

Единственное, наберусь наглости спросить ещ по позиционированию. Как разместить ее в левом нижнем угле и задать ширину? А то css не срабатывает, а в java-scripts я не совсем силен, поэтому не вижу наверное очевидных вещей. Еще раз спасибо.

rodlex

28 января 2016, 06:51

В левый нижний угол можно разместить с помощью YMaps.ControlPosition:

map.addControl(new Legend(), new YMaps.ControlPosition(YMaps.ControlPosition.BOTTOM_LEFT, new YMaps.Point(5, 50));

Ширину задавайте в html, который записываются в переменной content. Можно указать там класс, например, b-legend. Тогда можно будет задавать стиль с помощью css.

function Legend () {
var content = YMaps.jQuery('Легенда карты');

Тогда css нужно будет указать такой:

.b-legend {
    width: 300px;
    padding: 0.3em

    background: #fff;
    border: solid 1px #ccc;
}