用纯 JS 播放音乐(乐谱)

2014-11-03 22:27:25 +08:00
 unity0703
花了半天时间写了个javascript乐谱播放器(不支持IE):
http://blog.maxee.info/simplesheetmusic/example_cn.html

目前音色不太好(今天改进了一下已经好多了),正在考虑加入钢琴音色和和弦的支持(对音色合成没有一点概念,头疼啊 -_-|||)

水平有限,只是为了好玩,欢迎吐槽

Just 4 fun
8711 次点击
所在节点    分享创造
31 条回复
lizheming
2014-11-03 22:33:58 +08:00
那些频率楼主是怎么知道的!!好强大!
unity0703
2014-11-03 22:36:36 +08:00
@lizheming 有点基础乐理的人都知道啊,标准音(中音la)是440hz,一个八度频率翻倍,半音阶乘2的1/12次方(1.059463)
est
2014-11-03 22:39:20 +08:00
chrome v31表示没法工作。。。。。(我是老古董)
zava
2014-11-03 22:39:21 +08:00
lz 好创意, 如果能模拟几种乐器, 那就可以整成一首歌了!
14
2014-11-03 22:39:57 +08:00
Coooooooooooool~
lizheming
2014-11-03 22:40:50 +08:00
@unity0703 OwQ OK,以后我要自称音盲了T_T,哭瞎...
unity0703
2014-11-03 22:40:57 +08:00
@est 应该是浏览器比较老,我的chrome版本 38.0.2125.111 测试没问题
unity0703
2014-11-03 22:45:14 +08:00
@lizheming 知道点基础就行了,我乐理也不是很好,因为学过电子琴,所以略懂,其实音色才是真正复杂的地方...关于原理,可以看看我的文章 http://blog.maxee.info/2014/11/01/play-music-with-pure-js/
MrMign
2014-11-03 22:45:22 +08:00
好流逼
loooooost
2014-11-03 22:47:05 +08:00
都是audio啊 试试这个 http://watilde.github.io/beeplay/
unity0703
2014-11-03 22:51:59 +08:00
@loooooost 这个音色好多了,其实模拟音色是最复杂的部分
unity0703
2014-11-03 22:58:55 +08:00
@zava 好像已经有人实现了, https://github.com/meenie/band.js
jakwings
2014-11-03 22:59:23 +08:00
好像 beeplay
https://github.com/watilde/beeplay
其实刚进来我以为是读乐谱图片……
ETiV
2014-11-03 23:07:00 +08:00
http://mudcu.be/midi-js/

LZ可以研究一下这个. 直接播 MIDI.
SoloCompany
2014-11-03 23:12:54 +08:00
safari 也没兼容

[Error] TypeError: Not enough arguments
start (simpleSheetMusic.js, line 193)
start (simpleSheetMusic.js, line 193)
addtunecolor (simpleSheetMusic.js, line 216)
(匿名函数) (simpleSheetMusic.js, line 267)
play_sheet_music (simpleSheetMusic.js, line 277)
play (simpleSheetMusic.js, line 287)
play_notes (example_cn.html, line 20)
demo_func3 (example_cn.html, line 48)
onclick (example_cn.html, line 115)
wsph123
2014-11-03 23:14:34 +08:00
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_5) AppleWebKit/600.1.17 (KHTML, like Gecko) Version/7.1 Safari/537.85.10

Safari 不能播放, Chrome 没问题 OAQ 这个好棒
crs0910
2014-11-03 23:16:17 +08:00
setTimeout 在切换到别的 Tab 时会....
unity0703
2014-11-03 23:16:38 +08:00
@SoloCompany 呃,没有safari,我稍后测试一下
ETiV
2014-11-03 23:25:23 +08:00
[
['C4',1],['D4',1],['E4',1],['F4',1],
['G4',1],['G4',1],['G4',0.5],['F4',0.5],['E4',0.5],['0',0.5],
['F4',1],['F4',1],['F4',0.5],['E4',0.5],['D4',0.5],['0',0.5],
['C4',1],['E4',1],['G4',1],['0',1],
['C4',1],['D4',1],['E4',1],['F4',1],
['G4',1],['G4',1],['G4',0.5],['F4',0.5],['E4',0.5],['0',0.5],
['F4',1],['F4',1],['F4',0.5],['E4',0.5],['D4',0.5],['0',0.5],
['C4',1],['E4',1],['C4',1],['0',1],
['A4',1],['A4',1],['A4',0.5],['G4',0.5],['F4',0.5],['0',0.5],
['G4',1],['G4',1],['G4',0.5],['F4',0.5],['E4',0.5],['0',0.5],
['F4',1],['F4',1],['F4',0.5],['E4',0.5],['D4',0.5],['0',0.5],
['C4',1],['E4',1],['G4',1],['0',1],
['A4',1],['A4',1],['A4',0.5],['G4',0.5],['F4',0.5],['0',0.5],
['G4',1],['G4',1],['G4',0.5],['F4',0.5],['E4',0.5],['0',0.5],
['F4',1],['F4',1],['F4',0.5],['E4',0.5],['D4',0.5],['0',0.5],
['C4',1],['E4',1],['C4',1],['0',1]
]

来段谱子...最简单的...
unity0703
2014-11-03 23:46:55 +08:00
@ETiV 洋娃娃和小熊跳舞 (=@__@=)

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/143732

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX