finscn / maxrectsbinpack

MaxRects Algorithm JavaScript implementation

rects-bin-pack

MaxRects Algorithm JavaScript implementation

demo

• demo

usage

• init bin pack

  /**
  * MaxRectanglesBinPack
  * @param {Number} width The container width
  * @param {Number} height The container height
  * @param {Boolean} [allowRotate=false] Whether to allow rotate the rects
  */
  const pack = new MaxRectsBinPack.MaxRectsBinPack(512, 256, false);
  

• add rectangles

  const rectangles = [{
      width: 20,
      height: 100,
      id: '1'
  }, {
      width: 200,
      height: 70,
      id: '2'
  }, {
      width: 30,
      height: 70,
      id: '3'
  }];
  /**
   * Insert a set of rectangles
   * @param  {Rect[]} rectangles The set of rects, allow custum property
   * @param  {Number} method The pack rule, allow value is BestShortSideFit, BestLongSideFit, BestAreaFit, BottomLeftRule, ContactPointRule
   * @return {Rect[]} The result of bin pack.
   */
  const result = pack.insert2(rectangles, MaxRectsBinPack.BestShortSideFit)
  

Dev

• run npm install to install dependencies
• run npm run dev to watch and develop
• run npm run build to build

License

MIT License