#50 (Selective) Visualization Tools

[Danny Weltman]

I don't really need this, at least not as I currently use Hypernomicon, since I personally do not use visualization tools for myself, and I don't have most of the stuff I teach entered into Hypernomicon, so this wouldn't help me for my teaching (at least right now). It would also probably be a bunch of work to add. But I can imagine it being useful for other people, and even for me once I fill out my database with everything and thus once I have stuff I'm liable to teach entered into Hypernomicon.

It would be cool to generate mind maps, charts/trees, and so on to illustrate some subset of the data in my Hypernomicon database. For instance, let's say I'm teaching metaethics and I want to give my students something like this chart: https://theholydark.files.wordpress.com/2012/08/metaethics.jpg

I could select the "metaethics" node on my tree, and select all the debates under it, and all the main positions under those debates. Then I could hit "export" and get a tree like this, or even better, a series of HTML files along with the tree, such that clicking on each position/debate/whatever in the tree takes you to an HTML file with the relevant description from my Hypernomicon database. And maybe I could check or uncheck a box that said "include linked works" and if I did that the export would also send along the relevant PDFs and links to them, and so on. This could very quickly allow someone to generate in a few minutes a full set of notes and readings for an entire course on any topic they have in their database, ready to upload to a web directory and share with students.

Again, for me this is not the sort of thing I'd use right now or for a while, and if I did it would only be for teaching. But other people might find it super useful for sharing their notes with others, or for teaching, or for visualizing their ideas in some other ways. I think the two main exports it would be nice to have would be charts like the one I linked above, and mind maps, which as far as I can tell basically are just charts but with the parent node in the middle. (I don't know a lot about visualizations.) Maybe there are other visualization forms that it would be cool to output. Even just outputting the some portion of the tree with HTML links to the relevant records would be useful perhaps.

[Stephen Mann]

I guess if exporting the subset of XML nodes is as simple as it seems, then the effort here will be all in the design. A little googling reveals various 3rd-party programs that can convert simple syntaxed files into flowcharts, e.g. Graphviz and Freeplane.

A first step might be for someone (not necessarily Jason) to write a minimal converter, from Hypernomicon's XML to something these other programs understand. I'm not saying I can definitely do this, but if I do, I will report the results.

[Stephen Mann]

Another lightweight option that reads JSON is the GoJS Block Editor.

[Stephen Mann]

OK, here is a first attempt at getting positions into the block editor: https://github.com/stephenfmann/hypernomicon2gojs

It puts all the blocks in default positions, so you have to drag them around yourself to make the arrows clearly visible. But constraining the number of records you include in the XML file, plus a bit more clever guessing in the Python, should help.

[Stephen Mann]

Update: the script now retains the locations and sizes of boxes and arrows that the user has manipulated via the HTML interface.

I plan to enable distinct diagrams per Problem/Debate. So each Debate can have its own mindmap, which you can tweak in the UI, and then when new positions/arguments are added to the debate it will retain the changes you've made.

As I work on this I am coming up with various useful additions. Feel free to try it out and raise issues in the GitHub.

[Jason Winning]

It is amazing how similar the output looks to Danny's mockup. If there is a tool like GoJS that will also position the shapes for you, I think we will be in business!

Note: I tried running the code with different data but it seems to presuppose an existing minimal JSON and HTML file template. It throws exceptions if the files aren't there already. I'm not sure about the HTML other than it needs a "textarea" tag to be present, but the minimal JSON it needs is the following:

{
"class": "GraphLinksModel",
"nodeDataArray": [],
"linkDataArray": []
}

[Stephen Mann]

Good point. I have refined the script and trimmed the repository down, so you just need the two included files: convert.py and blockEditorTemplate.html.

Add your own Debates, Positions and Arguments files, and it will create JSON files and blockEditor.html as required.

I'll have a look at solutions that automatically locate boxes and arrows. But the good news is that you can move and resize the boxes in the browser, then save the JSON, which the python script will respect the next time you create a mindmap with the same debate ID.