Idea to Code

アイデアをコードへ
独学でプログラミング関係にいろいろ手を出すサイト

hawk

JavaScript

Clarifaiを利用した人工知能デモ その22017/08/11

Clarifaiを使って人工知能のデモを作ってみた。

4種類の画像で解析を行えるように改良。


【対象画像】



【解析結果】

clarifai-ai-2.js
const img = $("#img");
const field = $("#field");
const select_tag = $("#select_img");

const app = new Clarifai.App({
  apiKey: 'f4e2e5ffe87c472883962a126db5401d'
});

function execute(file){
  app.models.predict({id: Clarifai.GENERAL_MODEL,language: 'ja'}, file).then(
    function(response) {
      var datas = response.outputs[0].data.concepts;
      output_datas(datas);
    },
    function(err) {
      console.error(err);
    }
  );
}

function set_img(file){
  if(file === "no"){
    img.attr("src", "");
  }else{
    img.attr("src", file);
  }
}

select_tag.on('change', function(){
  var img_file = "http://ideatocode.jp/JavaScript/clarifai-ai-2/" + $(this).val();

  set_img("no");
  output_datas("no");

  if($(this).val() !== "default"){
    set_img(img_file);
    execute(img_file);
  }
});

function output_datas(d){
  var str = "";
  if(d !== "no"){
    str = d[0].name;
    for(var i=1; i<d.length; i++){
      str += ", " + d[i].name;
    }
  }
  field.text(str);
}

select_tag.val("default");