识别在 Raphael 中单击的图像

Question

我有一个 canvas 我要使用 raphael 绘制一些图像。图片的名称在列表中：images_list 我将绘制三张图片作为行。所有图像都具有相同的尺寸、等间距并且是 .png 文件（无矢量）。一些示例代码：

var paper_images_list = Raphael(canvas_images_list, '100%', '100%');
var images_for_row=3
var y_max=Math.ceil(image_list.length/images_for_row)*40
paper_images_list.setSize(div_width, y_max);
for (var i=0; i<image_list.length; i++) {
        var col=parseInt(i/images_for_row)
        var y=col*40
        var x=(i-images_for_row*col)*40
        var image = paper_images_list.image('/media/images/'+image_list[i], x, y, 33, 27);
    };

我想要的：点击一张图片我想知道是哪张图片，以便在另一张图片中使用它 paper/canvas。

我使用 Raphael 是因为我认为它可以让事情变得简单，但也许我错了。是否可以通过单击识别图像？

如果没有，我可以找到点击的坐标并计算出有哪个图像，但我不需要拉斐尔，对吧？有更好的解决方案吗？

我正在使用 Phyton3.5，Django 1.9，Javascript/JQuery，Windows7

Answer 1

感谢 Ian，我发现它很简单，例如：

document.getElementById('canvas_images_list').onclick=function(event) {
    var myimage = event.target
    if (myimage.tagName == 'image') {
        myimage = myimage.href.baseVal;
    };
};

if语句排除了任何图片外的点击

识别在 Raphael 中单击的图像

Recognize Image clicking over in Raphael

javascript

image

canvas

raphael