AI Lab Specs

ElaborateExample.js

<AILabPhoto
  // Provide TFJS Model and info
  modelInfo={{
    model: myModel,
    objectDetection: true,
    labels: ['dog', 'cat'],
    threshold: 0.4,
    max: 20,
    IOU: 0.5
  }}
  // Custom box componenet
  objectDetectionComponent={MyCustomBoxComponent}
  // Restrain keeps the image inside the AILabPhoto dimensions
  // default true
  restrain={false}
  // Change the image to display exactly what the model will see as input
  // this means resizing, rechanneling etc.
  displayInputTensor
  // Run code with result
  onResult={console.log}
  // Setting the source image (not using drag/drop)
  source={someImage}
>
  <p>CUSTOM INNER CONTENT!</p>
</AILabPhoto>

SimpleExample.js

// Automatically looks at model input layer
// Adjusts incoming image to fit dims and channels
<AILabPhoto
  // Provide TFJS Model
  modelInfo={myModel}
  // Run code with result
  onResult={console.log}
/>