【问题标题】:Face_Detector_Model of Clarifai Api in react projectReact 项目中 Clarifai Api 的 Face_Detector_Model
【发布时间】:2021-01-16 00:40:09
【问题描述】:

任何人都可以帮助我,如何使用 clarifai api 的人脸检测模型来检测多个人脸。我已经创建了这样的 App.js。

const app = new Clarifai.App({
  apiKey: 'my_api_key'
});
class App extends React.Component {
  constructor(){
    super();
    this.state = {
      input: '',
      imageUrl: '',
      box: {},
    }
  }
  calculateFaceLocation = (response) => {   
    let width;
    let height;
    let clarifaiFace;
    response.outputs[0].data.regions.forEach(function differentfaces(item){
      clarifaiFace = item.region_info.bounding_box;
      const image = document.getElementById('inputImage');
      width = Number(image.width);
      height = Number(image.height);
    });
      return {
        leftCol: clarifaiFace.left_col * width,
        topRow: clarifaiFace.top_row * height,
        rightCol: width - (clarifaiFace.right_col * width),
        bottomRow: height - (clarifaiFace.bottom_row * height),
      }
  }

  displayFaceBox = (box) => {
    this.setState({box: box});
  }

  onInputChange = (event) => {
    this.setState({input: event.target.value});
  }

  onButtonSubmit = () => {
    this.setState({imageUrl: this.state.input});
    app.models
      .predict(
        Clarifai.FACE_DETECT_MODEL,
        this.state.input      
      )
      .then(response => this.displayFaceBox(this.calculateFaceLocation(response)))
      .catch(err => console.log(err));
  }

  render() {
    return (
            <div className="App">
             <Particles className='particles' params={particlesOptions} />
              <Navigation />
              <Logo />
              <Rank />
              <ImageLinkForm onInputChange={this.onInputChange} onButtonSubmit={this.onButtonSubmit} />
              <FaceRecognition box={this.state.box} imageUrl={this.state.imageUrl} /> 
            </div>
    );
  }

}

export default App;

clarifai api人脸检测模型链接:https://www.clarifai.com/models/face-detection-image-recognition-model-a403429f2ddf4b49b307e318f00e528b-detection

【问题讨论】:

    标签: javascript reactjs clarifai


    【解决方案1】:

    Clarifai 支持在这里。可以换个试试吗

    FACE_DETECT_MODEL
    

    FACE_DETECTION_MODEL
    

    这可能就像语法错误一样简单。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-05-07
      • 2022-12-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多