Cytoscape.NET is an interface for Cytoscape.js written in F# to visualiz complex networks and integrate these with any type of attribute data.
The following examples show how easy it is to start working with Cytoscape.NET.
You can get all Cytoscape.NET packages from nuget at nuget page.
dotnet add package Cytoscape.NET --version <desired-version-here>
|
Or add the package reference directly to your .*proj
file:
<PackageReference Include="Cytoscape.NET" Version="<desired-version-here>" />
You can include the package via an inline package reference:
#r "nuget: Cytoscape.NET, <desired-version-here>"
The general design philosophy of Cytoscape.NET implements the following visualization flow:
- initialize a
Cytoscape
object by using the CyGraph.initEmpty
function.
- attach elements e.g. notes, edges and data to visulize and further
- style the graph with fine-grained control, e.g. by setting labels, color, etc.
- display (in the browser or as cell result in a notebook) or save the graph (comming soon)
The CyGraph
module contains the CyGraph.initEmpty
function to create an empty graph.
You can therefore initialize a cytoscape graph like this:
open Cytoscape.NET
let myFirstGraph =
CyGraph.initEmpty ()
myFirstGraph
The Elements
module contains the node
and edge
functions to create the respective element.
Node and edges can be decorated with data as CyStyleParam list
You can therefore create a cytoscape graph with two nodes and an edge like this:
open Elements
let myGraph =
CyGraph.initEmpty ()
|> CyGraph.withElements [
node "n1" [ CyParam.label "FsLab" ]
node "n2" [ CyParam.label "ML" ]
edge "e1" "n1" "n2" []
]
Styling functions are generally the CyGraph.with*
naming convention. The following styling example does:
- add two nodes including a text label
- add an edge without any additional data
- styles the nodes with color and content via
CyGraph.withStyle
- sets the graph size to 800 x 400 pixels via
CyGraph.withSize
let myFirstStyledGraph =
CyGraph.initEmpty ()
|> CyGraph.withElements [
node "n1" [ CyParam.label "FsLab" ]
node "n2" [ CyParam.label "ML" ]
edge "e1" "n1" "n2" []
]
|> CyGraph.withStyle "node"
[
CyParam.content =. CyParam.label
CyParam.color "#A00975"
]
|> CyGraph.withSize(800, 400)
Attention: =.
is a styling mapper and allows to pass data from different sources into the layout.
Here the label attached to each node is rendered as content.
The CyGraph.show
function will open a browser window and render the input graph there.
myGraph
|> CyGraph.show
Should render this chart in your brower:
myFirstStyledGraph
|> CyGraph.show
And here is what happened after applying the styles from above:
The project is hosted on GitHub where you can report issues, fork
the project and submit pull requests. If you're adding a new public API, please also
consider adding samples that can be turned into a documentation. You might
also want to read the library design notes to understand how it works.
The library is available under Public Domain license, which allows modification and
redistribution for both commercial and non-commercial purposes. For more information see the
License file in the GitHub repository.
namespace Cytoscape
namespace Cytoscape.NET
module Defaults
from Cytoscape.NET
<summary>
Contains mutable global default values.
Changing these values will apply the default values to all consecutive Graph generations.
</summary>
val mutable DefaultDisplayOptions: DisplayOptions
Multiple items
type DisplayOptions =
inherit DynamicObj
new: unit -> DisplayOptions
static member addAdditionalHeadTags: additionalHeadTags: XmlNode list -> (DisplayOptions -> DisplayOptions)
static member addDescription: description: XmlNode list -> (DisplayOptions -> DisplayOptions)
static member getAdditionalHeadTags: displayOpts: DisplayOptions -> XmlNode list
static member getCytoscapeReference: displayOpts: DisplayOptions -> CytoscapeJSReference
static member getDescription: displayOpts: DisplayOptions -> XmlNode list
static member init: ?AdditionalHeadTags: XmlNode list * ?Description: XmlNode list * ?CytoscapeJSReference: CytoscapeJSReference -> DisplayOptions
static member initCDNOnly: unit -> DisplayOptions
static member initDefault: unit -> DisplayOptions
...
--------------------
new: unit -> DisplayOptions
static member DisplayOptions.init: ?AdditionalHeadTags: Giraffe.ViewEngine.HtmlElements.XmlNode list * ?Description: Giraffe.ViewEngine.HtmlElements.XmlNode list * ?CytoscapeJSReference: CytoscapeJSReference -> DisplayOptions
type CytoscapeJSReference =
| CDN of string
| Full
| Require of string
| NoReference
<summary>
Sets how cytoscape is referenced in the head of html docs.
</summary>
union case CytoscapeJSReference.NoReference: CytoscapeJSReference
val myFirstGraph: CyGraph.CyGraph
module CyGraph
from Cytoscape.NET
val initEmpty: unit -> CyGraph.CyGraph
module Elements
from Cytoscape.NET
val myGraph: CyGraph.CyGraph
val withElements: elems: seq<CytoscapeModel.Element> -> cy: CyGraph.CyGraph -> CyGraph.CyGraph
val node: id: string -> dataAttributes: CyParam.CyStyleParam list -> Node
module CyParam
from Cytoscape.NET
val label: v: 'a -> CyParam.CyStyleParam
val edge: id: string -> sourceId: string -> targetId: string -> dataAttributes: CyParam.CyStyleParam list -> Edge
val myFirstStyledGraph: CyGraph.CyGraph
val withStyle: selector: string -> cyStyles: seq<CyParam.CyStyleParam> -> cy: CyGraph.CyGraph -> CyGraph.CyGraph
val content: v: 'a -> CyParam.CyStyleParam
val color: v: 'a -> CyParam.CyStyleParam
val withSize: width: int * height: int -> cy: CyGraph.CyGraph -> CyGraph.CyGraph
val show: cy: CyGraph.CyGraph -> unit
val withZoom: zoom: CytoscapeModel.Zoom -> cy: CyGraph.CyGraph -> CyGraph.CyGraph
namespace Cytoscape.NET.CytoscapeModel
Multiple items
type Zoom =
inherit DynamicObj
new: unit -> Zoom
static member Init: ?Level: float * ?Position: (int * int) * ?RenderedPosition: (int * int) * ?ZoomingEnabled: bool -> Zoom
static member Update: ?Level: float * ?Position: (int * int) * ?RenderedPosition: (int * int) * ?ZoomingEnabled: bool -> (Zoom -> Zoom)
--------------------
new: unit -> CytoscapeModel.Zoom
static member CytoscapeModel.Zoom.Init: ?Level: float * ?Position: (int * int) * ?RenderedPosition: (int * int) * ?ZoomingEnabled: bool -> CytoscapeModel.Zoom
type HTML =
static member CreateGraphHTML: graphData: string * zooming: string * divId: string * cytoscapeReference: CytoscapeJSReference * ?Width: int * ?Height: int -> XmlNode list
static member CreateGraphScript: graphData: string * zooming: string * cytoscapeReference: CytoscapeJSReference -> XmlNode
static member Doc: graphHTML: XmlNode list * cytoscapeReference: CytoscapeJSReference * ?AdditionalHeadTags: XmlNode list -> XmlNode
static member show: cy: Cytoscape * ?DisplayOpts: DisplayOptions -> unit
static member toEmbeddedHTML: ?DisplayOpts: DisplayOptions -> (Cytoscape -> string)
static member toGraphHTML: ?DisplayOpts: DisplayOptions -> (Cytoscape -> string)
static member toGraphHTMLNodes: ?DisplayOpts: DisplayOptions -> (Cytoscape -> XmlNode list)
<summary>
HTML template for Cytoscape
</summary>
static member HTML.toGraphHTML: ?DisplayOpts: DisplayOptions -> (CytoscapeModel.Cytoscape -> string)