【发布时间】:2015-04-10 08:14:48
【问题描述】:
我正在学习 Raphael,我想知道如何从 mousedown 和 mouse up 这两个事件中调用相同的函数,以便在每次点击时绘制两个点。
您可以在这里测试代码:jsfiddle
var w = window.innerWidth;
var h = window.innerHeight;
var paper = Raphael(0, 0, w, h);
var canvas = paper.rect(0, 0, w, h,12);
canvas.attr('fill', 'lightgrey');
canvas.mouseup(function (event, a, b) {
// get bounding rect of the paper
var bnds = event.target.getBoundingClientRect();
var targetBox = this.getBBox();
// adjust mouse x/y
var mx = event.clientX - bnds.left;
var my = event.clientY - bnds.top;
// divide x/y by the bounding w/h to get location %s and apply factor by actual paper w/h
var fx = mx/bnds.width * canvas.attrs.width + targetBox.x;
var fy = my/bnds.height * canvas.attrs.height + targetBox.y;
// cleanup output
fx = Number(fx).toPrecision(3);
fy = Number(fy).toPrecision(3);
paper.circle(fx, fy, 1).attr("fill","black", "stroke-width",0);
});
我对 RaphaelJS 还是很陌生,而且我从来不需要使用 javascript 从两个鼠标事件中调用函数。所以,我很困惑。任何帮助将不胜感激。
【问题讨论】:
标签: mouseevent raphael mousedown mouseup