Skip to content
GitLab
Commit 2d1f5c8e authored by maxchaza's avatar maxchaza
Browse files

Ducumentation

parent bd981be3
Expand all Hide whitespace changes
Inline Side-by-side
resources/lib/functions/GraphCaption.js
View file @ 2d1f5c8e
/**
* @class metExploreD3.GraphCaption
* Drawing caption
* Add update convexhulls
* @author MC
* (a)description : Drawing caption
* @uses metExploreD3.GraphNode
* @uses metExploreD3.GraphUtils
*/
metExploreD3.GraphCaption = {
/*****************************************************
......@@ -443,6 +448,7 @@ metExploreD3.GraphCaption = {
/*****************************************************
* Maj caption for convex hulls
* @param {String} panel Panel to update convex hull
*/
majCaption : function(panel){
var s_GeneralStyle = _metExploreViz.getGeneralStyle();
......@@ -567,6 +573,9 @@ metExploreD3.GraphCaption = {
/*****************************************************
* Maj caption color for convex hulls and links
* @param {Object} components Component to update
* @param {"Compartments"|"Pathways"} selectedComponent
* @param {String} panel Panel to update convex hull
*/
majCaptionColor : function(components, selectedComponent, panel){
var generalStyle = _metExploreViz.getGeneralStyle();
......@@ -621,7 +630,8 @@ metExploreD3.GraphCaption = {
},
/*****************************************************
* Draw caption of metabolic compartiments
* Draw caption of metabolic compartments
* @fires afterColorCalculating
*/
colorMetaboliteLegend : function(){
// Load user's preferences
......@@ -653,6 +663,7 @@ metExploreD3.GraphCaption = {
/*****************************************************
* Draw caption of pathways
* @fires afterColorCalculating
*/
colorPathwayLegend : function(){
......
resources/lib/functions/GraphColorScaleEditor.js
View file @ 2d1f5c8e
/**
* @class metExploreD3.GraphColorScaleEditor
* @author Maxime Chazalviel
* (a)description : Style Edition
* Manage the scale editor of colors
*/
metExploreD3.GraphColorScaleEditor = {
/**
* @property {Function} colorRange d3.scaleLinear()
* @property {Object} values
* @property {Array} colorDomain
* @property {Array} color
* @property {Function} xScale d3.scaleLinear()
* @property {Function} scaleXInPercent d3.scaleLinear()
* @property {Function} scalePercentInX d3.scaleLinear()
* @property {Object} button
* @property {Object} delButton
* @property {Number} textfieldValue
* @property {Number} valueMin
* @property {Number} valueMax
* @property {Number} selectedValue
* @property {Function} scaleValueInPercentCaption d3.scaleLinear()
* @property {Function} scalePercentInValueCaption d3.scaleLinear()
* @property {Array} colorRangeInit
* @property {Object} valuesInit
* @property {Array} colorDomainInit
* @property {Number} valueMinInit
* @property {Number} valueMaxInit
*/
colorRange: undefined,
values: undefined,
colorDomain: undefined,
......@@ -29,6 +52,14 @@ metExploreD3.GraphColorScaleEditor = {
valueMinInit: undefined,
valueMaxInit: undefined,
/**
*
* @param svg
* @param width
* @param height
* @param margin
* @param scaleRange
*/
createColorScaleCaption : function(svg, width, height, margin, scaleRange){
var me = this;
......@@ -140,6 +171,17 @@ metExploreD3.GraphColorScaleEditor = {
})
},
/**
*
* @param svg
* @param width
* @param height
* @param margin
* @param but
* @param textfieldValue
* @param delButton
* @param scaleRange
*/
createColorScaleEditor : function(svg, width, height, margin, but, textfieldValue, delButton, scaleRange){
var me = this;
me.svg=svg;
......@@ -285,6 +327,9 @@ metExploreD3.GraphColorScaleEditor = {
me.update();
},
/**
*
*/
reset : function(){
var me = this;
me.colorRange = me.colorRangeInit.slice(0);
......@@ -297,6 +342,11 @@ metExploreD3.GraphColorScaleEditor = {
me.update();
},
/**
*
* @param val
*/
updateValues : function(val){
var me = this;
var indexVal = me.selectedValue-1;
......@@ -350,11 +400,24 @@ metExploreD3.GraphColorScaleEditor = {
}
}
},
/**
*
* @param indexVal
* @param theLinearGradient
* @param deltaX
*/
updateLinearGradient : function(indexVal,theLinearGradient, deltaX){
this.values.splice(indexVal, 1, this.scalePercentInValueCaption(this.round(this.scaleXInPercent(d3.event.x+deltaX))));
theLinearGradient
.attr("offset", this.round(this.scaleXInPercent(d3.event.x+deltaX))+"%");
},
/**
*
* @param color
* @param svg
*/
updateColor : function(color, svg){
if(isNaN(this.selectedValue)){
......@@ -373,9 +436,20 @@ metExploreD3.GraphColorScaleEditor = {
this.update();
}
},
/**
*
* @param operation
* @return {number}
*/
round : function(operation){
return Math.round((operation) * 100) / 100;
},
/**
*
* @param svg
*/
addColor : function(svg){
var me = this;
......@@ -393,6 +467,10 @@ metExploreD3.GraphColorScaleEditor = {
me.update();
},
/**
*
*/
delColor : function(){
var me = this;
if(me.values.length>2)
......@@ -406,6 +484,10 @@ metExploreD3.GraphColorScaleEditor = {
me.update();
}
},
/**
*
*/
update : function(){
var me = this;
var svg = me.svg;
......@@ -537,6 +619,11 @@ metExploreD3.GraphColorScaleEditor = {
},
/**
*
* @return {[]}
*/
getScaleRange: function(){
var me = this;
......
resources/lib/functions/GraphFunction.js
View file @ 2d1f5c8e
/**
* @class metExploreD3.GraphPanel
* Basic graph functions
*
* Hierarchical drawing algorithm
* Distance algorithm
* Extraction algorithm
* Cycle detection algorithm
* Alignment function
*
* @author MC
* (a)description : Basic graph functions
* @uses metExploreD3.GraphNode
* @uses metExploreD3.GraphNetwork
* @uses metExploreD3.GraphStyleEdition
* @uses metExploreD3.GraphLink
*/
metExploreD3.GraphFunction = {
/*****************************************************
......@@ -216,7 +227,7 @@ metExploreD3.GraphFunction = {
/**
* Breadth First Search
* @param node
* @param {NodeData} node
* @returns {*|Graph}
*/
bfs : function (node){
......@@ -327,7 +338,7 @@ metExploreD3.GraphFunction = {
/**
* Highlight sinks in visualisation
* @param panel
* @param {String} panel
*/
highlightSink : function(panel) {
var nodes=d3.select("#"+panel).select("#D3viz").selectAll("g.node");
......@@ -359,7 +370,7 @@ metExploreD3.GraphFunction = {
/**
* Highlight sinks in visualisation
* @param panel
* @param {String} panel
*/
highlightSource : function(panel) {
var nodes=d3.select("#"+panel).select("#D3viz").selectAll("g.node");
......@@ -391,7 +402,7 @@ metExploreD3.GraphFunction = {
/**
* Allows horizontal alignment of selected nodes
* @param panel
* @param {String} panel
*/
horizontalAlign : function(panel) {
var nodes = _metExploreViz.getSessionById(panel).getSelectedNodes();
......@@ -428,7 +439,7 @@ metExploreD3.GraphFunction = {
/**
* Allows vertical alignment of selected nodes
* @param panel
* @param {String} panel
*/
verticalAlign : function(panel) {
var nodes = _metExploreViz.getSessionById(panel).getSelectedNodes();
......@@ -465,7 +476,7 @@ metExploreD3.GraphFunction = {
/**
* Inverse x axis position of selected nodes from them median x
* @param panel
* @param {String} panel
*/
horizontalReverse : function(panel) {
metExploreD3.GraphNode.fixSelectedNode();
......@@ -500,7 +511,7 @@ metExploreD3.GraphFunction = {
/**
* Inverse y axis position of selected nodes from them median y
* @param panel
* @param {String} panel
*/
verticalReverse : function(panel) {
metExploreD3.GraphNode.fixSelectedNode();
......@@ -540,9 +551,10 @@ metExploreD3.GraphFunction = {
colorDistanceOnNode : function(graph, func){
var networkData = _metExploreViz.getSessionById('viz').getD3Data();
var maxDistance = 0;
for (var key in graph.nodes) {
var dist = graph.nodes[key].distance;
if(maxDistance<dist)
for (var key in graph.nodes) {
var dist = graph.nodes[key].distance;
if(maxDistance<dist)
maxDistance=dist;
networkData.getNodeById(key).distance = dist;
}
......@@ -552,7 +564,7 @@ metExploreD3.GraphFunction = {
.range(["blue", "white"]);
d3.select("#viz").select("#D3viz").select("#graphComponent").selectAll("g.node")
d3.select("#viz").select("#D3viz").select("#graphComponent").selectAll("g.node").selectAll("rect:not(.fontSelected)")
.style("fill", function(node) { return color(node.distance); });
if(func!=undefined){
......@@ -560,6 +572,9 @@ metExploreD3.GraphFunction = {
}
},
/**
* POC : Color nodes in function of graph distances
*/
test3 : function(){
var networkData = _metExploreViz.getSessionById('viz').getD3Data();
......@@ -594,27 +609,17 @@ metExploreD3.GraphFunction = {
metExploreD3.GraphFunction.colorDistanceOnNode(finalGraph);
});
},
testFlux : function(){
var networkData = _metExploreViz.getSessionById('viz').getD3Data();
var color = d3.scaleLinear()
.domain([0, 0.1, 0.2, 0.5, 1])
.range([-30, -50, -60,-500 -600]);
metExploreD3.getGlobals().getSessionById('viz').getForce().charge(function(node){
var value = d3.select('g#node'+node.getId()+'.node').attr('opacity');
var val = color(value);
return val;
});
},
/**
* POC : Color nodes in function of graph distances
*/
test : function(){
var networkData = _metExploreViz.getSessionById('viz').getD3Data();
d3.select("#viz").select("#D3viz").select("#graphComponent").selectAll("g.node")
.on("click", function(node){
console.log("test");
metExploreD3.GraphFunction.colorDistanceOnNode(metExploreD3.GraphFunction.bfs(node));
});
},
......@@ -622,6 +627,7 @@ metExploreD3.GraphFunction = {
/*******************************************
* Hierarchical drawing of the current tulip network
* It uses the default algorithm provided by Tulip.js
* @deprecated
*/
hierarchicalDrawingTulip : function(){
var algo = "Hierarchical Tree (R-T Extended)";
......@@ -633,6 +639,7 @@ metExploreD3.GraphFunction = {
/*******************************************
* Sugiyama (OGDF) drawing of the current tulip network
* It uses the default algorithm provided by Tulip.js
* @deprecated
*/
sugiyamaDrawing : function(){
var algo = "Sugiyama (OGDF)";
......@@ -646,6 +653,7 @@ metExploreD3.GraphFunction = {
/*******************************************
* Betweenness Centrality of the current tulip network
* It uses the default algorithm provided by Tulip.js
* @deprecated
*/
betweennessCentrality : function(){
var algo = "Betweenness Centrality";
......@@ -658,6 +666,7 @@ metExploreD3.GraphFunction = {
/*******************************************
* Layout drawing application provided by the tulip.js library
* @deprecated
*/
applyTulipLayoutAlgorithmInWorker : function(algo, parameters) {
......@@ -792,6 +801,7 @@ metExploreD3.GraphFunction = {
/*******************************************
* Algorithms provided by the tulip.js library
* @deprecated
*/
applyTulipDoubleAlgorithmInWorker : function(algo, parameters) {
......@@ -940,25 +950,13 @@ metExploreD3.GraphFunction = {
}
},
drawNetwork : function() {
},
randomDrawing : function() {
},
// Force based drawing
// Use the arbor version of the algorithm provided by
// Cytoscape
// If there are more than maxDisplayedLabels,then the
// animation is not used
stopSpringDrawing : function() {
},
/**
* Extract a subnetwork based on lightest path length
* between each pair of selected nodes it returns a graph
* where nodes have a subnet attribute telling wether they
* are in subnet or not
* @param {Graph} graph Network structure
* @param {Array} nodeToLink Array of node ids
*/
extractSubNetwork : function(graph, nodeToLink) {
var session = _metExploreViz.getSessionById('viz');
......@@ -1140,7 +1138,10 @@ metExploreD3.GraphFunction = {
}
},
/**
* Build Directed graph from visualisation
* @return {Graph}
*/
getGraph : function() {
var session = _metExploreViz.getSessionById( 'viz');
var graph = new Graph();
......@@ -1183,6 +1184,10 @@ metExploreD3.GraphFunction = {
return graph;
},
/**
* Build Not Directed graph from visualisation
* @return {Graph}
*/
getGraphNotDirected : function() {
var session = _metExploreViz.getSessionById( 'viz');
var graph = new Graph();
......@@ -1207,10 +1212,15 @@ metExploreD3.GraphFunction = {
return graph;
},
// Once the shortest path is computed, we have, for each
// node on the path its predecessor
// It is necessary to go backward in order to get the right
// path
/**
* Once the shortest path is computed, we have, for each
* node on the path its predecessor
* It is necessary to go backward in order to get the right path
* @param {Graph} graph
* @param {Number} nodeJid
* @return {any[]}
*/
getPathBasedOnPredecessors : function(graph, nodeJid) {
var path = new Array();
// get the path from I to J
......@@ -1242,6 +1252,7 @@ metExploreD3.GraphFunction = {
/**
* Hihglight nodes and edges belonging to a subnetwork
* @param {Array} nodeToLink Array of node ids
*/
keepOnlySubnetwork : function(nodeToLink) {
var session = _metExploreViz.getSessionById('viz');
......@@ -1376,6 +1387,7 @@ metExploreD3.GraphFunction = {
/**
* Hihglight nodes and edges belonging to a subnetwork
* @param {Array} nodeToLink Array of node ids
*/
highlightSubnetwork : function(nodeToLink) {
var session = _metExploreViz.getSessionById('viz');
......@@ -2662,4 +2674,4 @@ metExploreD3.GraphFunction = {
});
return result;
}
}
\ No newline at end of file
};
\ No newline at end of file
resources/lib/functions/GraphLink.js
View file @ 2d1f5c8e
/**
* @author MC
* Links drawing
*
* Links initialization
* Add, update and remove links
* Tick of links
* Drawing functions for links
* Add, update and remove links convex hull (to refactor in other file)
*
* @uses metExploreD3.GraphUtil
* @uses metExploreD3.GraphStyleEdition
......
resources/lib/functions/GraphMapping.js
View file @ 2d1f5c8e
This diff is collapsed.
resources/lib/functions/GraphNetwork.js
View file @ 2d1f5c8e
......@@ -1332,6 +1332,7 @@ metExploreD3.GraphNetwork = {
/*******************************************
* Refresh the graph data, it generate graph visualization
* @param {String} panel : The panel to refresh
* @throws error in function
*/
refreshViz : function(panel){
var mask = metExploreD3.createLoadMask("Draw graph", panel);
......
resources/lib/functions/GraphNode.js
View file @ 2d1f5c8e
/**
* @author MC
* Nodes drawing
*
* Node Events and Interactions initialisation
* Add, update and remove nodes
* Tick of nodes
* Search and highlight nodes
*
* @uses metExploreD3.GraphLink
* @uses metExploreD3.GraphPanel
......
resources/lib/functions/GraphNumberScaleEditor.js
View file @ 2d1f5c8e
/**
* @class metExploreD3.GraphColorScaleEditor
* @author Maxime Chazalviel
* (a)description : Style Edition
* Manage the scale editor of numbers
*/
metExploreD3.GraphNumberScaleEditor = {
......
resources/lib/functions/GraphPanel.js
View file @ 2d1f5c8e
......@@ -304,6 +304,7 @@ metExploreD3.GraphPanel = {
* Fill the data models imported from JSON file
* @param {Object} json JSON to load
* @param {Function} endFunc Callback function
* @fires loadNetworkBiosource jsoninit initiateviz sideCompound jsonmapping reloadMapping closeMapping
* @private
*/
loadDataJSON : function(json, endFunc){
......@@ -586,6 +587,7 @@ metExploreD3.GraphPanel = {
* Fill the data models with the store reaction
* @param {Object} json JSON to load
* @param {Function} func Callback function
* @fires loadNetworkBiosource jsoninit jsonmapping
* @private
*/
initDataJSON : function(json, func){
......@@ -724,6 +726,7 @@ metExploreD3.GraphPanel = {
/*****************************************************
* Initialization of visualization
* @param {String} vizEngine : library used to make the visualization
* @fires initiateviz
* @private
*/
initiateViz : function(vizEngine) {
......
resources/lib/functions/GraphStyleEdition.js
View file @ 2d1f5c8e
......@@ -2,6 +2,10 @@
* @class metExploreD3.GraphStyleEdition
* Style Edition
*
* Manage label edition mode
* Manage image mapping
* Generic functions to set elements styles
*
* @author Adrien Rohan
*
* @uses metExploreD3.GraphLink
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment