Code Monkey home page Code Monkey logo

stringanmt's Introduction

StringAnmt

一个在web开启你的摄像头,然后将视频处理成字符串的动画的简单封装库。   这里是demo

  • 快速使用:
<canvas id="cvs"></canvas>
<video id="vdo" style="display:none"></video>
<script src="StringAnmt.js"></script>
<script>
var StrAnmt = new StringAnmt({
    videoId: 'vdo',
    canvasId: 'cvs',
    text: ['    ', '氵', '水', '淼'],
    fontSize: '18'
});
StrAnmt.openCamera(
    window.screen.width,
    window.screen.height,
    false
)
</script>
  • StringAnmt参数说明

    • videoIdvideo标签的id;
    • canvasIdcanvas标签的id;
    • text:想要渲染成动画的字符串或数组,从左到右是黑到白,不推荐字母、数字、汉字混编,尽量选用字符宽度差不多的字符,以免输出失真;
    • fontSize:字符大小,字符串类型;
    • color: 输出的字符颜色
  • StringAnmt方法:

    • openCamera(width,height,isAudio):开启摄像头
      • width: 摄像头宽度
      • height: 摄像头高度
      • isAudio: 是否开启麦克风
    • play():播放
    • pause():暂停
    • playAndPause():若是播放状态则暂停,若是暂停状态则播放(可用于截图)

注意事项,

  • 请放在本地或者https协议的服务器里,这样方能开启摄像头。
  • 请在高版本浏览器下使用
  • 不对ff做兼容
  • 拒绝IE,从我坐起

stringanmt's People

Contributors

char-ten avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.