Text measurement and SVG
In my spare time I’m working on long-needed program for engraving Gregorian chant. (“Engraving” is to music what “typesetting” is for text.) Below are the requirements I’ve been designing around:
- Produces print-quality output from a text input format
- in a format that can be embedded into common desktop publishing solutions like Adobe InDesign
- Multi-platform (either web-based or runs on Win/Mac/Linux)
My current plan is to write the app in JS, provide output in SVG, and deploy over the web. I have a mockup/prototype of the SVG I’d like to produce:
There is one major hurdle I haven’t figured out yet: I don’t know how to position the text. The positioning of Gregorian chant is very precise: the first neume (note) of each syllable is placed over the center of the vowel of the syllable. In addition, the spacing of neumes is arranged so that there are precise amounts of whitespace between each element and syllable, and hyphens between syllables are lengthened or shortened as necessary to fit. What is the best way to give a web application precise text measurement of individual letters within a syllable (including any kerning and ligatures)?
Ideally I’d like a way to do this with the user’s own fonts, but if I need to preprocess a font file to get metrics out of it, I guess that’s ok too.
Dear lazyweb, can somebody verify that Adobe InDesign/Quark/your favorite DTP program imports my sample SVG file correctly and usably? I don’t have a copy at the moment, and it’s rather expensive just for an import test…
January 24th, 2008 at 4:46 pm
I can verify that your SVG loads correctly in Illustrator CS3 – I don’t have InDesign, but it’s a good guess that it would use the same lib.
January 24th, 2008 at 6:05 pm
Does this help?
http://mxr.mozilla.org/seamonkey/source/dom/public/idl/svg/nsIDOMSVGTextContentElement.idl
January 24th, 2008 at 6:29 pm
Have you tried lilypond? It outputs svg and supports gregorian chant.
January 24th, 2008 at 7:20 pm
roc, yes, that might help indeed.
Anonymous, lilypond chant lyrics are not aligned correctly and the markup is tedious to author. I could probably jump into lilypond and try to fix it, but I think it would be simpler to write a domain-specific program (and you wouldn’t have to install anything)!
January 24th, 2008 at 9:36 pm
I can verify that your sample image does *not* display correctly when this posting is viewed through Planet Mozilla. :)
January 25th, 2008 at 12:26 pm
Hey Ben! It looks good in Inkscape 0.45.1. I guess I should say that it looks the same as it does in Firefox 2.
We have InDesign CS3 on another computer in the lab– I can check it later if you want. However, the version
in the syndication feed got screwed up for me too. I’m using Google Reader in Firefox.
So I’m guessing the choir you’re directing is going to be doing some chanting?
(Say hi to Suz, Micah and the girls for me!)
February 5th, 2008 at 2:12 am
I have used OpusTeX in the past and found it decent and workable, although I’ve had some folks complain about the ugliness of the fonts. (I think they meant Computer Modern Roman for the text, not the neumes themselves.)
Anyhow, just wanted to say I’m glad someone is working on this. OpusTeX is not quite ideal, especially for those who don’t know TeX, and sadly Lilypond doesn’t do chant well at all.
February 9th, 2008 at 3:37 pm
I’m one of the authors of SVG.
What you want for precise text placement is SVG fonts. In fact you probably want to use them for the symbols as well.
Problem is that none of the free-browser SVG viewers support that feature yet.
Batik supports SVG fonts, as does Adobes IE plugin. Expect browsers to support it soon enough, I mean, when you have paths, and you have text semantics, you have all the code you need to support SVG fonts.
February 10th, 2008 at 9:59 pm
How do SVG fonts help? I mostly know what fonts (type 1) I want… what I didn’t know is the precise kerning information for that font… but the SVG text measurement API does what I need… I’ll have some prototype code up shortly.
August 11th, 2008 at 1:52 am
I’ve been working on a desktop app for notating chant for some time now. After developing a font (Caeciliae) for quality chant notation, I just found that the actually layout gets really tedious with fonts. Changing margins or texts sizes alone requires re-layout of a whole piece. I explored lilypond for some time, but it’s architecture is just not ideal for chant notation.
The position of neumes relative to their texts is certainly one of the trickier problems: accurate text measurements are essential, but then there is automatic joining of syllables (dropping the hyphenations when text elements allow), checking for dipthongs (luckily syllabification of Latin is pretty easy), etc. Throw in the fact that chant can have multiple text tracks per neume (for example, for hymns), and layout just gets even more complex.
A web solution would be great, so I hope you continue. I’m currently writing in C# and hoping to target multi-platforms through the Mono project.
July 13th, 2010 at 9:41 pm
Here’s a bump to an old thread! I like your idea of generating SVG.
The TeX-based software ‘Gregorio’ (http://home.gna.org/gregorio) does the alignment of neumes to vowels pretty well, so you may be able to find some solutions to that issue by examining their code.
For what it’s worth, I recently launched a web interface so that users can produce simple gregorio output without installing the software (or LaTeX) locally: see http://gregorio.gabrielmass.com .