Processing js, making svg fonts and your server setup.
I had some trouble getting fonts to work in Processing and then more trouble when I posted the files to my Blog. I finally got it all working so this might save you some time.
Stuff you need:
- A True Type font, e.g Arial.ttf
- Batik TTF to SVG Convertor
- Possibly need access to either your servers httpd.conf or mime.types for .svg mime-type
If you have all this, you are going to get it working. 
First off, put the ttf font you want to convert in the directory where you extracted Batik & pull up a terminal and cd to it.
Type: java -jar ttf2svg.jar myFont.ttf -o myFont.svg
Replacing the myFont with your font. The result should be myFont.svg, great!!!. Copy it to your working Processing dir.
In your Processing setup function add the lines:
font = loadFont
var myFont = loadFont("myFont.svg");
textFont(myFont, 12);
Test it and see if you like it, if not repeat the process with another font. Go ahead and upload to your server and test live.
Looks good, ? yes : no;
For a quick test to see if your server supports svg head over to http://web-sniffer.net/ and type the path to your svg font in the box and hit submit. On return, look down to the HTTP Response Header table and look @ the content-type. If it says anything other than image/svg+xml or at least something with svg in it, you need to do this next step.
This is the part that got me and where you need access to the server config files I listed above. If you do not, you need to contact your sys admin or service provider and tell them you need support for svg files. If you do, edit either the httpd.conf or mime.types file “depends on your server setup” and add the line:
AddType image/svg+xml .svg
or
Content-Type: image/svg+xml
again it depends on what flavor of Apache or whatever you have. You can Google your setup and find out.
Restart your server and you should be good to go. Happy Processing!
Trackbacks & Pingbacks