@lucablockltd/packaging-mockup-3d v0.0.9

Getting Started with Packaging Mockup 3D

Installation

npm i @lucablockltd/packaging-mockup-3d

Usage

import { PackageMockup } from '@lucablockltd/packaging-mockup-3d';

const PackageMockupRender = () => {
  return (
    <PackageMockup
      modelId={0} // Model ID
      width={40} // ความกว้าง
      height={40} // ความสูง
      length={40} // ความลึก
      unit='mm' // mm, cm, inch
      is3D={false} // true : 3 มิติ / false : 2 มิติ (dieline)
      isFreeControl={false} // ควบคุมมุมมองด้วยตัวเอง true / false
      actionState={0} // animation การเปิดปิด packaging 0 - 4
      mode={0} // Mode การแสดงผล 0 : Edit / 1 : Design / 2 : Preview
      side={0} // ด้านสำหรับ Dieline 0 : Front side / 1 : Back side
      isHelper={false} // เเสดงเเกน 3 มิติ
      isPlay={false} // ทำการเล่น animation
      isMapControl={false} // สามารถ control แบบ drag ได้
      onCanvasSize={() => null} // function 3d ส่งค่า { width : xxx , height : xxx }
      onCropPositions={() => null} // function 3d ส่งค่า crop position ในการตัดรูปภาพที่นำมา map texture
      textures={{ in: [], out: [] } || null} // ส่ง texture ที่นำไป map ในเเต่ละ shape ของ model
      material={null} // ไฟล์ หรือ path ของ material
      baseSize={400 || null} // base size ของ canvas ที่นำมา render
      zoom={100} // ค่า zoom default คือ 100%
      isDimension={false} // เเสดง dimension name
    />
  )
}