-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
CELE-32 refactor: Refactor TwoDViewer component
- Loading branch information
1 parent
6815b9a
commit 33889f9
Showing
9 changed files
with
89 additions
and
55 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
21 changes: 21 additions & 0 deletions
21
applications/visualizer/frontend/src/helpers/twoDHelpers.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import type {Connection} from "../rest"; | ||
|
||
export const createEdge = (conn: Connection) => { | ||
return { | ||
group: 'edges', | ||
data: { | ||
id: `${conn.pre}-${conn.post}`, | ||
source: conn.pre, | ||
target: conn.post, | ||
label: conn.type | ||
}, | ||
classes: conn.type | ||
} | ||
} | ||
|
||
export const createNode = (nodeId: string) => { | ||
return { | ||
group: 'nodes', | ||
data: {id: nodeId, label: nodeId} | ||
} | ||
} |
File renamed without changes.
File renamed without changes.
5 changes: 5 additions & 0 deletions
5
applications/visualizer/frontend/src/settings/twoDSettings.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
export const CHEMICAL_THRESHOLD = 3 | ||
export const ELECTRICAL_THRESHOLD = 3 | ||
|
||
export const INCLUDE_NEIGHBORING_CELLS = false | ||
export const INCLUDE_ANNOTATIONS = true |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
const NODE_STYLE = { | ||
'background-color': '#666', | ||
'label': 'data(label)', | ||
'color': '#fff', | ||
'text-outline-color': '#000', | ||
'text-outline-width': 2, | ||
'text-valign': 'center', | ||
'text-halign': 'center', | ||
} | ||
|
||
const EDGE_STYLE = { | ||
'width': 3, | ||
'line-color': '#ccc', | ||
'target-arrow-color': '#ccc', | ||
'target-arrow-shape': 'triangle', | ||
'curve-style': 'bezier' | ||
} | ||
|
||
const CHEMICAL_STYLE = {'line-color': 'blue'} | ||
const ELECTRICAL_STYLE = {'line-color': 'yellow'} | ||
|
||
export const GRAPH_STYLES = [ | ||
{ | ||
selector: 'node', | ||
style: NODE_STYLE | ||
}, | ||
{ | ||
selector: 'edge', | ||
style: EDGE_STYLE | ||
}, | ||
{ | ||
selector: '.chemical', | ||
style: CHEMICAL_STYLE | ||
}, | ||
{ | ||
selector: '.electrical', | ||
style: ELECTRICAL_STYLE | ||
} | ||
] |