OK I donāt know why the āPlayed noteā fails to show up there, thatās a bug.
Itās expected that the āScale degreeā would fail to appear with that chord name, because the app is expecting to find the root note of the chord at the start of the chord name. So if you renamed it to āG (rock)ā or āG5ā, then āScale degreeā would work.
But none of that should stop āPlayed noteā from working, that should not depend on determining the scale.
Alright Murray I fixed that bug (and a few other more obscure ones I noticed while testing the fix). Should be all good to go now. If you use a name like āRock Gā you still wonāt get the Scale degree, but the Played note will show up just fine and youāll get a little warning icon with a popup explaining why the scale degree is missing.
Thanks Brendan
Itās a thing of beauty.
Just FYI, Iāve recently pushed out some upgrades to my chord diagram generator, it now handles barres and chords beyond the 4th fret, for example:
It also now correctly shows accidentals as flats when thatās appropriate, at least for the major mode. Originally I went with showing all accidentals as sharps, but Iāve done a little more theory since then, and I now understand why thatās not awesome 
Still to come is showing the correct sharps/flats for minor mode, and the correct scale degree for the in-between stuff like flat seven in a dominant 7 chord, sharp five in augmented, and so on. Iāll probably have to deal with double flat and double sharp in there somewhere too.
Very nice! I have been doing something similar. My version allows you to put a little label on the chart saying what fret 1 is, if the chart needs to be up the neck somewhere. I havenāt made it export a graphic yet. My next steps will be to make the chart clickable. I think it will be easier for users than using drop-down select elements. (feel free to do this with yours!) I am struggling to make the chord sound nicely when you click a āstrumā button. Javascript events are just not fast enough or able to be synchronised. However, my version works ā¦ sort of. If you have a better (non-JS) solution Iād love to see it and hear how you did it (if you ever do.) Cheers, Andy
I actually already have that feature, in my own particular way
Yes I agree, that would be a better UI design. I considered doing that, but in the end I wasnāt motivated enough. If I was going to do it, I would probably make it an interactive SVG that the user can drag-and-drop the finger symbols around. No idea how you would handle a barre in that kind of setup, though.
I never even thought about trying to do this. I already have a machine for producing the sound of the chord ā itās called a guitar! 
Cheers for the comments Andy 
Cool. You are a better coder than I am. Iām making progress with a simple mouse click event on the chord chart, but Iām not trying to make barres or put finger symbols on. Just dots. I want it to play a sound so that it could play chords that are actually impossible or very difficult to finger, ā¦ and just for fun! Cheers, Andy
Could you use āstandardā numbers for the frets? The Roman numerals youāre using could get confusing as they are used to identify chords in a chord progression.
Ok. Keep that for your own use. Donāt post stuff like that here. Learning guitar is difficult enough! This is a guitar tuition site. Not a computer programmer experiment site. 
Ha ha. True. Thanks! Andy
Iāll bet this because you are trying to use sine waves (and, no, I donāt mean a Fourier seriesā¦). Record a single string plucked and look at the waveform - it is NOT a sinusoid. The initial attack is little different than the decaying state as well. I think Iād record 6 open strings, then translate them up in frequency as needed by fretting the chord - that may sound good enough.
Well yes, but that isnāt the issue. The issue is how to make a web page play (up to) six sound files (WAV or MP3) simultaneously, in synchrony, on any browser. As you saidā¦ this is a bit off-topic for guitarists. I succeeded in making each synthesised āstringā WAV file play the right note, but making them all play at the same time in Javascript is beyond me at the moment.
Sorry everyone! I love Justinās guitar tutorials! He is my go-to tutor! Just ignore this geeky thread, unless you are a bit of a geek yourself.
Cheers,
A
geeky is ok in a few places.
add the string waveforms together into one waveform, normalize, then play it. Shouldnāt take long on a reasonable client.
Thatās a fair point Gordon. I honestly hadnāt considered that. I just like roman numerals in general, and I have seen guitars with roman numerals on the fingerboard inlays, and thought it looked pretty cool ā¦ and that was the entirety of my thought process on the matter!
I might tweak it so you can choose which number system you want for the frets, and make it default to arabic numerals.
Thanks for the suggestion!
OK thatās done now
This generator looks great.
A suggestion; could you add the scale degree for each note to the diagram, maybe at the bottom? I find this helpful when looking at chord diagrams to help me see how the chord is formed. The root could either be ārā or ā1ā and the others numbered or as e.g. b5 (flat 5).
Very nice, and very cool. Iām a former developer who has moved into the data space, primarily the cloud, and Python is all over the place.
Brilliant work, I really appreciate how easy it is to use, and functional too! Could you add a way that we could create a chart with all of the chords that we would like to have on it? I could always use the downloaded images and edit them into a Word document, but that would take a lot of time and trial and error. Just a suggestionā¦
Thanks for those kind words, mate!
I did originally plan on building a feature to produce multiple chord diagrams laid out onto a PDF. As I thought more about how that would work out in practice, I decided not to pursue it.
Sticking a bunch of images on a grid into a PDF is not difficult, the problem is every user would want that PDF to look slightly different. Portrait/landscape, paper size, diagram size, number of rows/columns, amount of spacing between the cells, so on and so forth. I would spend so much time coding up all those different options, it would be quicker for me (any everyone else) to just plonk their diagrams into a document editor and lay them out as suits their own taste.
I used Google Docs for mine, it ended up looking like this
Youāre welcome to copy my chord book doc and customise it for your own needs if that helps
Thank you for sharing.
