AI人工智能ml5.js在线实现图片变卡通图像，照片变卡通图像

本文链接：https://blog.csdn.net/kongzhonghu/article/details/126737850

一直以来都在寻找能直接通过网页js实现人工智能应用的例子，今天果然找到了一个通过使用ml5.js这个js库是针对tensorflow.js的封装能最大限度的屏蔽tensorflow的细节，直接应用于Ai的生产实践，今天就分享一个通过ml5.js实现任意图片变卡通图像的例子，最终的成品是在浏览器当中即可实现一张图片变成卡通图像。

效果图给大家看一下：

这是原图：

这是效果图，图片尺寸也是可以在程序中指定的，效果还是非常传神的。

在线演示地址：AI人工智能ml5.js在线实现图片变卡通图像，照片变卡通图像 (mubanmao.top)

因为AI执行是在本地浏览器中执行的，可能速度有点慢，稍微等待一分钟即可。
index.html

<html lang="en">
  <head>
    <title>在线生成卡通图像</title>
    
    <script src="p5.min.js"></script>
    <script src="p5.dom.min.js"></script>
    <script src="p5.sound.min.js"></script>
    
    <script src="ml5.min.js" type="text/javascript"></script>
  </head>

  <body>
    <script src="sketch.js"></script>
  </body>
</html>

sketch.js

let cartoonGan;
let img;
let newImage;
function preload(){
  img = loadImage('894d79bdf2b1c6ae55898a543f4dade1.jpeg');
}

function setup(){
  createCanvas(160, 160);

  cartoonGan = ml5.cartoon("./model/model.json",modelLoaded)
  image(img, 0,0, width, height)
}

function modelLoaded(){
  cartoonGan.generate(img, gotResults)
}

function gotResults(err, result){
  if(err){
    return;
  }
  console.log(result)
  image(result.image, 0,0, 160, 160);
    
}

代码并不复杂，功能却很强大。