##
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="js/fabric.1.7.22.js"></script>
<script src="js/jquery-1.9.1.min.js"></script>
</head>
<body>
<canvas id="c" width="500" height="500"></canvas>
<button id="discard">Group定位</button>
<script>
var canvas = new fabric.Canvas('c');
var h = 50;
var w = 100;
var body = new fabric.Rect({ width: w, height: h, fill: '#f55', top: 15, left: 50 });
var port = new fabric.Rect({ width: 20, height: 30, fill: 'yellow', top: 15, left: 50 + w - 10 });
var group = new fabric.Group([body, port], { hasControls: false, hasBorders: false });
group.top = 100;
group.left = 250;
canvas.add(group); group.on('mousemove', function (e) {
var innerTarget = group._searchPossibleTargets(e.e);
console.log(innerTarget);
}); group._searchPossibleTargets = function (e) {
var pointer = this.canvas.getPointer(e, true);
var i = 2,//简化:示例为两个对象
normalizedPointer = this.canvas._normalizePointer(this, pointer); while (i--) {
if (this.canvas._checkTarget(normalizedPointer, this._objects[i])) {
return this._objects[i];
}
}
return null;
}
</script>
</body>
</html>