javascript - Raphaeljs 将点击事件添加到饼图的一部分

Question

我需要响应拉斐尔饼图中每个切片上的点击事件。我用这种方式尝试过，但它似乎没有这样做。我的代码只是下面代码中注释为“我的代码”的两行，直接来自RaphaelJS的演示饼图...

        <script>
        var u = "";
        var r = "";
        window.onload = function () {

            r = Raphael("holder"),
                pie = r.piechart(320, 240, 100, [25, 20, 13, 32, 5, 21, 14, 10,41,16,12,18,16,14,12,13], 
                    { legend: ["%%.%% - Enterprise Users", "IE Users"],
                    legendpos: "west", href: ["http://raphaeljs.com", "http://g.raphaeljs.com"]
                    }
                );

            r.text(320, 100, "Interactive Pie Chart").attr({ font: "20px sans-serif" });

            pie.hover(function () {
                u = this;                 // My Code   
                u.onclick = clickEvent;   //  hook to the function 
               this.sector.stop();
                this.sector.scale(1.1, 1.1, this.cx, this.cy);  // Scale slice 

                if (this.label) {                               // Scale button and bolden text 
                    this.label[0].stop();
                    this.label[0].attr({ r: 7.5 });
                    this.label[1].attr({ "font-weight": 800 });
                }
            }, function () {
                this.sector.animate({ transform: 's1 1 ' + this.cx + ' ' + this.cy }, 500, "bounce");


                if (this.label) {
                    this.label[0].animate({ r: 5 }, 1500, "bounce");
                    this.label[1].attr({ "font-weight": 400 });
                }
            });

        };
        function clickEvent(){
            console.log("Clicked!")
        }
    </script>

Answer 1

拉斐尔的语法有点不同。

检查这个documentation

您的代码应如下所示:

u.click(clickEvent);