Skip to content

Commit ff73e54

Browse files
64json64json
committed
Add updateNode(), removeNode(), updateEdge(), and removeEdge() in GraphTracer
1 parent e228589 commit ff73e54

File tree

3 files changed

+53
-15
lines changed

3 files changed

+53
-15
lines changed

‎src/frontend/core/datas/GraphData.js

Lines changed: 36 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -48,9 +48,26 @@ class GraphData extends Data {
4848
this.isWeighted = isWeighted;
4949
}
5050

51-
addNode(id, weight = null, visitedCount = 0, selectedCount = 0, x = 0, y = 0) {
51+
addNode(id, weight = null, x = 0, y = 0, visitedCount = 0, selectedCount = 0) {
5252
if (this.findNode(id)) return;
53-
this.nodes.push({ id, weight, visitedCount, selectedCount, x, y });
53+
this.nodes.push({ id, weight, x, y, visitedCount, selectedCount });
54+
this.layout();
55+
}
56+
57+
updateNode(id, weight, x, y, visitedCount, selectedCount) {
58+
const node = this.findNode(id);
59+
const update = { weight, x, y, visitedCount, selectedCount };
60+
Object.keys(update).forEach(key => {
61+
if (update[key] === undefined) delete update[key];
62+
});
63+
Object.assign(node, update);
64+
}
65+
66+
removeNode(id) {
67+
const node = this.findNode(id);
68+
if (!node) return;
69+
const index = this.nodes.indexOf(node);
70+
this.nodes.splice(index, 1);
5471
this.layout();
5572
}
5673

@@ -60,9 +77,21 @@ class GraphData extends Data {
6077
this.layout();
6178
}
6279

63-
updateNode(id, update) {
64-
const node = this.findNode(id);
65-
Object.assign(node, update);
80+
updateEdge(source, target, weight, visitedCount, selectedCount) {
81+
const edge = this.findEdge(source, target);
82+
const update = { weight, visitedCount, selectedCount };
83+
Object.keys(update).forEach(key => {
84+
if (update[key] === undefined) delete update[key];
85+
});
86+
Object.assign(edge, update);
87+
}
88+
89+
removeEdge(source, target) {
90+
const edge = this.findEdge(source, target);
91+
if (!edge) return;
92+
const index = this.edges.indexOf(edge);
93+
this.edges.splice(index, 1);
94+
this.layout();
6695
}
6796

6897
findNode(id) {
@@ -195,11 +224,11 @@ class GraphData extends Data {
195224
this.visitOrLeave(false, target, source, weight);
196225
}
197226

198-
visitOrLeave(visit, target, source = null, weight = null) {
227+
visitOrLeave(visit, target, source = null, weight) {
199228
const edge = this.findEdge(source, target);
200229
if (edge) edge.visitedCount += visit ? 1 : -1;
201230
const node = this.findNode(target);
202-
node.weight = weight;
231+
if (weight !== undefined) node.weight = weight;
203232
node.visitedCount += visit ? 1 : -1;
204233
if (this.logData) {
205234
this.logData.print(visit ? (source || '') + ' -> ' + target : (source || '') + ' <- ' + target);

‎src/frontend/core/renderers/GraphRenderer/index.jsx

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,10 @@ class GraphRenderer extends Renderer {
2121

2222
handleMouseMove(e) {
2323
if (this.selectedNode) {
24-
const coords = this.computeCoords(e);
25-
this.props.data.updateNode(this.selectedNode.id, coords);
24+
const { x, y } = this.computeCoords(e);
25+
const node = this.props.data.findNode(this.selectedNode.id);
26+
node.x = x;
27+
node.y = y;
2628
this.refresh();
2729
} else {
2830
super.handleMouseMove(e);
@@ -63,8 +65,11 @@ class GraphRenderer extends Renderer {
6365
{
6466
edges.sort((a, b) => a.visitedCount - b.visitedCount).map(edge => {
6567
const { source, target, weight, visitedCount, selectedCount } = edge;
66-
const { x: sx, y: sy } = this.props.data.findNode(source);
67-
let { x: ex, y: ey } = this.props.data.findNode(target);
68+
const sourceNode = this.props.data.findNode(source);
69+
const targetNode = this.props.data.findNode(target);
70+
if (!sourceNode || !targetNode) return undefined;
71+
const { x: sx, y: sy } = sourceNode;
72+
let { x: ex, y: ey } = targetNode;
6873
const mx = (sx + ex) / 2;
6974
const my = (sy + ey) / 2;
7075
const dx = ex - sx;
@@ -79,7 +84,8 @@ class GraphRenderer extends Renderer {
7984
}
8085

8186
return (
82-
<g className={classes(styles.edge, selectedCount && styles.selected, visitedCount && styles.visited)} key={`${source}-${target}`}>
87+
<g className={classes(styles.edge, selectedCount && styles.selected, visitedCount && styles.visited)}
88+
key={`${source}-${target}`}>
8389
<path d={`M${sx},${sy} L${ex},${ey}`} className={classes(styles.line, isDirected && styles.directed)} />
8490
{
8591
isWeighted &&
@@ -96,8 +102,8 @@ class GraphRenderer extends Renderer {
96102
nodes.map(node => {
97103
const { id, x, y, weight, visitedCount, selectedCount } = node;
98104
return (
99-
<g className={classes(styles.node, selectedCount && styles.selected, visitedCount && styles.visited)} key={id}
100-
transform={`translate(${x},${y})`}>
105+
<g className={classes(styles.node, selectedCount && styles.selected, visitedCount && styles.visited)}
106+
key={id} transform={`translate(${x},${y})`}>
101107
<circle className={styles.circle} r={nodeRadius} />
102108
<text className={styles.id}>{id}</text>
103109
{

‎src/frontend/core/renderers/Renderer/index.jsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,10 @@ class Renderer extends React.Component {
5858
toString(value) {
5959
switch (typeof(value)) {
6060
case 'number':
61-
return value === Infinity ? '∞' : Number.isInteger(value) ? value.toString() : value.toFixed(3);
61+
return [Number.POSITIVE_INFINITY, Number.MAX_SAFE_INTEGER, 0x7fffffff].includes(value) ? '∞' :
62+
[Number.NEGATIVE_INFINITY, Number.MIN_SAFE_INTEGER, -0x80000000].includes(value) ? '-∞' :
63+
Number.isInteger(value) ? value.toString() :
64+
value.toFixed(3);
6265
case 'boolean':
6366
return value ? 'T' : 'F';
6467
default:

0 commit comments

Comments
 (0)