I am in the process of integrating the PhylD3 library into a Django Template.
The CSS and JS files have been integrated into the Django static directory.
However, I am unsure about the most efficient way to load the XML file in the template.
Template - phyD3.html
{% extends "base.html" %}
{% load static %}
{% block title %} Test {% endblock %}
{% block content %}
<head>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://d3js.org/d3.v3.min.js"></script>
<link rel="stylesheet" href="{% static 'css/phyd3/phyd3.min.css' %}" />
<script src="{% static 'js/phyd3/phyd3.min.js' %}"></script>
<script>
function load() {
d3.xml("sample.xml", function(xml) {
var tree = phyd3.phyloxml.parse(xml);
phyd3.phylogram.build("#phyd3", tree, {});
});
};
</script>
</head>
<body onload="load()">
<div id="phyd3"></div>
</body>
{% endblock %}
View.py
def phyd3(request):
return render(request, 'coregenome/phyD3.html')