9

is there an equivalent of JSFiddle or Markdown for music notation? That would be useful for posting fragments of notation into StackExchange questions, as well as other blogs/wikis/webpages. math.stackexchange.com does something similar with MathJax for equations.

1
  • 4
    If you are asking about it for this site then this is a meta question (and discussed most recently here meta.music.stackexchange.com/questions/2188/… ); This would be a good question for the main site if you're asking in general about approaches to enable music markup in websites, but, to me, it's not clear from the wording of this question that that is what you are asking about.
    – Dave
    Jun 6, 2015 at 11:59

2 Answers 2

6

ABCjs is a Javascript library implementing ABC notation. The source code and documentation are available on GitHub.

You can find a great deal of information on ABC notation itself on the ABC homepage, in particular, the ABC standard.

SE Music Practice and Theory supports ABCjs.

X:1
T:Spiffy Example
K:none
M:4/4
L:1/4
c/4 | c4 |]
w:ta | da! |]

Additionally, you can use an external editor, with a newer version of the library, to write things out.

1
2

My VexFlow is the closest thing I can think of to being "JSFiddle for music notation". You need to create an account before using the site, but it's free and lets you create notation snippets that are then hosted on the site and can be viewed by anyone you give the link to.

In general, it's more geared toward writing articles with notation examples embedded (it supports Markdown syntax for text), but it works just fine for standalone music snippets too. It uses VexTab as the format for entering music, which can display both Western notation and guitar tablature.

I've put together a simple example named What's the name of this tune? to demonstrate what the end result might look like.

3
  • The links appear to be broken.
    – tripleee
    Mar 4, 2020 at 9:53
  • My understanding is that Vex is writing the actual notes in JavaScript? ABC would be more like Markdown, in comparison. Feb 16, 2021 at 15:13
  • @AlenSiljak The equivalent of ABC or Markdown here would be VexTab, as a human-friendly input format. The rendering engine VexFlow can consume VexTab so it's not necessary to write any Javascript (unless you want to or need to, for advanced usage).
    – hopper
    Feb 16, 2021 at 17:37

Not the answer you're looking for? Browse other questions tagged or ask your own question.