Использование jQuery с Рафаэлем

Я создал карту изображения с Рафаэлем. Я хочу, чтобы div, содержащий холст Raphael, исчезал с помощью jQuery при нажатии одного из путей на карте изображения (path10 в приведенном ниже примере). Код ниже не работает, но я на правильном пути?

<script type="text/javascript" charset="utf-8">
    window.onload = function () {
        var R = Raphael("canvas", 1050, 550);
        var attr = {
            fill: "#bbb",
            "fill-opacity": 1,
            stroke: "#222",
            "stroke-width": 0.3,
            "stroke-linejoin": "round"
        };
        path10 = R.path("m 221.63509,150.81487 97.24682,0 0,89.68452 -97.24682,0 0,-89.68452 z").attr(attr);
    };

    path10.node.setAttribute("id","barry");

    $(document).ready(function(){
        $("#barry").click(function(){
            $("#canvas").fadeOut();
        });
    });

</script>

<body>
    <div id="canvas"></div>
</body>

svg jquery raphael
person Bazley    schedule 31.08.2010    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Почти готово... это работает (проверено на Firefox 3.6.8):

<body>
<script type="text/javascript" charset="utf-8">
    $("document").ready(function() {
        var R = Raphael("canvas", 1050, 550);
        var attr = {
            fill: "#bbb",
            "fill-opacity": 1,
            stroke: "#222",
            "stroke-width": 0.3,
            "stroke-linejoin": "round"
        };
        path10 = R.path("m 221.63509,150.81487 97.24682,0 0,89.68452 -97.24682,0 0,-89.68452 z").attr(attr);
        path10.node.setAttribute("id","barry");

        $("#barry").click(function(){
            $("#canvas").fadeOut();
        });     
    });

</script>

<div id="canvas"></div>
</body>
person going    schedule 01.09.2010
comment
Никогда не трогайте свойство узла. path10.click( будет работать нормально. - person Dmitry Baranovskiy; 02.09.2010
comment
Я знаю, что этот вопрос действительно старый, и я ценю ответы, но мне любопытно, знаете ли вы способ сделать это с помощью jquery с несколькими переменными данными, которые я получаю с помощью JSP и JSTL? Я пробовал зацикливаться и создавать несколько div, но у меня возникла проблема, так как мой первый кусок кода находится в 1 функции Рафаэля, и, поскольку я, по-видимому, не могу создавать новые div в скрипте, мне пришлось создать цикл, который создал div, с скрипты, но это не сработало... Есть идеи, как заставить его работать? - person XaolingBao; 24.10.2014