me/breccia-mapper
1
0
Fork 0
mirror of https://github.com/Southampton-RSG/breccia-mapper.git synced 2026-03-03 11:27:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add button to hide organisations from graph

Browse Source
This commit is contained in:
James Graham
2021-05-12 19:37:46 +01:00
parent c57392e83c
commit 1ea2c5448b
2 changed files with 33 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
people/static/js/network.js
View File

@@ -2,6 +2,10 @@
// Global reference to Cytoscape graph - needed for `save_image`
var cy;
var hide_organisations = false;
var organisation_nodes;
var organisation_edges;
var network_style = [
{
selector: 'node[name]',
@@ -44,6 +48,21 @@ function save_image() {
saveAs(cy.png(), 'graph.png');
}
/**
* Hide or restore organisations and relationships with them.
*/
function toggle_organisations() {
hide_organisations = !hide_organisations;
if (hide_organisations) {
organisation_nodes.remove();
organisation_edges.remove();
} else {
organisation_nodes.restore();
organisation_edges.restore();
}
}
/**
* Populate a Cytoscape network from :class:`Person` and :class:`Relationship` JSON embedded in page.
*/
@@ -80,11 +99,13 @@ function get_network() {
data: {
id: 'organisation-' + item.pk.toString(),
name: item.name,
kind: 'organisation',
nodeColor: '#669933',
nodeShape: 'rectangle'
}
})
}
organisation_nodes = cy.nodes('[kind = "organisation"]');
// Load relationships and add to graph
var relationship_set = JSON.parse(document.getElementById('relationship-set-data').textContent);
@@ -97,6 +118,7 @@ function get_network() {
id: 'relationship-' + relationship.pk.toString(),
source: 'person-' + relationship.source.pk.toString(),
target: 'person-' + relationship.target.pk.toString(),
kind: 'person',
lineColor: {
'organisation-membership': '#669933'
}[relationship.kind] || 'grey',
@@ -120,6 +142,7 @@ function get_network() {
id: 'organisation-relationship-' + relationship.pk.toString(),
source: 'person-' + relationship.source.pk.toString(),
target: 'organisation-' + relationship.target.pk.toString(),
kind: 'organisation',
lineColor: {
'organisation-membership': '#669933'
}[relationship.kind] || 'black',
@@ -131,6 +154,7 @@ function get_network() {
// This is probably because it's been filtered out
}
}
organisation_edges = cy.edges('[kind = "organisation"]');
// Optimise graph layout
var layout = cy.layout({

10
people/templates/people/network.html
View File

@@ -65,7 +65,15 @@
{% endbuttons %}
</form>
<button class="btn btn-block btn-info mb-3" onclick="save_image();">Save Image</button>
<div class="row">
<div class="col-md-4">
<button class="btn btn-block btn-info mb-3" onclick="save_image();">Save Image</button>
</div>
<div class="col-md-4">
<button class="btn btn-block btn-info mb-3" onclick="toggle_organisations();">Toggle Organisations</button>
</div>
</div>
<div id="cy"
class="mb-2"