RaphaelJS отображать только одно активное состояние

Question

Обновление:

Я исправил свои ссылки ниже, и моя проблема теперь более конкретна.

Справочная информация: у меня есть набор путей, делающихсоставить карту.В настоящее время у меня есть визуальное состояние включения / выключения при нажатии на каждый регион, но я хочу, чтобы только один регион был активным в любой момент времени.Я вызываю функцию, которая предназначена для зацикливания всех областей и изменения цвета заливки любых неактивных областей обратно на серый.В настоящее время кажется, что создается новый набор путей, когда запускается следующая строка: var obj = rsr.path(pathObj.path);.Ниже приведен экран до и после.

Я знаю, что это не проблема рендеринга, поскольку новые пути вводятся вDOM.

Это мое последнее препятствие на этом проекте, я чувствую, что я так близко!

Вы можете просмотреть страницу здесь: http://ochrerecruitment.com.s145292.gridserver.com/job-search/

Этофункция, которую я запускаю в конце события щелчка (любезно предоставлено Элираном Малкой, спасибо):

function onlyOneRegion() {
    for (var state in paths) {
            var pathObj = paths[state];
            var obj = rsr.path(pathObj.path);
            if (pathObj.active) {
                // do something
            } else {
                pathObj.active = false;
                obj.toFront();
                obj.animate({
                    fill: attributes.fill,
                    scale: 1,
                    'stroke' : '#fff',
                    'stroke-width' : 1,
                    transform: 's1'
                }, 150);
            }
    };
}

Еще раз спасибо!

Оригинальный вопрос:

В настоящее время у меня есть карта, которая устанавливает значение <select> при нажатии.Каждый регион на карте также имеет состояние наведения и состояние включения / выключения.

Функция <select> позволяет активировать только один регион в любой момент времени.

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

Моя полная функция доступна здесь: http://pastie.org/3675997

Структура каждого регионаследующим образом:

var paths = {
    southisland: {
        name: 'southisland',
        path: 'coords',
        active: 'false'
    }

в моем событии click у меня есть следующее, если еще:

if (this.active) {
    this.active = false;
    this.animate({
        fill: attributes.fill,
        scale: '1',
        'stroke-width' : '1',
        transform: 's1'
    }, 150);                    
} else {
    this.active = true;
    this.animate({
        fill: '#e36f1e',
        scale: '1',
        'stroke-width' : '1',
        transform: 's1'
    }, 150);
}

сразу после этого я пытаюсь вызвать следующую функцию:

function onlyOneRegion() {
    for (var state in paths) {
        var obj = rsr.path(paths[state].path);
        if (state[active]) {
        } else {
            state[active] = false;

            obj.animate({
                fill: attributes.fill,
                scale: '1',
                'stroke-width' : '1',
                transform: 's1'
            }, 150);
        }
    };
}

Эта функция не выдает никаких ошибок, но не работает с *. 1052 *

Любая помощь очень ценится!

Answer 1

вы пытаетесь вызвать свойство по индексу paths.обратите внимание, что state - это индекс итератора списка paths, а не объекта (как, например, в Java для каждой итерации).

другая вещь, при передаче числовых значений передайте их как числовыезначения (не в виде строк).

попробуйте исправить вашу функцию следующим образом:

function onlyOneRegion() {
    for (var state in paths) {
        var pathObj = paths[state];
        var obj = rsr.path(pathObj.path);

        if (pathObj.active]) {
            // do something
        } else {
            pathObj.active = false;

            obj.animate({
                fill: attributes.fill,
                scale: 1,
                'stroke-width' : 1,
                transform: 's1'
            }, 150);
        }
    };
}

Answer 2

Я решил проблему с обновлением, переписав создание карты в функцию.Каждый раз, когда на регион нажимают, он запоминает этот регион, удаляет и заново создает карту, сопоставляя регион с соответствующим идентификатором состояния и делая его активным.Не самое элегантное решение, но, тем не менее, решение.

Answer 3

Глядя на свою полную пасту, вы фактически нигде не звоните onlyOneRegion(). Вам нужно добавить вызов к нему где-нибудь внутри вашего click().

Также обратите внимание, что 'this' внутри onlyOneRegion() не будет правильным (я думаю, вы увидите, что там происходит, когда заработаете функцию, она должна быть rsr.path(paths[state].path)).

Answer 4

замените state[active] на state['active']

и замените state[active] на paths[state]['active'], поскольку state - строка - название штата