Phylogeny viewer plugin

The echinopscis project builds on Obsidian for taxonomic research, so a phylogeny viewer plugin would be a useful addition. All the pieces seem to exist, its just a case of wiring them up - this page explains how the plugin was developed and how you can download and install it.

Obsidian core - code blocks

First lets look at what Obsidian has in its core architecture, that we can build on.

Obsidian content is written in markdown, and includes a formatting instruction called code blocks. These are portions of text enclosed within three backticks.

```
This text is in a code block
```

This is rendered as:

This text is in a code block

The original use case for code block formatted text was to display snippets of programming code - you supply the code and state what language it is in, and when the code block is rendered you get syntax highlighting which makes the code more readable.

```python
print("Hello")
```

This is rendered as:

print("Hello")

More advanced code blocks - displaying diagrams

Code blocks have been extended to work with text instructions that specify how a diagram should be rendered. Obsidian has core support for a markdown based diagramming language called mermaid

```mermaid
graph LR
Specimens --> Sequences
```

This is rendered as:

A phylogeny viewer

We’ve built on these foundations to create a phylogeny viewer for Obsidian. Its a plugin that adds newick and nexus format code blocks, which are rendered with the phylotree.js tree visualisation library.

```newick
(((Thinouia_obliqua, Thinouia_mucronata), (Thinouia_restingae, Thinouia_cf._mucronata)),(((Thinouia_sp., Thinouia_myriantha),Thinouia_trifoliata),Thinouia_cazumbensis))
```

This is rendered as:

Adding interactivity

As well as displaying the phylogeny, the visualisation is interactive - clicking on a leaf node will execute a search across all the pages in your vault for the name associated with the node. If you click on an intermediate node, the search includes all children under that node - giving you phylogenetic search across your taxonomic notes and specimens.

Display options

You can specify the height and width of the visualisation in the first line of the code block, if required.

```
height=600,width=400
(((Thinouia_obliqua, Thinouia_mucronata), (Thinouia_restingae, Thinouia_cf._mucronata)),(((Thinouia_sp., Thinouia_myriantha),Thinouia_trifoliata),Thinouia_cazumbensis))
```

Try it out

You can install the plugin from: github.com/echinopscis/obsidian-phylotree-plugin

1. Download the zip file named “phylotree-plugin.zip” attached to the latest release
2. Unzip into the .obsidian/plugins directory under your Obsidian vault
3. Reload your vault
4. Enable the plugin - open the settings pane, click “community plugins” in the left hand menu, find the “phylotree plugin” entry in the list of installed plugins and move the slider to enable it.

5. Try it out - create a phylo code block:

   1. Switch page to edit mode (Ctrl+e)
   2. Define a newick format code block with a simple tree:

       ```newick
       (A,B,(C,D)E)F;
       ```
       

   3. Switch back to view mode (Ctrl+e) to see the tree rendered

Get in touch

If you have problems using the plugin or ideas for new features - please create an issue in the issue tracker for the phylo viewer plugin. More general ideas about echinopscis development can be added on the discussion board.

Thanks

Thanks to the developers of phylotree.js, and to the core and third party plugin developers in the Obsidian community for their documentation resources.