- Timestamp:
- 05/27/14 21:19:28 (10 years ago)
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
SMC/trunk/SMC/src/web/scripts/js/smc-graph.js
r3815 r5300 9 9 var data_show = null; // global holder for data to show closure over nodes_sel 10 10 var nest = {}; 11 var detail_data = null; // global holder for detail-data (in html) 11 var detail_data = null; // global holder for detail-data (in html) 12 var mode = "dynamic"; // dynamic or static (default) static=load detail data all at once on init; 12 13 13 14 … … 15 16 var select_rect_min_size = 5; 16 17 var first_level_margin = 20; 18 var base_font_size = 10; 17 19 var min_circle = 4; 18 20 var max_circle = 80; 19 21 20 22 var show_count = 1; 21 var show_arrows = 0; 22 23 24 25 var detail_url = "http://localhost:8580/exist/apps/smc-browser/get.xql"; 23 26 var comp_reg_url = "http://catalog.clarin.eu/ds/ComponentRegistry/?item="; 27 var wiki_url = "http://en.wikipedia.org/wiki/"; 24 28 var mdrepo_url_search = "http://localhost:8680/exist/apps/cr-xq/mdrepo/index.html?operation=searchRetrieve&x-context=&query="; 25 29 /*http://localhost:8680/exist/apps/cr-xq/mdrepo/fcs?operation=scan&scanClause=cmd:CountryName&x-context=&x-format=htmlpage*/ … … 38 42 //var source_file = "/smc/smc-graph.d3"; 39 43 /*var source_file = "/smc/cmd-dep-graph.d3.js";*/ 40 var detail_file = " smc_stats_detail.html";41 var userdocs_file = " userdocs.html";42 43 var opts = {"graph": {"value":"/smc/data/ profiles.js",44 var detail_file = "/smc/data/smc_stats_detail.html"; 45 var userdocs_file = "/smc/docs/userdocs.html"; 46 47 var opts = {"graph": {"value":"/smc/data/smc-graph-basic.js", 44 48 "values":[{value: "/smc/data/smc-graph-basic.js", label:"SMC graph basic"}, 45 49 {value: "/smc/data/smc-graph-all.js", label:"SMC graph all"}, 46 50 {value: "/smc/data/smc-graph-profiles-datcats.js", label:"only profiles + datcats"}, 47 51 {value: "/smc/data/smc-graph-groups-profiles-datcats-rr.js", label:"profiles+datcats+groups+rr"}, 48 {value: "/smc/data/profiles.js", label:"just profiles"} 49 52 {value: "/smc/data/smc-graph-profiles-similarity.js", label:"just profiles"}, 53 {value: "/smc/data/dbpedia_philosophers_influence_years_graph.json", label:"Philosophers"}, 54 {value: "/smc/data/SC_Persons_120201_cAll_graph.json", label:"Schnitzler Cooccurrences"}, 50 55 /*, 51 56 {value: "/smc/data/smc-graph-mdrepo-stats.js", label:"instance data"}*/ … … 57 62 "charge":{"value":250, "min":10, "max":1000, "widget":"slider" }, 58 63 "friction":{"value":75, "min":1, "max":100, "widget":"slider" }, 59 "gravity":{"value": 20, "min":1, "max":100, "widget":"slider" },60 "node-size": {"value":" count", "values":["1","4","8","16","count"], "widget":"selectone" },64 "gravity":{"value":10, "min":1, "max":100, "widget":"slider" }, 65 "node-size": {"value":"4", "values":["1","4","8","16","count"], "widget":"selectone" }, 61 66 "labels": {"value":"show", "values":["show","hide"], "widget":"selectone" }, 62 "curve": {"value":"straight ", "values":["straight","arc"], "widget":"selectone" },63 "layout": {"value":" force", "values":["vertical-tree", "horizontal-tree", "weak-tree","force","dot", "freeze"], "widget":"selectone" },67 "curve": {"value":"straight-arrow", "values":["straight-line","arc-line","straight-arrow","arc-arrow"], "widget":"selectone" }, 68 "layout": {"value":"horizontal-tree", "values":["vertical-tree", "horizontal-tree", "weak-tree","force","dot", "freeze"], "widget":"selectone" }, 64 69 "selected": {"widget":"hidden" }, 65 70 "link": {"widget":"link", "label":""}, … … 112 117 var init_level = []; 113 118 data_all.nodes.forEach(function(d,i){init_level.push(+d.level);}) 114 data_all.level_min = d3.min(init_level);119 data_all.level_min = (d3.min(init_level)==d3.max(init_level)) ? (d3.min(init_level) - 1) : d3.min(init_level) ; 115 120 116 121 var init_count = []; … … 215 220 216 221 item_detail.append("a") 217 .attr("href",function (d) { if (d.type.toLowerCase()=='datcat') return d.id 222 .attr("href",function (d) { if (d.type.toLowerCase()=='datcat') return d.id 223 else if (d.type.toLowerCase()=='philosopher') return wiki_url + d.id; 218 224 else return comp_reg_url + d.id }) 219 225 .text(function (d) { return d.id }); … … 235 241 item_detail_detail = item_detail.append("div").html( 236 242 function (d) { 237 var detail_info_div = getDetailInfo(d.type.toLowerCase(), d.key );243 var detail_info_div = getDetailInfo(d.type.toLowerCase(), d.key, this); 238 244 if (detail_info_div) { 239 245 return detail_info_div … … 315 321 var ratio = w / (data_all.init_x_max - data_all.init_x_min); 316 322 var node_size_int = parseInt(opt("node-size")); 323 var font_size_int = base_font_size + (node_size_int / 2); 317 324 var link_distance = parseInt(opt("link-distance")) 318 325 … … 327 334 .gravity(parseInt(opt("gravity")) / 100 ) 328 335 329 /* .linkDistance(parseInt(opt("link-distance")))*/ 336 .linkDistance(parseInt(opt("link-distance"))) 330 337 331 .linkDistance(function(d){return link_distance / (d.weight * d.value) }) 338 /* .linkDistance(function(d){return link_distance / (d.weight * d.value) })*/ 332 339 /* Profiles: 333 334 335 .linkStrength(function(d){return d.weight})*/340 .linkStrength(function(d){return d.value}) 341 342 */ 336 343 //.charge(parseInt(opt("charge")) * -1) 337 344 … … 367 374 368 375 // Per-type markers, as they don't inherit styles. 369 if (show_arrows) { 376 377 if (opt("curve").indexOf("arrow") > -1) { 370 378 svg.append("svg:defs").selectAll("marker") 371 379 .data(["uses"]) … … 447 455 448 456 gnodes.append("title") 449 /* .text(function (d) { return d.name + ' |' + d.count + '|' })*/ 457 /* .text(function (d) { return d.name + ' |' + d.count + '|' })*/ 450 458 .text(renderItemText); 451 459 … … 466 474 .attr("x", 8) 467 475 .attr("y", ".31em") 476 .style("font-size", function(d) { 477 var fontsize = ''; 478 if (opt("node-size")=="count") 479 { fontsize = (Math.sqrt(d.count)<=min_circle) ? base_font_size : Math.sqrt(d.count) / data.node_size_ratio; 480 } 481 else { fontsize = font_size_int; } 482 return fontsize + 'px'; 483 }) 468 484 .attr("class", "shadow") 469 485 .classed("hide", opt("labels")=='hide') … … 472 488 .attr("x", 8) 473 489 .attr("y", ".31em") 490 .style("font-size", function(d) { 491 var fontsize = ''; 492 if (opt("node-size")=="count") 493 { fontsize = (Math.sqrt(d.count)<=min_circle) ? base_font_size : Math.sqrt(d.count) / data.node_size_ratio; 494 } 495 else { fontsize = font_size_int; } 496 return fontsize + 'px'; 497 }) 474 498 .classed("hide", function(d) { return !d.selected && opt("labels")=='hide'}) 475 499 .text(function(d) { return d.name; }); … … 508 532 var kx= 1.4 * e.alpha, ky = .4 * e.alpha; 509 533 data.links.forEach(function(d, i) { 510 if (d.source.level==data_all.level_min) { d.source.x = first_level_margin }; 534 //if (d.source.level==data_all.level_min) { d.source.x = first_level_margin }; 535 if (data_show.roots.indexOf(d.source.key) > -1 ) { d.source.x = first_level_margin }; 511 536 //d.target.y += (d.source.y - d.target.y) * ky; 512 537 d.target.x += (d.source.x - d.target.x + link_distance_int ) * kx; 538 //d.target.x += (d.source.x - d.target.x ) * kx; 513 539 }); 514 540 } … … 528 554 path.attr("d", function(d) { 529 555 // links as elliptical arc path segments 530 if (opt("curve") =="arc")556 if (opt("curve").indexOf("arc") > -1) 531 557 { var dx = d.target.x - d.source.x, 532 558 dy = d.target.y - d.source.y, … … 590 616 function loadDetailInfo () { 591 617 592 $(detail_info_holder_selector).load(detail_file,function(data) { 593 $(detail_container_selector).find("h3").after( 594 '<div id="detail-summary-overall" class="cmds-ui-block init-show" ><div class="header">Overview</div><div class="content">' 595 + getDetailInfo("summary", "overall") + '</div></div>'); 618 if (mode=='static') { 619 $(detail_info_holder_selector).load(detail_file,function(data) { 620 $(detail_container_selector).find("h3").after( 621 '<div id="detail-summary-overall" class="cmds-ui-block init-show" ><div class="header">Overview</div><div class="content">' 622 + getDetailInfo("summary", "overall") + '</div></div>'); 623 624 handleUIBlock($(detail_container_selector).find(".cmds-ui-block")); 625 626 // only render detail for initially selected nodes, after the detail info has been loaded 627 if (nodes_sel) { renderDetail(nodes_sel) }; 596 628 597 handleUIBlock($(detail_container_selector).find(".cmds-ui-block")); 598 599 // only render detail for initially selected nodes, after the detail info has been loaded 600 if (nodes_sel) { renderDetail(nodes_sel) }; 601 602 }); 629 }); 630 } 603 631 604 632 // loading css to store in extra variable, for later use = injecting into exported SVG … … 610 638 } 611 639 612 function getDetailInfo(type, id ) {640 function getDetailInfo(type, id, target) { 613 641 //notify("getDetailInfo: #" + type + "-" + id ); 614 var d = $(detail_info_holder_selector).find("#" + type + "-" + id ); 642 643 if (type=='philosopher') { 644 // access origin problem! 645 url = "http://localhost/smc-dev/get.php?link=" + wiki_url + id; 646 $(target).load(url + " .infobox"); 647 } else 648 if (mode=='static' ) { 649 var d = $(detail_info_holder_selector).find("#" + type + "-" + id ); 650 return d.html(); 651 } else { 652 var url = detail_url + "?type=" + type + "&id=" + id; 653 $(target).toggleClass("loading"); 654 $(target).load(url); 655 } 615 656 // notify(d); 616 return d.html();657 617 658 } 618 659 … … 722 763 */ 723 764 function highlight() { 765 //prevent endless highlight loop 766 max_depth = parseInt(opt("depth-before")) + parseInt(opt("depth-after")); 767 console.log ("max_depth:" + max_depth); 724 768 return function(d, i) { 725 769 // console.log ("fade:" + d.key); 726 var connected_subgraph_in = neighboursWithLinks(data_show, d,'in', -1); 727 var connected_subgraph_out = neighboursWithLinks(data_show, d,'out', -1); 770 //var connected_subgraph_in = neighboursWithLinks(data_show, d,'in', -1); 771 //var connected_subgraph_out = neighboursWithLinks(data_show, d,'out', -1); 772 773 var connected_subgraph_in = neighboursWithLinks(data_show, d,'in', max_depth); 774 var connected_subgraph_out = neighboursWithLinks(data_show, d,'out', max_depth); 728 775 var connected_subgraph = {"nodes": [], "links": []}; 729 776 connected_subgraph.nodes = connected_subgraph.nodes.concat(connected_subgraph_in.nodes).concat(connected_subgraph_out.nodes); … … 822 869 var neighbours = {"links_index": {}, "nodes_index": {}, 823 870 "nodes_in": {}, "nodes_out": {}, 824 "links_in": {}, "links_out": {}}; 825 826 data.nodes.forEach(function(d){ 871 "links_in": {}, "links_out": {}, 872 "roots": []}; 873 874 data.nodes.forEach(function(d){ 827 875 neighbours.nodes_index[d.key] = d; 828 876 }); 877 878 var targets=[]; 829 879 830 880 links.forEach(function(d) { 831 881 src_key = d.source.key; 832 882 trg_key = d.target.key; 883 833 884 // generate lookup hashes for neighbours; 834 885 neighbours.links_index[src_key + "," + trg_key] = d; … … 842 893 } 843 894 } 844 if (d.target) { 895 if (d.target) { 896 if (targets.indexOf(d.target.key) == -1 ) { targets.push(d.target.key); } 897 845 898 if (! neighbours.nodes_out[src_key]) { 846 899 neighbours.nodes_out[src_key] = [d.target]; … … 852 905 } 853 906 }); 907 908 data.nodes.forEach(function(d){ 909 if (targets.indexOf(d.key) == -1) 910 { neighbours.roots.push(d.key); } 911 }); 912 913 914 //if it is target, it is no root 915 916 854 917 855 918 data = $.extend(data, neighbours);
Note: See TracChangeset
for help on using the changeset viewer.