Nucleic Photon Magnetizer

    @piyoppi/colision-detector

    0.1.4 • Public • Published

    Colision-Detector

    CircleCI

    The colision detection library for game development.

    Sample

    See below a website.

    Usage

    Detecting items in specific area

    // items in the field.
    const items = [
      { position: [100, 100], width: 40, height: 40 },
      { position: [400, 600], width: 40, height: 40 },
      { position: [200, 800], width: 400, height: 40 },
      { position: [300, 0], width: 350, height:  350 },
      { position: [10, 300], width: 250, height: 80 }
    ];
    
    //initialize
    const level = 2;  // level is the depth of quadtree. (1 or 2 or 3)
    const colisionDetector = new ColisionDetector(width, height, level, items);
    
    // detect at a specific rectangle.
    const clickedItems = colisionDetector.detectAt({position: [110, 110], width: 2, height: 2});
    
    // display the result of detecting.
    console.log(clickedItems);

    The result of console.log is shown below. detectAt(rectangle) returns an array including colided items.

    [
      {
        colisionState: {
          colisionId: 0,
          colisions: [],
          treeIndex: 5
        },
        width: 40,
        height: 40,
        position: [100, 100]
      }
    ]

    Detecting each items

    // items in the field.
    const items = [
      { position: [130, 120], width: 40, height: 40 },
      { position: [100, 100], width: 40, height: 40 },
      { position: [400, 600], width: 40, height: 40 },
      { position: [200, 800], width: 400, height: 40 },
      { position: [300, 0], width: 350, height:  350 },
      { position: [10, 300], width: 250, height: 80 }
    ];
    
    //initialize
    const level = 2;  // level is the depth of quadtree. (1 or 2 or 3)
    const colisionDetector = new ColisionDetector(width, height, level, items);
    
    // detect some colisions
    colisionDetector.detect(items);
    
    // display the result of detecting.
    console.log(items[0]);

    The result of console.log is shown below. The `detect()' method set the result of detecting colision on each items.

    {
      width: 40,
      height: 40,
      position: [130, 120],
      colisionState: {                      // The state of detecting colision
        colisionId: 0,                      // Colision id (colision-detector use this value)
        treeIndex: 5,
        colisions: [                        // Colided details
          {
            distX: -10,                     // The overwrapped area (about x axis)
            distY: -20,                     // The overwrapped area (about y axis)
            absDistX: 10,                   // The amount of overwrapped area (about x axis)
            absDistY: 20,                   // The amount of overwrapped area (about y axis)
            colisionFaceVec: [-1, 0],       // Normarized vector about colided face
            pair: {                         // Colided item
              width: 40,
              height: 40,
              position: [100, 100],
              colisionState: {
                colisions: Array(1),
                treeIndex: 5,
                colisionId: 1
              }
            }
          }
        ]
      }
    }

    Keywords

    none

    Install

    npm i @piyoppi/colision-detector

    DownloadsWeekly Downloads

    0

    Version

    0.1.4

    License

    MIT

    Unpacked Size

    30.2 kB

    Total Files

    11

    Last publish

    Collaborators

    • piyoppi