Group精确定位(canvas定位)
##
<!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>
Group精确定位(canvas定位)的更多相关文章
- 承载地图的div如果隐藏再显示,则定位时会定位到页面左上角
承载地图的div如果隐藏再显示,则定位时会定位到页面左上角. 解决方法:不隐藏,改变div的高度.在div上利用z-index加一个新的不透明的div.
- HTML四种定位-固定定位
固定定位 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset=&q ...
- Blazor组件自做七 : 使用JS隔离制作定位/持续定位组件
1. 运行截图 演示地址 2. 在文件夹wwwroot/lib,添加geolocation子文件夹,添加geolocation.js文件 本组件主要是调用浏览器两个API实现基于浏览器的定位功能,现代 ...
- CSS层定位——固定定位,相对定位,绝对定位
主要写关于层定位的相关知识 ㈠定位概述 ⑴像图像软件中的图层一样可以对每一个layer能够精确定位操作 ⑵层定位的position属性决定了当前的一个网页元素,可以叠加到另一个网页元素上面,那么我们把 ...
- android定位GPS定位 代码实现
package com.lx.util; import android.content.Context; import android.content.SharedPreferences; imp ...
- iOS定位 - 普通定位(没有地图) - 反地理编码(得到具体位置)
#import <CoreLocation/CoreLocation.h> 使用到的头文件 要引入CoreLocation这个包 <CLLocationManagerDelegate ...
- Wi-Fi定位,AP定位
Wi-Fi实时定位系统 基于Wi-Fi的无线局域网实时定位系统(Wi-Fi RTLS)结合无线局域网络(WLAN).射频识别(RFID)和实时定位等多种技术,广泛地应用在有无线局域网覆盖的区域,实现复 ...
- 元素定位-XPATH定位方法总结
1.Xpath定位方法探讨 xpath是比较常用的一种定位元素的方式,因为它很方便,缺点是,消耗系统性能.如果Xpath使用的比较好,几乎可以定位到任何页面元素,而且受页面变化影响较小. 1.1.什么 ...
- Android系统中是否开启定位及定位模式的判断
1.关于Android系统中不同的定位模式 Android系统中包括3中定位模式: 使用GPS.WLAN和移动网络 使用WLAN和移动网络 仅使用GPS 截图 特点 同时使用GPS.WIFI及基站 ...
随机推荐
- 使用gearman进行异步的邮件或短信发送
一.准备工作 1.为了防止,处理业务途中出现的宕机,请配置好gearman的持久化方式.2.使用gearmanManager来管理我们的worker脚本,方便测试. 上述两条请看我之前写的两篇文章 二 ...
- 【gRPC使用问题1】gRPC的proto内import其他proto导致的一次小坑
1.对于一些proto里面的定义,如果包含了 引入其他proto文件的 proto文件来说,生成的时候要注意.尤其是 引入的是官方框架内的 proto文件,如果自己没有提供的话,生成代码会报错! 具体 ...
- SprinMVC中文件上传只在内存保留一份拷贝
背景:web项目里经常有上传文件的模块,某些特殊场景下,上传文件的人不希望在服务器留存一份原始文件,这个时候就需要把文件放到内存里了. 笔者调试了一下springmvc里面的CommonsMultip ...
- hdu 5493 (2015合肥网赛) Queue
题目;http://acm.hdu.edu.cn/showproblem.php?pid=5493 题目大意,t组数据,n个人,n行每行分别是人的身高和这个人的左边或右边比他高的人的个数,输出符合条件 ...
- Numpy 基础运算
numpy的几种运算 1.一维矩阵运算 >>> import numpy as np >>> a=np.array([10,20,30,40]) # array([ ...
- Python.tornado.0
Tornado https://github.com/facebook/tornado http://www.tornadoweb.org/en/stable/guide/intro.html (A ...
- 三分钟分布式CAP理论
分布式系统架构理论,定义了三种指标,理论说我们最多只能满足两个. ## 分布式系统 首先我们这个理论所说的分布式系统,是指系统内会共享数据,互相有连接有交互,才能完成系统功能的的分布式系统.而这个理论 ...
- ActiveMq unsupported major.minor version 52.0
网上是说ActiveMq已经编译好的版本和运行的java版本不一致导致的,看了一下MF文件 用的Jdk版本是1.8,而我们当前系统的java版本是1.7,所以尝试重新下载之前的ActiveMq的版本. ...
- 通过 ulimit 改善系统性能
系统性能一直是一个受关注的话题,如何通过最简单的设置来实现最有效的性能调优,如何在有限资源的条件下保证程序的运作,ulimit 是我们在处理这些问题时,经常使用的一种简单手段.ulimit 是一种 l ...
- Subarray Product Less Than K LT713
Your are given an array of positive integers nums. Count and print the number of (contiguous) subarr ...