zoukankan      html  css  js  c++  java
  • 摇滚吧HTML5!有声前端交互!(Hello, Jsonic!)

      软件工程师们摆弄1和0编写他们的乌托邦,音乐人门把玩12平均律上的音符构筑他们的伊甸园。最近,我偶然看了《蓝色骨头》这部电影,片中的男主角是位黑客,同时又兼具音乐创作的才华。在现实生活中,这虽非典型,但也不是特例,我身边便有一些摆弄0和1的朋友,略有情调地发烧着。

      上一篇博文 摇滚吧HTML5!有声前端交互!(一) 中,我介绍了12平均律,引入了音高和时值,并谈及了其在Web Audio中的实现。按着这个节奏,连音成谱就有了曲子。借着这系列博文,我整理了下之前写的音频交互相关的Javascript框架,创作了jsonic.js。利用Jsonic.js可以实现音频可视化,语音识别,音频编码以及谱曲。本文便介绍如何利用Jsonic.js进行谱曲。

      官网 http://jsonic.net

      Jsonic的谱曲模块名为Melody,其中Note、MusicScore和Track3个类分别对应音符、乐谱和音轨的实现。具体说明文档请猛击API

      Note对象可以指定音符的唱名,时值(全音符,1/2音符,1/4音符……),音高所在字组(默认0,小字一组),是否有附点

    var note = new Jsonic.Melody.Note(1,1/2,0,true);

      MusicScore对象可以指定调式,和节拍。下面代码创建了一个E大调的,4/4拍的乐谱。

    var musicSocre = new Jsonic.Melody.MusicScore('E','major','4/4');

      通过改变musicScore的调式,可以方便的进行升降调,通过MusicScore的w方法可以向乐谱写入音符,在播放前需要调用complie方法。

    musicSocre.w(new Jsonic.Melody.Note(3),new Jsonic.Melody.Note(4));

      Track对象用来播放MusicScore对象,多个Track对象可以同时播放,和弦和声就可以利用同样的原理实现。

    var track = new Jsonic.Melody.Track();

      调用play方法播放乐谱,并且可以指定演奏的速度,参考前文所提及的时值的概念。

    track.play(musicScore,90);

      具体可以参考《直到世界尽头》的Demo, 请点击start开始播放,暴露童年了。。。Demo中还实现了对频域信号的可视化,以后会扩展出去。

      前端是一个复合型职业,作文一篇,希望同好可以共同进步。

      Giithub https://github.com/ArthusLiang/jsonic

      转发请注明出处:http://www.cnblogs.com/Arthus/p/4218572.html

  • 相关阅读:
    从源码分析 XtraBackup 的备份原理
    移动端 SDK 开发经验总结及梳理
    spring boot jar包开机自启
    在Simulink中添加VeriStand支持
    java 启动脚本
    Docker容器日志管理最佳实践
    docker 日志限制或者删除
    网盘搜索
    tuple c++
    google原版:Debugging WebAssembly with modern tools
  • 原文地址:https://www.cnblogs.com/Arthus/p/4218572.html
Copyright © 2011-2022 走看看