前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >原 js判断旋转中的图片里的元素与背景的某

原 js判断旋转中的图片里的元素与背景的某

作者头像
魂祭心
发布2018-05-17 15:59:46
6.4K0
发布2018-05-17 15:59:46
举报
文章被收录于专栏:魂祭心魂祭心

旋转代码

代码语言:javascript
复制
var ro=0;
$(document).ready(function(){
       setInterval("LoopRotate()",50);
});
function LoopRotate(){
    ro+=5;
	if(ro>360){ro=5;}
    $("#ro").css("transform","rotate("+ro+"deg)");
}

代码语言:javascript
复制
var Point={
     CreatePoint:function(x_ais,y_ais)
	 {
	       var point={};
		   var x=x_ais;
		   var y=y_ais;
		   //获取半径
		   point.GetRadius=function()
		   {
		       return Math.sqrt(Math.pow(x-320,2)+Math.pow(y-936,2));
		   };
		   //获取夹角
		   point.GetAngle=function(){
		     return Math.atan((x-320)/(936-y))*180/Math.PI;
		   };
		   //点相加
		   point.Add=function(value)
		   {
		      x=parseFloat(x)+parseFloat(value.GetX());
			  y=parseFloat(y)+parseFloat(value.GetY());
			  return point;
		   };
		   //试相加
		   point.TryAdd=function(value)
		   {
		     return Point.CreatePoint(parseFloat(x)+parseFloat(value.GetX()),parseFloat(y)+parseFloat(value.GetY()))
		   };
		   //点相减
		   point.Mins=function(value)
		   {
		      x=parseFloat(x)-parseFloat(value.GetX());
			  y=parseFloat(y)-parseFloat(value.GetY());
			  return point;
		   };
		   //判等
		   point.IsEqual=function(value)
		   {
		      if(x==value.GetX()&&y==value.GetY())
			  {return true;}
              else{return false;} 
		   };
			
		   point.GetX=function(){return x;}
		   point.GetY=function(){return y;}
		   return point;
	 }
};

图片

代码语言:javascript
复制
var Img={
        CreateImg:function()
		{
		    var img={};
			var points=new Array();
			img.originPoint=""
			img.SetOriginPoint=function(point)
			{
			   this.originPoint=point; 
			}
			//设置样本
			img.GetSample=function(pointSamples)
			{
			    for(var index=0;index<pointSamples.length;index++)
				{
				  points.push(pointSamples[index].Add(this.originPoint));
				}
			};
			//添加点
			img.AddPoint=function(point)
			{
			   points.push(point.Add(this.originPoint));
			};
			//移除点
			img.RemovePoint=function(point)
			{
			   for(var index=0;index<points.length;index++)
			   {
			      if((point.TryAdd(this.originPoint)).IsEqual(points[index]))
				  {
				     points.pop(points[index]);
				  }
			   }
			};
			//检测位置
			img.CheckImg=function()
			{  
			   for(var index=0;index<points.length;index++)
			   {
			     if(this.CheckPoint(points[index]))
				 {
				   return true;
				 }
			   }
			};
			//检测点
			img.CheckPoint=function(point)
			{
			        var yyy=point.GetY();
			        var xxx=point.GetX();
					
			        //获取旋转角度
			        var degMsg= $("#ro").css("transform")
		            var degCos=degMsg.substring(7,degMsg.indexOf(","));
		            var str=degMsg.substring(degMsg.indexOf(",")+1,degMsg.length);
		            var degSin=str.substr(0,str.indexOf(","));
		            var rotateDeg="";
					//合并旋转角度和夹角
		            if(degCos>0&&degSin>0)
		            {
		                //0-90
		                rotateDeg=Math.acos(degCos)*180/Math.PI;
		            }
		            if(degCos<0&&degSin>0)
		            {
		                //90-180
		                rotateDeg=Math.acos(degCos)*180/Math.PI;
		            }
		            if(degCos<0&&degSin <0)
		            {
		                //180-270
		                rotateDeg=360-Math.acos(degCos)*180/Math.PI;
		            }
		            if(degCos>0&&degSin<0)
		            {
		                //270-360
		                rotateDeg=360-Math.acos(degCos)*180/Math.PI;
		            }
		             //重新计算新的位置
		            var rotate=rotateDeg*Math.PI/180;
		            var currentX=parseFloat(point.GetX())+parseFloat(point.GetRadius()*Math.sin(rotate));
		            var currentY=parseFloat(point.GetY())+point.GetRadius()-parseFloat(point.GetRadius()*Math.cos(rotate));
		
		            if(currentX>120&&currentX<520&&currentY>536&&currentY<936)
		            {
		               return true;
		            }
			};
			return img;
		}
}

测试

代码语言:javascript
复制
var bear=Img.CreateImg();
bear.SetOriginPoint(Point.CreatePoint("240","436"));
var points=new Array(); 
//右脚尖
var point1=Point.CreatePoint("106","265");
//左眼睛
var point2=Point.CreatePoint("63","77");

points.push(point1);
points.push(point2);

bear.GetSample(points);
bear.Display();
if(bear.CheckImg())
{
alert("存在取样点在白色区域内");
}
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档