Class Biojs.InteractionsD3

Version 0.9.0_alpha.

Extends Biojs.

Defined in: Biojs.InteractionsD3.js.

Class Summary
Constructor Attributes	Constructor Name and Description
	Biojs.InteractionsD3(options) This component uses the D3 library and specifically its implementation of the force algorithm to represent a network of protein interactions.

Field Summary
Field Attributes	Field Name and Description
<inner>	eventTypes Array containing the supported event names
<inner>	opt Default values for the options

Method Summary
Method Attributes	Method Name and Description
	addInteraction(proteinId1, proteinId2, extraAtributes) Adds an interaction between 2 proteins that are already in the graphic using their IDs
	addProtein(protein) Adds a protein to the graphic
	constructor(options)
	getInteraction(proteinId1, proteinId2) gets the interaction object by the id of its proteins
	getInteractionIndex(proteinId1, proteinId2)
	getProtein(proteinId) gets the protein object by its id
	hide(selector) Hides the elements on the graphic that match the selector.
	hideLegend(protein) Shows/Hide the legend(id) of the protein
	highlight(selector) Highlight the elements on the graphic that match the selector.
	removeInteraction(proteinId1, proteinId2) removes from the graphic the interaction by the id of its proteins
	removeProtein(proteinId, excludelist) removes a protein from the graphic with all the interactions unless the interactor is also interacting with another protein that is visible.
	resetGraphic() Resets the graphic to zero proteins zero interactions
	restart() Restart the graphic to materialize the changes don on it(e.g.
	setColor(selector, color) Set the stroke's color of the elements on the graphic that match the selector.
	setFillColor(selector, color) Set the fill's color of the elements on the graphic that match the selector.
	show(selector) Shows the elements on the graphic that match the selector.
	showLegend(protein, typeLegend) Shows/Hide the legend(id) of the protein
	swapFixed(protein) If the protein has a fixed position in the graphic it gets released, or viceversa other wise
	swapShowLegend(protein) Shows/Hide the legend(id) of the protein

Methods borrowed from class Biojs:: addListener, extend, getId, listen, raiseEvent, setEventHandlers, setOptions

Event Summary
Event Attributes	Event Name and Description
	interactionClick(actionPerformed)
	interactionMouseOver(actionPerformed)
	proteinClick(actionPerformed)
	proteinMouseOver(actionPerformed)

Class Detail

Biojs.InteractionsD3(options)

This component uses the D3 library and specifically its implementation of the force algorithm to represent a network of protein interactions.
Author: Gustavo A. Salazar.

			var instance = new Biojs.InteractionsD3({
				target: "YourOwnDivId",
			});	
			var pid=1;
			instance.addProtein({id:'p'+pid++,group:1});
			instance.addProtein({id:'p'+pid++,group:1});
			instance.addProtein({id:'p'+pid++,group:1});
			instance.addInteraction("p"+(pid-1),"p"+(pid-2),{id:"p"+(pid-1)+"_p"+(pid-2),feature1:"value"});
			instance.restart();

Parameters:
{Object} options: An object with the options for the InteractionsD3 component.

Options detailed:
{string} target: Identifier of the DIV tag where the component should be displayed.

Requires:: jQuery Core 1.7.2; D3; InteractionsD3 CSS

Field Detail

<inner> eventTypes

Array containing the supported event names

<inner> opt

Default values for the options

Method Detail

addInteraction(proteinId1, proteinId2, extraAtributes)

Adds an interaction between 2 proteins that are already in the graphic using their IDs

instance.addInteraction("p"+(pid-1),"p"+(pid-2),{id:"p"+(pid-1)+"_p"+(pid-2),feature1:"new"});
instance.restart();

Parameters:
{string} proteinId1: Id of the first protein in the interaction
{string} proteinId2: Id of the second protein in the interaction
{Object} extraAtributes Optional, Default: {}: An object containing meta information of the interaction to be stored in the interaction itself. useful for triggered events

addProtein(protein)

Adds a protein to the graphic

instance.addProtein({id:'p'+pid++,group:2});
instance.restart();

Parameters:
{Object} protein: An object containing information of the protein

constructor(options)

Parameters:
options

{Object} getInteraction(proteinId1, proteinId2)

gets the interaction object by the id of its proteins

instance.getInteraction('p1','p3');

Parameters:
{string} proteinId1: The id of the first protein
{string} proteinId2: The id of the second protein

Returns:: {Object} An object containing information of the interaction

getInteractionIndex(proteinId1, proteinId2)

Parameters:
proteinId1
proteinId2

{Object} getProtein(proteinId)

gets the protein object by its id

instance.getProtein('p3');

Parameters:
{string} proteinId: The id of the protein

Returns:: {Object} protein An object containing information of the protein

hide(selector)

Hides the elements on the graphic that match the selector. Check the CSS3 selectors documentation to build a selector string

instance.hide("[id = node_p"+(pid-1)+"]");

Parameters:
{string} selector: a string to represent a set of elements. Check the CSS3 selectors documentation to build a selector string

hideLegend(protein)

Shows/Hide the legend(id) of the protein

instance.swapShowLegend("#node_p"+(pid-1)+" .legend");

Parameters:
{string} protein: the id of the protein to swap the visibility of the legend

highlight(selector)

Highlight the elements on the graphic that match the selector. Check the CSS3 selectors documentation to build a selector string

instance.highlight("[id = node_p"+(pid-1)+"]");

Parameters:
{string} selector: a string to represent a set of elements. Check the CSS3 selectors documentation to build a selector string

removeInteraction(proteinId1, proteinId2)

removes from the graphic the interaction by the id of its proteins

instance.removeInteraction('p2','p3');

Parameters:
{string} proteinId1: The id of the first protein
{string} proteinId2: The id of the second protein

removeProtein(proteinId, excludelist)

removes a protein from the graphic with all the interactions unless the interactor is also interacting with another protein that is visible.

instance.removeProtein('p2');

Parameters:
{string} proteinId: The id of the protein to delete
excludelist

resetGraphic()

Resets the graphic to zero proteins zero interactions

instance.resetGraphic();

restart()

Restart the graphic to materialize the changes don on it(e.g. add/remove proteins)

instance.restart();

setColor(selector, color)

Set the stroke's color of the elements on the graphic that match the selector. Check the CSS3 selectors documentation to build a selector string

instance.setColor("[id = node_p"+(pid-1)+"]","#FF0000");

Parameters:
{string} selector: a string to represent a set of elements. Check the CSS3 selectors documentation to build a selector string
{string} color: a color in web format eg. #FF0000

setFillColor(selector, color)

Set the fill's color of the elements on the graphic that match the selector. Check the CSS3 selectors documentation to build a selector string

instance.setFillColor("[id = node_p"+(pid-1)+"]","#FF0000");

Parameters:
{string} selector: a string to represent a set of elements. Check the CSS3 selectors documentation to build a selector string
{string} color: a color in web format eg. #FF0000

show(selector)

Shows the elements on the graphic that match the selector. Check the CSS3 selectors documentation to build a selector string

instance.show("[id = node_p"+(pid-1)+"]");

Parameters:
{string} selector: a string to represent a set of elements. Check the CSS3 selectors documentation to build a selector string

showLegend(protein, typeLegend)

Shows/Hide the legend(id) of the protein

instance.swapShowLegend("#node_p"+(pid-1)+" .legend");

Parameters:
{string} protein: the id of the protein to swap the visibility of the legend
typeLegend

swapFixed(protein)

If the protein has a fixed position in the graphic it gets released, or viceversa other wise

instance.swapFixed("p"+(pid-1));

Parameters:
{string} protein: the id of the protein to swap is position on the graphic

swapShowLegend(protein)

Shows/Hide the legend(id) of the protein

instance.swapShowLegend("#node_p"+(pid-1)+" .legend");

Parameters:
{string} protein: the id of the protein to swap the visibility of the legend

Event Detail

interactionClick(actionPerformed)

instance.interactionClick(
   function( objEvent ) {
      alert("Click on the interaction " + objEvent.interaction.id);
   }
);

Parameters:
{function} actionPerformed: A function which receives an Biojs.Event object as argument.

Event object data:
{Object} source: The component which did triggered the event.
{Object} interaction: the information of the interaction that has been clicked.

interactionMouseOver(actionPerformed)

instance.interactionMouseOver(
   function( objEvent ) {
      alert("The mouse is over the interaction " + objEvent.interaction.id);
   }
);

Parameters:
{function} actionPerformed: A function which receives an Biojs.Event object as argument.

Event object data:
{Object} source: The component which did triggered the event.
{Object} interaction: the information of the interaction that has been mouseover.

proteinClick(actionPerformed)

instance.proteinClick(
   function( objEvent ) {
      alert("The protein " + objEvent.protein.id + " was clicked.");
   }
);

Parameters:
{function} actionPerformed: A function which receives an Biojs.Event object as argument.

Event object data:
{Object} source: The component which did triggered the event.
{Object} protein: the information of the protein that has been clicked.

proteinMouseOver(actionPerformed)

instance.proteinMouseOver(
   function( objEvent ) {
      alert("The mouse is over the protein " + objEvent.protein.id);
   }
);

Parameters:
{function} actionPerformed: A function which receives an Biojs.Event object as argument.

Event object data:
{Object} source: The component which did triggered the event.
{Object} protein: the information of the protein that has been mouseover.

Classes

Class Biojs.InteractionsD3