javascript for rendering abc music notation

What is this?

Turn this:


				

				

					
Into this:

					

					

				

			

			
What, you ask, is ABC Music Notation?
There are lots of explanations around the web. Here's a good place to start.

		


		

			
Why might I need this?

			

			

			
This library is for a web designer or a web programmer who wants to display standard music notation on their website.
				It can also be used for generating MIDI in the browser.

				

			

				

					
You just need the barest familiarity with JavaScript to make it work.

					

			

		


		

			
How do I use this?

			

				

					

					
Basic Usage

					

					

					
☞Demo
					

				

				

					

					
Music Editor

					
					

					

					☞Demo
					

				

				

					

					
Existing Sites

					
					

					

					☞Demo
					

				


				

					

					
More Examples

					
Here is an ever-growing list of examples of common uses.

					

					
				


				

					

					
Documentation

			
The documentation will show you all the details about including this on your website.

					

					
				


				

					

					
Configuring

			
There are lots of options for how to configure abcjs. To help you get started, see the example generator. (work in progress)

					

					
				


				

					

					
Online music editor

					
And here's an application that uses the editor that you are welcome to use if you just want to
						write music and not worry about all this javascript stuff.

					

					
				


				

					

					
Transcription Tools

					
There is also a site maintained by Michael Eskin that has lots of functionality, with more coming every day!

					

					
				

			

		


		

			
Which one do I need?

			

				

			
Packaged Method

			

				☞If you are using a system that includes a package.json file, then you can simply install abcjs the way you normally would:

					
npm install -D abcjs
			

				


				

			
Minimized Method

					
☞For use with a <script> tag:

			
The abcjs libraries come in two flavors:

			
    
				
  • abcjs basic: Call the library from javascript, passing the abc string to it, or allow the user to type the music in a textarea.
    • 
				
  • abcjs plugin: Adds onto a webpage, rendering all ABC it finds.
    • 
			

				


				

					

						
Plugins

						
☞For use in Obsidian or VSCode, check out the plugin for that package.

					

				


				

			
Add In

			
☞If you already have ABC notation on your page and don't want to modify the page more than you have to, then you can use abcjs-plugin, which will render all ABC that it finds on the page on page load, simply by including one line: the line to include the script. This can also be useful if you allow user comments and you want users to be able to add ABC in a comment.

				

		


		

			
Where do I get this?

			


			

				
Github

			
The project is hosted on Github. Go there for all technical information about the project.

			


			

				
npm

			
To install with npm: npm install -D abcjs

				
To use: 
import abcjs from "abcjs";

abcjs.renderAbc(...)

			


			

				

				
<script>

			
If you are not using a build package and want to include the minimized scripts directly on your page, click on this to download the latest version:

				

				
			


			

				

				
Plugin

				
To interpret ABC strings on an existing webpage, download this and include it on your webpage:

				

				
			

			

		


		

			
Can I use this in my own site?

			

			
Yes!

			

			

				We hope you find this library useful and we'd like to see you use it on your own site, whether it is personal, community, or commercial software.



	It is available under the MIT license.
				If you have a problem with this license, please ! I'm sure we can work something out.
			

			

				Here it is:
			

			
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.