CocosCreator集成TensorFlow实现手写识别

数字识别画板

Git地址: https://yaoooqi.coding.net/public/DrawingBoard/DrawingBoard/git/files
运行时需要远程加载model.json和model.bin

• tensorflowjs使用部分是从网上抄的, 忘了出处了

• 画板用Graphics组件实现

  • 将绘制的图像用camera截屏
  • 以RGBA8888格式存储到RenderTexture中
  • 将RenderTexture存储的图像像素数据翻转Y轴 (默认是反过来的)
  • 然后转成Uint8ClampedArray, 并把新像素数组缩放到28*28
  • 放入tensorflowjs中predict, 得到0-9每个数字的相似度, 取最高即可

• tensorflowjs集成在assets/scripts/plugin/tensorflow文件夹下

• 环境配置

  • brew :
    • /usr/bin/ruby -e “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)”
  • yarn :
    • brew install yarn
  • 模型导出 :
    • cd ./TF_Model_Export/mnist
    • yarn
    • yarn watch
    • 执行训练,训练完成后提示下载模型
  • webserver :
    • cd ./WebServer
    • npm install http-server -g
    • npm i http-server
    • http-server
  • python (可选) :
    • pip3 install tensorflow
    • pip3 install keras
    • pip3 install matplotlib
    • pip3 install Pillow
    • pip3 install tensorflowjs

• 预览
  Chrome跨域:

  open -a /Applications/Google\ Chrome.app --args --disable-web-security --user-data-dir
  

  使用cocos creator打开DrawingBoard,预览即可