ml5.js入门二(介绍)+featureExtractor特征提取器

一 ,ml5.js是什么

ml5.js 它是基于Tensorflow.js的一个非常简便易用的接口,目的是让更广泛的受众更容易使用机器学习。(结合官网食用)

其他知识点索引点这里

FeatureExtractor特征提取器

您可以使用神经网络来识别图像的内容。大多数情况下,您将使用在大型数据集上训练的“预训练”模型将图像分类为一组固定的类别。但是,您也可以使用预训练模型的一部分:features。这些功能允许您为新的自定义任务“重新训练”或“重用”模型。这被称为迁移学习。

此类允许您通过预先训练的模型提取图像的特征,并使用新数据重新训练该模型。

classification识别视频里面的是个什么东西demo
<html>

<head>
  <meta charset="UTF-8">
  <title>Image classification using MobileNet and p5.js</title>
  
  <script src="../p5.min.js"></script>
  <script src="../ml5.js"></script>
</head>
<!-- 特征提取器 -->
<body>
  <!-- <h1>Image Regression using Feature Extraction with MobileNet. Built with p5.js</h1>
  <h2>(Train a Neural Network to move the red square)</h2>
  <div id="videoContainer"></div>
  <h6><span id="modelStatus">Loading base model...</span> | <span id="videoStatus">Loading video...</span></h6>
  <p>
    <input type="range" name="slider" id="slider" min="0.01" max="1.0" step="0.01" value="0.5"                             />
  </p>
  <br />
  <p>
    <button id="addSample">Add Sample</button>
    </p><p><span id="amountOfSamples">0</span> Sample Images</p>
  

  <br />
  <p><button id="train">Train</button><span id="loss"></span></p>
  <br />
  <p>
    <button id="buttonPredict">Start predicting!</button><br />
  </p>
  <script src="./script.js"></script>
-->

<button onclick="add()">add</button>
<button onclick="train()">train</button>
<button onclick="classify()">classify</button>
<script src="./script2.js"></script>
</body>

</html>
let video
let classifier

function setup() { // p5自动调用
  createCanvas(340, 280);
  // Create a video element
  video = createCapture(VIDEO);
  video.hide();
  // 创建特征提取器
  // 可以使用的模型“MobileNet”、“Darknet”和“Darknet-tiny”、“DoodleNet”,或在 Teachable Machine 中训练的任何图像分类模型,或者导入自己的训练集
  const featureExtractor = ml5.featureExtractor('MobileNet', modelLoaded);

  // 模块加载成功
  function modelLoaded() {
    console.log('Model Loaded!');
  }

  // 创建一个分类器 (视频,回调函数)会调浏览器的摄像头(谷歌浏览器会有权限localhost/127.0.0.1或者https证书的才能调用摄像头)
  classifier = featureExtractor.classification(video, videoReady);

  // Triggers when the video is ready
  function videoReady() {
    console.log('The video is ready!');
  }

 
}
function add() {
   // 添加要你要预测的视频中的物品('物品名',回调函数)
   classifier.addImage('man',()=>{
    console.log("train ok");
  });
}
function train() {
  // 训练
  classifier.train((lossValue) => {
    console.log('Loss is', lossValue);
  });
}
function classify() {
  // 得到预测的训练结果集
  classifier.classify((err, result) => {
    console.log(result); // Should output 'man'
  });
}
function draw() {// p5自动不断调用
  // 显示视频内容
  image(video, 0, 0, 340, 280);
}

运行效果
在这里插入图片描述
首先点击add按钮添加训练集
然后点击train按钮训练
然后点击classify按钮识别视频中的物品是个什么
可以看出控制台输出men的概率为1(100%)

你还可以添加不同的训练集

classifier.addImage('woman',()=>{
    console.log("train ok");
  });
  classifier.addImage('dog',()=>{
    console.log("train ok");
  });

如果你想你可以导出你的训练集,提供下次使用


classifier.save(?callback, ?name);//回调函数,名字
classifier.load(input,callback)//加载源,回调函数

下面是一个regression demo

<html>

<head>
  <meta charset="UTF-8">
  <title>Image classification using MobileNet and p5.js</title>
  
  <script src="../p5.min.js"></script>
  <script src="../ml5.js"></script>
</head>
<!-- 特征提取器 -->
<body>
  <h1>Image Regression using Feature Extraction with MobileNet. Built with p5.js</h1>
  <h2>(Train a Neural Network to move the red square)</h2>
  <div id="videoContainer"></div>
  <h6><span id="modelStatus">Loading base model...</span> | <span id="videoStatus">Loading video...</span></h6>
  <p>
    <input type="range" name="slider" id="slider" min="0.01" max="1.0" step="0.01" value="0.5"                             />
  </p>
  <br />
  <p>
    <button id="addSample">Add Sample</button>
    </p><p><span id="amountOfSamples">0</span> Sample Images</p>
  

  <br />
  <p><button id="train">Train</button><span id="loss"></span></p>
  <br />
  <p>
    <button id="buttonPredict">Start predicting!</button><br />
  </p>
  <script src="./script.js"></script>


<!-- <button onclick="add()">add</button>
<button onclick="train()">train</button>
<button onclick="classify()">classify</button> -->
<!-- <script src="./script2.js"></script> -->
</body>

</html>
let featureExtractor;
let regressor;
let video;
let loss;
let slider;
let samples = 0;
let positionX = 140;

function setup() {
  createCanvas(340, 280);
  // Create a video element
  video = createCapture(VIDEO);
  // Append it to the videoContainer DOM element
  video.hide();
  // Extract the features from MobileNet
  featureExtractor = ml5.featureExtractor("MobileNet", modelReady);
  // Create a new regressor using those features and give the video we want to use
  regressor = featureExtractor.regression(video, videoReady);
  // Create the UI buttons
  setupButtons();
}

function draw() {
  image(video, 0, 0, 340, 280);
  noStroke();
  fill(255, 0, 0);
  rect(positionX, 120, 50, 50);
}

// A function to be called when the model has been loaded
function modelReady() {
  select("#modelStatus").html("Model loaded!");
}

// A function to be called when the video has loaded
function videoReady() {
  select("#videoStatus").html("Video ready!");
}

// Classify the current frame.
function predict() {
  regressor.predict(gotResults);
}

// A util function to create UI buttons
function setupButtons() {
  slider = select("#slider");
  // When the Dog button is pressed, add the current frame
  // from the video with a label of "dog" to the classifier
  select("#addSample").mousePressed(function() {
    regressor.addImage(slider.value());
    select("#amountOfSamples").html((samples += 1));
  });

  // Train Button
  select("#train").mousePressed(function() {
    regressor.train(function(lossValue) {
      if (lossValue) {
        loss = lossValue;
        select("#loss").html(`Loss: ${loss}`);
      } else {
        select("#loss").html(`Done Training! Final Loss: ${loss}`);
      }
    });
  });

  // Predict Button
  select("#buttonPredict").mousePressed(predict);
}

// Show the results
function gotResults(err, result) {
  if (err) {
    console.error(err);
  }
  if (result && result.value) {
    positionX = map(result.value, 0, 1, 0, width);
    slider.value(result.value);
    predict();
  }
}

。。。。。。
本节就到这里

就先写到这里吧 下一篇 KNNClassifier最邻近结点算法

需要源码找我就行了haha

  • 3
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值