javascript多边形碰撞检测详解编程语言

         const app = new PIXI.Application({ antialias: true }); 
document.body.appendChild(app.view); 
 
const graphics = new PIXI.Graphics(); 
 
 
// draw polygon 
const path = [600, 370, 700, 460, 780, 420, 730, 570, 590, 520]; 
 
graphics.lineStyle(0); 
graphics.beginFill(0x3500FA, 1); 
graphics.drawPolygon(path); 
graphics.endFill(); 
 
app.stage.addChild(graphics); 
 
  var xuanzhuan = PIXI.Sprite.from('/moban/images/share.jpg'); 
  xuanzhuan.width=120; 
  xuanzhuan.height=120; 
  xuanzhuan.x=13; 
  xuanzhuan.y=33; 
   app.stage.addChild(xuanzhuan); 
 
 
    xuanzhuan.interactive = true; 
 
    xuanzhuan.buttonMode = true; 
      xuanzhuan 
        .on('pointerdown', onDragStart) 
        .on('pointerup', onDragEnd) 
        .on('pointerupoutside', onDragEnd) 
        .on('pointermove', onDragMove); 
 
   function onDragStart(event) { 
    // store a reference to the data 
    // the reason for this is because of multitouch 
    // we want to track the movement of this particular touch 
    this.data = event.data; 
    this.alpha = 0.5; 
    this.dragging = true; 
} 
 
function onDragEnd() { 
    this.alpha = 1; 
    this.dragging = false; 
    // set the interaction data to null 
    this.data = null; 
} 
     var   posPolygon=[]; 
         var dianlist={}; 
        dianlist['x']=600; 
        dianlist['y']=370;  
        posPolygon.push(dianlist) 
    var dianlist={}; 
        dianlist['x']=700; 
        dianlist['y']=460;  
        posPolygon.push(dianlist)     
    var dianlist={}; 
        dianlist['x']=780; 
        dianlist['y']=420;  
        posPolygon.push(dianlist)       
    var dianlist={}; 
        dianlist['x']=730; 
        dianlist['y']=570;  
      posPolygon.push(dianlist)   
    var dianlist={}; 
        dianlist['x']=590; 
        dianlist['y']=520;  
        posPolygon.push(dianlist) 
function onDragMove() { 
    if (this.dragging) { 
        const newPosition = this.data.getLocalPosition(this.parent); 
        this.x = newPosition.x; 
        this.y = newPosition.y; 
 
        var baoweihe=this.getBounds(); 
        var youxiajiaox=baoweihe.x+baoweihe.width; 
        var youxiajiaoy=baoweihe.y+baoweihe.height; 
 
        var poslist=[]; 
          var pos={}; 
        pos['x']=baoweihe.x; 
        pos['y']=baoweihe.y;        
        poslist.push(pos);            
 
   var pos={}; 
        pos['x']=youxiajiaox; 
        pos['y']=baoweihe.y;        
        poslist.push(pos);            
        var pos={}; 
        pos['x']=youxiajiaox; 
        pos['y']=youxiajiaoy;        
        poslist.push(pos); 
 
        var pos={}; 
        pos['x']=baoweihe.x; 
        pos['y']=youxiajiaoy;        
        poslist.push(pos);         
 
           
     
        var ispengzhuang=PolygonInPolygon(poslist, posPolygon,5); 
        if(ispengzhuang){ 
            alert('碰撞了'); 
        } 
 
 
    } 
} 
 
function PolygonInPolygon(posPolygonA, posPolygonB, count){ 
    console.log(posPolygonA); 
       var count1=posPolygonA.length; 
      for(var i=0;i<count1;i++ ){ 
        var pos=posPolygonA[i]; 
           console.log(pos); 
          var  ispengzhuang=PointInPolygon( pos, posPolygonB, count); 
          if(ispengzhuang){ 
            alert('碰撞了') 
          } 
      } 
} 
 
function PointInPolygon( pos, posPolygonB, count) 
{ 
    var cross = 0; //交点个数 
        
    for( var i = 0; i < count; i++ ) 
    { 
        var p1 = posPolygon[i]; 
        var p2 = posPolygon[(i + 1) % count]; //下一个节点 
  
        // p1p2这条边与水平线平行 
        if( p1.y == p2.y ) 
            continue; 
  
        // 交点在p1p2的延长线上 
        if( pos.y < Math.min( p1.y, p2.y ) ) 
            continue; 
  
        // 交点在p1p2的延长线上 
        if( pos.y > Math.max( p1.y, p2.y ) ) 
            continue; 
             
        // 计算交点 X 左边 ： (p2.y - p1.y)/(p2.x - p1.x) = (y - p1.y)/(x - p1.x) 
        // 直线 K 值相等， 交点y = pos.y 
        let x = (pos.y - p1.y) * (p2.x - p1.x) / (p2.y - p1.y) + p1.x 
        // 只统计单边交点，即点的正向方向 
        if(x > pos.x) 
            cross ++; 
    } 
  
    return cross % 2 == 1; 
}