Skip to content

Commit 3799bbd

Browse files
authored
Add DashCytoscape.jl v0.3.0 (#137)
* chore: use build:backends * chore: update DashCytoscape.jl to v0.3.0 * chore: update CONTRIBUTING.md
1 parent 3b1875a commit 3799bbd

File tree

8 files changed

+4552
-4
lines changed

8 files changed

+4552
-4
lines changed

CONTRIBUTING.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ Please follow the following steps for local testing:
1010
```commandline
1111
git clone https://github.com/plotly/dash-cytoscape.git
1212
```
13-
2. In order to run the Python builds (`npm run build:py`) you need to create a
13+
2. In order to run the Python builds (`npm run build:backends`) you need to create a
1414
venv for this project. Make sure you have `virtualenv` correctly installed and run this:
1515
```commandline
1616
mkdir dash_cytoscape_dev
@@ -28,7 +28,7 @@ venv\Scripts\activate
2828
3. Install the JavaScript dependencies and build the code:
2929
```commandline
3030
npm install
31-
npm run build:all
31+
npm run build:backends
3232
```
3333

3434
#### Package manager
@@ -123,7 +123,7 @@ To publish or create a prerelease:
123123
3. Once the pull request is merged into master:
124124
4. Build
125125
```
126-
npm run build:all
126+
npm run build:backends
127127
```
128128
5. Create distribution tarball
129129
```
@@ -164,7 +164,7 @@ Make a post in the [Dash Community Forum](https://community.plotly.com/c/dash)
164164
## [Checklists](http://rs.io/unreasonable-effectiveness-of-checklists/)
165165
**Beginner tip:** _Copy and paste this section as a comment in your PR, then check off the boxes as you go!_
166166
### Pre-Merge checklist
167-
- [ ] The project was correctly built with `npm run build:all`.
167+
- [ ] The project was correctly built with `npm run build:backends`.
168168
- [ ] If there was any conflict, it was solved correctly
169169
- [ ] All changes were documented in CHANGELOG.md.
170170
- [ ] All tests on CircleCI have passed.

Project.toml

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
2+
name = "DashCytoscape"
3+
uuid = "1b08a953-4be3-4667-9a23-85cc21bfd5e9"
4+
authors = ["The Plotly Team <[email protected]>"]
5+
version = "0.3.0"
6+
7+
[deps]
8+
Dash = "1b08a953-4be3-4667-9a23-3db579824955"
9+
10+
[compat]
11+
julia = "1.2"
12+
Dash = "0.1.3"

deps/dash_cytoscape.dev.js

Lines changed: 353 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

deps/dash_cytoscape.min.js

Lines changed: 18 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

deps/dash_cytoscape_extra.dev.js

Lines changed: 3886 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

deps/dash_cytoscape_extra.min.js

Lines changed: 49 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/DashCytoscape.jl

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
2+
module DashCytoscape
3+
using Dash
4+
5+
const resources_path = realpath(joinpath( @__DIR__, "..", "deps"))
6+
const version = "0.3.0"
7+
8+
include("cyto_cytoscape.jl")
9+
10+
function __init__()
11+
DashBase.register_package(
12+
DashBase.ResourcePkg(
13+
"dash_cytoscape",
14+
resources_path,
15+
version = version,
16+
[
17+
DashBase.Resource(
18+
relative_package_path = "dash_cytoscape.min.js",
19+
external_url = "https://unpkg.com/[email protected]/dash_cytoscape/dash_cytoscape.min.js",
20+
dynamic = nothing,
21+
async = nothing,
22+
type = :js
23+
)
24+
]
25+
)
26+
27+
)
28+
end
29+
end

src/cyto_cytoscape.jl

Lines changed: 201 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,201 @@
1+
# AUTO GENERATED FILE - DO NOT EDIT
2+
3+
export cyto_cytoscape
4+
5+
"""
6+
cyto_cytoscape(;kwargs...)
7+
8+
A Cytoscape component.
9+
A Component Library for Dash aimed at facilitating network visualization in
10+
Python, wrapped around [Cytoscape.js](http://js.cytoscape.org/).
11+
Keyword arguments:
12+
- `id` (String; optional): The ID used to identify this component in Dash callbacks.
13+
- `autoRefreshLayout` (Bool; optional): Whether the layout should be refreshed when elements are added or removed.
14+
- `autolock` (Bool; optional): Whether nodes should be locked (not draggable at all) by default
15+
(if true, overrides individual node state).
16+
- `autoungrabify` (Bool; optional): Whether nodes should be ungrabified (not grabbable by user) by
17+
default (if true, overrides individual node state).
18+
- `autounselectify` (Bool; optional): Whether nodes should be unselectified (immutable selection state) by
19+
default (if true, overrides individual element state).
20+
- `boxSelectionEnabled` (Bool; optional): Whether box selection (i.e. drag a box overlay around, and release it
21+
to select) is enabled. If enabled, the user must taphold to pan the graph.
22+
- `className` (String; optional): Sets the class name of the element (the value of an element's html
23+
class attribute).
24+
- `elements` (optional): A list of dictionaries representing the elements of the networks. Each dictionary describes an element, and
25+
specifies its purpose. The [official Cytoscape.js documentation](https://js.cytoscape.org/#notation/elements-json)
26+
offers an extensive overview and examples of element declaration.
27+
Alternatively, a dictionary with the format { 'nodes': [], 'edges': [] } is allowed at initialization,
28+
but arrays remain the recommended format.. elements has the following type: Array of lists containing elements 'group', 'data', 'position', 'selected', 'selectable', 'locked', 'grabbable', 'classes'.
29+
Those elements have the following types:
30+
- `group` (String; optional): Either 'nodes' or 'edges'. If not given, it's automatically inferred.
31+
- `data` (optional): Element specific data.. data has the following type: lists containing elements 'id', 'label', 'parent', 'source', 'target'.
32+
Those elements have the following types:
33+
- `id` (String; optional): Reference to the element, useful for selectors and edges. Randomly assigned if not given.
34+
- `label` (String; optional): Optional name for the element, useful when `data(label)` is given to a style's `content`
35+
or `label`. It is only a convention.
36+
- `parent` (String; optional): Only for nodes. Optional reference to another node. Needed to create compound nodes.
37+
- `source` (String; optional): Only for edges. The id of the source node, which is where the edge starts.
38+
- `target` (String; optional): Only for edges. The id of the target node, where the edge ends.
39+
- `position` (optional): Only for nodes. The position of the node.. position has the following type: lists containing elements 'x', 'y'.
40+
Those elements have the following types:
41+
- `x` (Real; optional): The x-coordinate of the node.
42+
- `y` (Real; optional): The y-coordinate of the node.
43+
- `selected` (Bool; optional): If the element is selected upon initialisation.
44+
- `selectable` (Bool; optional): If the element can be selected.
45+
- `locked` (Bool; optional): Only for nodes. If the position is immutable.
46+
- `grabbable` (Bool; optional): Only for nodes. If the node can be grabbed and moved by the user.
47+
- `classes` (String; optional): Space separated string of class names of the element. Those classes can be selected
48+
by a style selector.s | lists containing elements 'nodes', 'edges'.
49+
Those elements have the following types:
50+
- `nodes` (Array; optional)
51+
- `edges` (Array; optional)
52+
- `generateImage` (optional): Dictionary specifying options to generate an image of the current cytoscape graph.
53+
Value is cleared after data is received and image is generated. This property will
54+
be ignored on the initial creation of the cytoscape object and must be invoked through
55+
a callback after it has been rendered.
56+
57+
If the app does not need the image data server side and/or it will only be used to download
58+
the image, it may be prudent to invoke `'download'` for `action` instead of
59+
`'store'` to improve performance by preventing transfer of data to the server.. generateImage has the following type: lists containing elements 'type', 'options', 'action', 'filename'.
60+
Those elements have the following types:
61+
- `type` (a value equal to: 'svg', 'png', 'jpg', 'jpeg'; optional): File type to output
62+
- `options` (Dict; optional): Dictionary of options to cy.png() / cy.jpg() or cy.svg() for image generation.
63+
See https://js.cytoscape.org/#core/export for details. For `'output'`, only 'base64'
64+
and 'base64uri' are supported. Default: `{'output': 'base64uri'}`.
65+
- `action` (a value equal to: 'store', 'download', 'both'; optional): `'store'`: Stores the image data (only jpg and png are supported)
66+
in `imageData` and invokes server-side Dash callbacks. `'download'`: Downloads the image
67+
as a file with all data handling done client-side. No `imageData` callbacks are fired.
68+
`'both'`: Stores image data and downloads image as file. The default is `'store'`
69+
- `filename` (String; optional): Name for the file to be downloaded. Default: 'cyto'.
70+
- `imageData` (String; optional): String representation of the image requested with generateImage. Null if no
71+
image was requested yet or the previous request failed. Read-only.
72+
- `layout` (optional): A dictionary specifying how to set the position of the elements in your
73+
graph. The `'name'` key is required, and indicates which layout (algorithm) to
74+
use. The keys accepted by `layout` vary depending on the algorithm, but these
75+
keys are accepted by all layouts: `fit`, `padding`, `animate`, `animationDuration`,
76+
`boundingBox`.
77+
78+
The complete list of layouts and their accepted options are available on the
79+
[Cytoscape.js docs](https://js.cytoscape.org/#layouts) . For the external layouts,
80+
the options are listed in the "API" section of the README.
81+
Note that certain keys are not supported in Dash since the value is a JavaScript
82+
function or a callback. Please visit this
83+
[issue](https://github.com/plotly/dash-cytoscape/issues/25) for more information.. layout has the following type: lists containing elements 'name', 'fit', 'padding', 'animate', 'animationDuration', 'boundingBox'.
84+
Those elements have the following types:
85+
- `name` (a value equal to: 'random', 'preset', 'circle', 'concentric', 'grid', 'breadthfirst', 'cose', 'close-bilkent', 'cola', 'euler', 'spread', 'dagre', 'klay'; required): The layouts available by default are:
86+
`random`: Randomly assigns positions.
87+
`preset`: Assigns position based on the `position` key in element dictionaries.
88+
`circle`: Single-level circle, with optional radius.
89+
`concentric`: Multi-level circle, with optional radius.
90+
`grid`: Square grid, optionally with numbers of `rows` and `cols`.
91+
`breadthfirst`: Tree structure built using BFS, with optional `roots`.
92+
`cose`: Force-directed physics simulation.
93+
94+
Some external layouts are also included. To use them, run
95+
`dash_cytoscape.load_extra_layouts()` before creating your Dash app. Be careful about
96+
using the extra layouts when not necessary, since they require supplementary bandwidth
97+
for loading, which impacts the startup time of the app.
98+
The external layouts are:
99+
[cose-bilkent](https://github.com/cytoscape/cytoscape.js-cose-bilkent),
100+
[cola](https://github.com/cytoscape/cytoscape.js-cola),
101+
[euler](https://github.com/cytoscape/cytoscape.js-dagre),
102+
[spread](https://github.com/cytoscape/cytoscape.js-spread),
103+
[dagre](https://github.com/cytoscape/cytoscape.js-dagre),
104+
[klay](https://github.com/cytoscape/cytoscape.js-klay),
105+
- `fit` (Bool; optional): Whether to render the nodes in order to fit the canvas.
106+
- `padding` (Real; optional): Padding around the sides of the canvas, if fit is enabled.
107+
- `animate` (Bool; optional): Whether to animate change in position when the layout changes.
108+
- `animationDuration` (Real; optional): Duration of animation in milliseconds, if enabled.
109+
- `boundingBox` (Dict; optional): How to constrain the layout in a specific area. Keys accepted are either
110+
`x1, y1, x2, y2` or `x1, y1, w, h`, all of which receive a pixel value.
111+
- `maxZoom` (Real; optional): A maximum bound on the zoom level of the graph. The viewport can not be
112+
scaled larger than this zoom level.
113+
- `minZoom` (Real; optional): A minimum bound on the zoom level of the graph. The viewport can not be
114+
scaled smaller than this zoom level.
115+
- `mouseoverEdgeData` (Dict; optional): The data dictionary of an edge returned when you hover over it. Read-only.
116+
- `mouseoverNodeData` (Dict; optional): The data dictionary of a node returned when you hover over it. Read-only.
117+
- `pan` (optional): Dictionary indicating the initial panning position of the graph. The
118+
following keys are accepted:. pan has the following type: lists containing elements 'x', 'y'.
119+
Those elements have the following types:
120+
- `x` (Real; optional): The x-coordinate of the node
121+
- `y` (Real; optional): The y-coordinate of the node
122+
- `panningEnabled` (Bool; optional): Whether panning the graph is enabled (i.e., the position of the graph is
123+
mutable overall).
124+
- `responsive` (Bool; optional): Toggles intelligent responsive resize of Cytoscape graph with viewport size change
125+
- `selectedEdgeData` (Array; optional): The list of data dictionaries of all selected edges (e.g. using
126+
Shift+Click to select multiple nodes, or Shift+Drag to use box selection). Read-only.
127+
- `selectedNodeData` (Array; optional): The list of data dictionaries of all selected nodes (e.g. using
128+
Shift+Click to select multiple nodes, or Shift+Drag to use box selection). Read-only.
129+
- `style` (Dict; optional): Add inline styles to the root element.
130+
- `stylesheet` (optional): A list of dictionaries representing the styles of the elements.
131+
Each dictionary requires the following keys: `selector` and `style`.
132+
133+
Both the [selector](https://js.cytoscape.org/#selectors) and
134+
the [style](https://js.cytoscape.org/#style/node-body) are
135+
exhaustively documented in the Cytoscape.js docs. Although methods such
136+
as `cy.elements(...)` and `cy.filter(...)` are not available, the selector
137+
string syntax stays the same.. stylesheet has the following type: Array of lists containing elements 'selector', 'style'.
138+
Those elements have the following types:
139+
- `selector` (String; required): Which elements you are styling. Generally, you select a group of elements (node, edges, both),
140+
a class (that you declare in the element dictionary), or an element by ID.
141+
- `style` (Dict; required): What aspects of the elements you want to modify. This could be the size or
142+
color of a node, the shape of an edge arrow, or many more.s
143+
- `tapEdge` (optional): The complete edge dictionary returned when you tap or click it. Read-only.. tapEdge has the following type: lists containing elements 'isLoop', 'isSimple', 'midpoint', 'sourceData', 'sourceEndpoint', 'targetData', 'targetEndpoint', 'timeStamp', 'classes', 'data', 'grabbable', 'group', 'locked', 'selectable', 'selected', 'style'.
144+
Those elements have the following types:
145+
- `isLoop` (Bool; optional): Edge-specific item
146+
- `isSimple` (Bool; optional): Edge-specific item
147+
- `midpoint` (Dict; optional): Edge-specific item
148+
- `sourceData` (Dict; optional): Edge-specific item
149+
- `sourceEndpoint` (Dict; optional): Edge-specific item
150+
- `targetData` (Dict; optional): Edge-specific item
151+
- `targetEndpoint` (Dict; optional): Edge-specific item
152+
- `timeStamp` (Real; optional): Edge-specific item
153+
- `classes` (String; optional): General item (for all elements)
154+
- `data` (Dict; optional): General item (for all elements)
155+
- `grabbable` (Bool; optional): General item (for all elements)
156+
- `group` (String; optional): General item (for all elements)
157+
- `locked` (Bool; optional): General item (for all elements)
158+
- `selectable` (Bool; optional): General item (for all elements)
159+
- `selected` (Bool; optional): General item (for all elements)
160+
- `style` (Dict; optional): General item (for all elements)
161+
- `tapEdgeData` (Dict; optional): The data dictionary of an edge returned when you tap or click it. Read-only.
162+
- `tapNode` (optional): The complete node dictionary returned when you tap or click it. Read-only.. tapNode has the following type: lists containing elements 'edgesData', 'renderedPosition', 'timeStamp', 'classes', 'data', 'grabbable', 'group', 'locked', 'position', 'selectable', 'selected', 'style', 'ancestorsData', 'childrenData', 'descendantsData', 'parentData', 'siblingsData', 'isParent', 'isChildless', 'isChild', 'isOrphan', 'relativePosition'.
163+
Those elements have the following types:
164+
- `edgesData` (Array; optional): node specific item
165+
- `renderedPosition` (Dict; optional): node specific item
166+
- `timeStamp` (Real; optional): node specific item
167+
- `classes` (String; optional): General item (for all elements)
168+
- `data` (Dict; optional): General item (for all elements)
169+
- `grabbable` (Bool; optional): General item (for all elements)
170+
- `group` (String; optional): General item (for all elements)
171+
- `locked` (Bool; optional): General item (for all elements)
172+
- `position` (Dict; optional): General item (for all elements)
173+
- `selectable` (Bool; optional): General item (for all elements)
174+
- `selected` (Bool; optional): General item (for all elements)
175+
- `style` (Dict; optional): General item (for all elements)
176+
- `ancestorsData` (Dict | Array; optional): Item for compound nodes
177+
- `childrenData` (Dict | Array; optional): Item for compound nodes
178+
- `descendantsData` (Dict | Array; optional): Item for compound nodes
179+
- `parentData` (Dict | Array; optional): Item for compound nodes
180+
- `siblingsData` (Dict | Array; optional): Item for compound nodes
181+
- `isParent` (Bool; optional): Item for compound nodes
182+
- `isChildless` (Bool; optional): Item for compound nodes
183+
- `isChild` (Bool; optional): Item for compound nodes
184+
- `isOrphan` (Bool; optional): Item for compound nodes
185+
- `relativePosition` (Dict; optional): Item for compound nodes
186+
- `tapNodeData` (Dict; optional): The data dictionary of a node returned when you tap or click it. Read-only.
187+
- `userPanningEnabled` (Bool; optional): Whether user events (e.g. dragging the graph background) are allowed to
188+
pan the graph.
189+
- `userZoomingEnabled` (Bool; optional): Whether user events (e.g. dragging the graph background) are allowed
190+
to pan the graph.
191+
- `zoom` (Real; optional): The initial zoom level of the graph. You can set `minZoom` and
192+
`maxZoom` to set restrictions on the zoom level.
193+
- `zoomingEnabled` (Bool; optional): Whether zooming the graph is enabled (i.e., the zoom level of the graph
194+
is mutable overall).
195+
"""
196+
function cyto_cytoscape(; kwargs...)
197+
available_props = Symbol[:id, :autoRefreshLayout, :autolock, :autoungrabify, :autounselectify, :boxSelectionEnabled, :className, :elements, :generateImage, :imageData, :layout, :maxZoom, :minZoom, :mouseoverEdgeData, :mouseoverNodeData, :pan, :panningEnabled, :responsive, :selectedEdgeData, :selectedNodeData, :style, :stylesheet, :tapEdge, :tapEdgeData, :tapNode, :tapNodeData, :userPanningEnabled, :userZoomingEnabled, :zoom, :zoomingEnabled]
198+
wild_props = Symbol[]
199+
return Component("cyto_cytoscape", "Cytoscape", "dash_cytoscape", available_props, wild_props; kwargs...)
200+
end
201+

0 commit comments

Comments
 (0)