Archive for the ‘Arts’ category
OTNT Graphic Development slideshow
July 6th, 2011
OT/NT Refs: Development log, entry #4
July 6th, 2011
Completed
- Added book names/labels (reversed orientation and set justification=”right” when angle < 90 or > 270)
- Added chapter ticks (first chapter + every 10th chapter)
- Added think black border around book arc
- Reduced thickness of link lines (from 2pt to 1pt)
- Added buffer between link line ends and book arcs (“var innerBuffer = 5″)
- Added allusion links and possible allusion links (both are dashed; wider dashes = possible allusion) [display of allusions and possible allusions are managed via a boolean variable for each setting]
To Do — cumulative
In priority order:
Add book labels- Fix intermediate point calculation
- Add interactivity [to do what?]
- Add columns for each chapter (why?)
Add the allusion links and possible [allusion] linksSet up correct Z-order(handled by order of function calls)
OT/NT Refs: Development log, entry #3
July 4th, 2011
Completed
- Added all the direct quotation links
- Fixed the link lines (now they point to the correct location (based on the chapter of the reference) on the arc, not the first point)
- Added some color (a little different than in my first post, but same groupings) to the links;
- Shrank the arc depth;
- Expanded the size of the whole graphic.
To Do
Same as in in my first dev log entry plus:
- Fix the intermediate point calculation for the arcs (see how they bunch up unnaturally and too often go on the wrong side of the center point when they should stay on the same side of the center point);
- Add the allusion links (dashed? dotted?) and possible links (thinner line?)
- Set up the correct Z-order for the links
Performance
Size: 66 books + 306 links/lines.
It takes about 3 seconds to load/draw on Safari and around 4 seconds on Firefox. It won’t run on Chrome (“XMLHttpRequest cannot load file:…. Cross origin requests are only supported for HTTP.”).
OT/NT Refs: Development log, entry #2
July 4th, 2011
Added some random links to test where I should set the “through” point — at 2r/3, 1r/3, 7r/8, or some other value (notice the grey circles in the graphic at those settings). Suggestions?
Paper.js — SVG with JavaScript
June 29th, 2011“Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas. It offers a clean Scene Graph / Document Object Model and a lot of powerful functionality to create and work with vector graphics and bezier curves, all neatly wrapped up in a well designed, consistent and clean programming interface.”
I think this is the perfect platform for building my interactive OT/NT reference map app. I’ve bounced between Java (Batik), Processing, static images, and even Flash (which I don’t know, so would have to learn), but none of them really gave me the simplicity and flexibility that Paper.js has.
More info to come… Stay tuned…
