Создание сетки кругов с текстом внутри и ... перемещение вещей вокруг - PullRequest
0 голосов
/ 04 ноября 2011

Я отчаянно пытаюсь построить сетку с кругами и текстом внутри.Пока все хорошо, я могу это сделать ... Моя настоящая проблема в том, чтобы найти каждый набор и переместить его (текст И кружок).Я пытался взглянуть на подобные проблемы, но сам не могу выяснить ... Если бы кто-то мог дать мне подсказку, я был бы очень признателен.

Вот упрощенный код (только 1 строка), который не работает:

$(function() {
        // Prepare drawing zone
        var paper = Raphael(document.getElementById('question'), '100%', '100%');

        var word = 'Sunday';

        var group = new Array();
        // Draw 5 circles with text inside
        for (i=0; i<5; i++) {
            group[i] = paper.set();
            group[i].push(paper.circle(50+i*60, 50, 30));
            group[i].push(paper.text(50+i*60, 50, word));

            group[i].click(function() {
                group[i].translate(20,20); // HERE'S THE PROBLEM group[i] DOESN'T WORK !
                group[i].rotate(Math.random() * 90);
            });
             }
    });

Я не могу найти способ «вызова» моих наборов для дальнейшего использования ... Конечно, если у меня есть только 1 набор (и нет массива =, это работает ...

Спасибо за вашу помощь!

Celfred.

Редактировать: jsfiddle: http://jsfiddle.net/rrWqM/

Редактировать: я неЯ уверен, что я достаточно ясен. Я хотел бы иметь возможность щелкнуть 1 кружок (и текст) и увидеть, как ЭТОТ кружок И текст перемещаются. Если я нажимаю на другой, то другой движется ... Звучиттак просто, я не могу поверить, что я застрял на этом ... Спасибо за помощь.

Ответы [ 2 ]

0 голосов
/ 05 ноября 2011

В конце концов, я нашел способ: jsfiddle

Теперь я получил правильную ссылку в моем событии клика.

Должен признать, я не совсем понял свою первоначальную проблему. Если бы вы могли хотя бы сказать мне, если это новое «решение» звучит хорошо для вас, я был бы признателен; -)

Celfred.

0 голосов
/ 04 ноября 2011

Вот [скрипка] [http://jsfiddle.net/DusKv/1/]

Проблема в вашем коде в том, что переменная i не имеет правильного значения при вызове функции обратного вызова click. Вы можете обойти это, определив локальную переменную в прилагаемой области видимости.

// Prepare drawing zone
var paper = Raphael(document.getElementById('question'), '100%', '100%');

var word = 'Sunday';

var group = new Array();
// Draw 10 circles with text inside
for (i = 0; i < 10; i++) {
    var set = paper.set();
    set.push(paper.circle(50 + i * 30, 50, 50));
    set.push(paper.text(50 + i * 30, 50, word));

    set.click(function() {
        set.translate(Math.random() * 350, Math.random() * 380); // HERE'S THE PROBLEM group[i] DOESN'T WORK !
        set.rotate(Math.random() * 90);
    });
    group[i] = set;
}
...