// ReSharper restore UnusedAutoPropertyAccessor.Local /// <summary> /// Renders the change details as SVG directed graph. /// </summary> /// <param name="renderer">SVG renderer to use.</param> /// <returns><see cref="XElement"/> containing SVG fragment for adding to browser view.</returns> public async Task <XElement> RenderSvg(ISvgRenderer renderer) { var graph = this.GenerateChangeGraph(); var dotGraph = graph.ToGraphviz( algorithm => { var font = new GraphvizFont("Arial", 9); algorithm.CommonVertexFormat.Font = font; algorithm.CommonEdgeFormat.Font = font; algorithm.GraphFormat.RankDirection = GraphvizRankDirection.LR; algorithm.FormatVertex += (sender, args) => { args.VertexFormat.Label = args.Vertex.ToString(); args.VertexFormat.Shape = args.Vertex.Shape; if (args.Vertex is ResourceVertex rv) { args.VertexFormat.Label = rv.Label; args.VertexFormat.IsHtmlLabel = true; args.VertexFormat.Style = rv.Style; args.VertexFormat.FillColor = rv.FillColor; args.VertexFormat.FontColor = rv.FontColor; } }; algorithm.FormatEdge += (sender, args) => { args.EdgeFormat.Label.Value = args.Edge.Tag; }; }); var svg = await renderer.RenderSvg(dotGraph); if (svg != null) { // Now change the width and height attributes of the SVG to 100% so it becomes responsive in bootstrap if (svg.Attribute("width") != null) { svg.Attribute("width").Value = "100%"; } if (svg.Attribute("height") != null) { svg.Attribute("height").Value = "100%"; } } return(svg); }