Data can be visualized using d3js using either the d3xquery module [/srophe/d3xquery/index.html] or using the SPARQL module [/srophe/sparql/index.html].

This module can be used out of the box on your TEI data. It operates on your tei:relation elements and expects the relationship types to be defined in the @ref attribute. Example: <relation xmlns="http://www.tei-c.org/ns/1.0" ref="syriaca:EpistolaryReferenceTo" active="http://syriaca.org/person/51 http://syriaca.org/person/2531" passive="http://syriaca.org/person/3041"/>

Visualizations such as bar charts, pie charts and bubble graphs work best on a query over all relationships, where as the Force Graph and Sankey are great for visualizing relationship types.

http://localhost:8080/exist/apps/srophe/d3xquery/index.html

This is experimental code, but could easily be abstracted to use on a record page. Code is fully contained in the /srophe/d3xquery directory and uses XQuery to parse and pass the TEI relationship data to the JavaScript functions. JavaScript is based on the http://github.com/ktym/d3sparql/ library.

D3js can also be used with the application's SPARQL module. See more here