Adds style property to graph edges.

visualization-bundle/src/visualizers/graph/graph-graphviz-visualizer/GraphvizGraphVisualizer.tsx

@@ -5,7 +5,7 @@ import { GraphvizDotViewer } from "../dot-graphviz-visualizer/GraphvizDotVisuali
 @observer
 export class GraphvizGraphViewer extends React.Component<{
 	nodes: { id: string; label?: string }[];
-	edges: { from: string; to: string; label?: string }[];
+	edges: { from: string; to: string; label?: string; style: string }[];
 }> {
 	render() {
 		const { nodes, edges } = this.props;
@@ -26,7 +26,7 @@ export class GraphvizGraphViewer extends React.Component<{
 								e.to
 							}" [ label = ${JSON.stringify(
 								e.label !== undefined ? e.label : ""
-							)} ];`
+							)} style = ${JSON.stringify(e.style || "")} ];`
 					)
 					.join("\n")}
             }

visualization-bundle/src/visualizers/graph/graph-visjs-visualizer/VisJsGraphViewer.tsx

@@ -21,7 +21,7 @@ export class VisJsGraphViewer extends React.Component<{
 		to: string;
 		label?: string;
 		color?: string;
-		dashes?: boolean;
+		dashes?: boolean | number[];
 		shape?: boolean;
 	}>();
 
@@ -69,7 +69,9 @@ export class VisJsGraphViewer extends React.Component<{
 				from: n.from,
 				to: n.to,
 				color: n.color,
-				dashes: n.dashes,
+				dashes: { dashed: true, dotted: [1, 4], solid: false }[
+					n.style || "solid"
+				],
 			});
 		}
 		this.edges.forEach(item => {

visualization-bundle/src/visualizers/graph/sGraph.ts

@@ -25,7 +25,10 @@ export const sGraphEdge = sOpenObject({
 	label: sOptionalProp(sString(), {}),
 	id: sOptionalProp(sString(), {}),
 	color: sOptionalProp(sString(), {}),
-	dashes: sOptionalProp(sBoolean(), {}),
+	style: sOptionalProp(
+		sUnion([sLiteral("solid"), sLiteral("dashed"), sLiteral("dotted")]),
+		{}
+	),
 }).defineAs(visualizationNs("GraphEdge"));
 
 export const sGraph = sOpenObject({