tripal_phylogeny.js 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. /* phylotree d3js graphs */
  2. (function ($) {
  3. "use strict";
  4. // Will be dynamically sized.
  5. var height = 0;
  6. // Store our function as a property of Drupal.behaviors.
  7. Drupal.behaviors.TripalPhylotree = {
  8. attach: function (context, settings) {
  9. // Retrieve the data for this tree.
  10. var data_url = Drupal.settings.tripal_chado.phylotree_url;
  11. $.getJSON(data_url, function(treeData) {
  12. phylogeny_display_data(treeData);
  13. $('.phylogram-ajax-loader').hide();
  14. });
  15. }
  16. }
  17. // Callback function to determine node size.
  18. var phylogeny_node_size = function(d) {
  19. var size;
  20. var tree_options = Drupal.settings.tripal_chado.tree_options;
  21. if (d.cvterm_name == "phylo_root") {
  22. size = tree_options['root_node_size'];
  23. }
  24. if (d.cvterm_name == "phylo_interior") {
  25. size = tree_options['interior_node_size'];
  26. }
  27. if (d.cvterm_name == "phylo_leaf") {
  28. size = tree_options['leaf_node_size'];
  29. }
  30. return size;
  31. }
  32. // Callback function to determine the node color.
  33. var phylogeny_organism_color = function(d) {
  34. var organism_color = Drupal.settings.tripal_chado.org_colors;
  35. var color = null;
  36. if (d.genus) {
  37. color = organism_color[d.organism_id];
  38. }
  39. if (color) {
  40. return color;
  41. }
  42. else {
  43. return 'grey';
  44. }
  45. };
  46. // Callback for mouseover event on graph node d.
  47. var phylogeny_node_mouse_over = function(d) {
  48. var el = $(this);
  49. el.attr('cursor', 'pointer');
  50. var circle = el.find('circle');
  51. // highlight in yellow no matter if leaf or interior node
  52. circle.attr('fill', 'yellow');
  53. if(!d.children) {
  54. // only leaf nodes have descriptive text
  55. var txt = el.find('text');
  56. txt.attr('font-weight', 'bold');
  57. }
  58. };
  59. // Callback for mouseout event on graph node d.
  60. var phylogeny_node_mouse_out = function(d) {
  61. var el = $(this);
  62. el.attr('cursor', 'default');
  63. var circle = el.find('circle');
  64. if(!d.children) {
  65. // restore the color based on organism id for leaf nodes
  66. circle.attr('fill', phylogeny_organism_color(d));
  67. var txt = el.find('text');
  68. txt.attr('font-weight', 'normal');
  69. }
  70. else {
  71. // restore interior nodes to white
  72. circle.attr('fill', 'white');
  73. }
  74. };
  75. // Callback for mousedown/click event on graph node d.
  76. var phylogeny_node_mouse_down = function(d) {
  77. var el = $(this);
  78. var title = (! d.children ) ? d.name : 'interior node ' + d.phylonode_id;
  79. if(d.children) {
  80. // interior node
  81. if(d.phylonode_id) {
  82. }
  83. else {
  84. // this shouldn't happen but ok
  85. }
  86. }
  87. else {
  88. // If this node is not associated with a feature but it has an
  89. // organism node then this is a taxonomic node and we want to
  90. // link it to the organism page.
  91. if (!d.feature_id && d.organism_nid) {
  92. window.location.replace(baseurl + '/node/' + d.organism_nid);
  93. }
  94. if (!d.feature_id && d.organism_eid) {
  95. window.location.replace(baseurl + '/bio_data/' + d.organism_eid);
  96. }
  97. // leaf node
  98. }
  99. };
  100. // Creates the tree using the d3.phylogram.js library.
  101. function phylogeny_display_data(treeData) {
  102. var height = phylogeny_graph_height(treeData);
  103. var tree_options = Drupal.settings.tripal_chado.tree_options;
  104. d3.phylogram.build('#phylogram', treeData, {
  105. 'width' : tree_options['phylogram_width'],
  106. 'height' : height,
  107. 'fill' : phylogeny_organism_color,
  108. 'size' : phylogeny_node_size,
  109. 'nodeMouseOver' : phylogeny_node_mouse_over,
  110. 'nodeMouseOut' : phylogeny_node_mouse_out,
  111. 'nodeMouseDown' : phylogeny_node_mouse_down,
  112. 'skipTicks' : tree_options['skipTicks']
  113. });
  114. }
  115. /* graphHeight() generate graph height based on leaf nodes */
  116. function phylogeny_graph_height(data) {
  117. function count_leaf_nodes(node) {
  118. if(! node.children) {
  119. return 1;
  120. }
  121. var ct = 0;
  122. node.children.forEach( function(child) {
  123. ct+= count_leaf_nodes(child);
  124. });
  125. return ct;
  126. }
  127. var leafNodeCt = count_leaf_nodes(data);
  128. return 22 * leafNodeCt;
  129. }
  130. })(jQuery);