From 46921d6025d783b4be212fab312ddd24363c3b46 Mon Sep 17 00:00:00 2001 From: Gavin Nishizawa Date: Fri, 16 Dec 2022 15:43:03 -0800 Subject: [PATCH 1/5] add style fill to connection labels in e2e tests --- e2etests/stable_test.go | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/e2etests/stable_test.go b/e2etests/stable_test.go index 29eeb130b..be9381938 100644 --- a/e2etests/stable_test.go +++ b/e2etests/stable_test.go @@ -917,12 +917,13 @@ y: { } } -x -> y: { +x -> y: in style { style: { stroke: green opacity: 0.5 stroke-width: 2 stroke-dash: 5 + fill: lavender } } `, @@ -1041,6 +1042,7 @@ size S -> size M: custom 15 { } size XXXL -> custom 64: custom 48 { style.font-size: 48 + style.fill: lavender } `, }, { From 65dc45c119671146f4c8cf4ed0b153b6997df6df Mon Sep 17 00:00:00 2001 From: Gavin Nishizawa Date: Fri, 16 Dec 2022 15:43:58 -0800 Subject: [PATCH 2/5] update tests --- .../stable/stylish/dagre/board.exp.json | 8 ++++---- .../stable/stylish/dagre/sketch.exp.svg | 12 +++++++++++- .../testdata/stable/stylish/elk/board.exp.json | 12 ++++++------ .../testdata/stable/stylish/elk/sketch.exp.svg | 18 ++++++++++++++---- 4 files changed, 35 insertions(+), 15 deletions(-) diff --git a/e2etests/testdata/stable/stylish/dagre/board.exp.json b/e2etests/testdata/stable/stylish/dagre/board.exp.json index d85374df4..10836e6e0 100644 --- a/e2etests/testdata/stable/stylish/dagre/board.exp.json +++ b/e2etests/testdata/stable/stylish/dagre/board.exp.json @@ -95,7 +95,7 @@ "strokeDash": 5, "strokeWidth": 2, "stroke": "green", - "label": "", + "label": "in style", "fontSize": 16, "fontFamily": "DEFAULT", "language": "", @@ -103,9 +103,9 @@ "italic": true, "bold": false, "underline": false, - "labelWidth": 0, - "labelHeight": 0, - "labelPosition": "", + "labelWidth": 47, + "labelHeight": 21, + "labelPosition": "INSIDE_MIDDLE_CENTER", "labelPercentage": 0, "route": [ { diff --git a/e2etests/testdata/stable/stylish/dagre/sketch.exp.svg b/e2etests/testdata/stable/stylish/dagre/sketch.exp.svg index 1b54d4d17..f73951c97 100644 --- a/e2etests/testdata/stable/stylish/dagre/sketch.exp.svg +++ b/e2etests/testdata/stable/stylish/dagre/sketch.exp.svg @@ -28,11 +28,21 @@ width="314" height="552" viewBox="-100 -100 314 552"> \ No newline at end of file diff --git a/e2etests/testdata/stable/stylish/elk/board.exp.json b/e2etests/testdata/stable/stylish/elk/board.exp.json index 0cd252c22..89f1269bf 100644 --- a/e2etests/testdata/stable/stylish/elk/board.exp.json +++ b/e2etests/testdata/stable/stylish/elk/board.exp.json @@ -46,7 +46,7 @@ "type": "", "pos": { "x": 12, - "y": 238 + "y": 359 }, "width": 114, "height": 126, @@ -95,7 +95,7 @@ "strokeDash": 5, "strokeWidth": 2, "stroke": "green", - "label": "", + "label": "in style", "fontSize": 16, "fontFamily": "DEFAULT", "language": "", @@ -103,9 +103,9 @@ "italic": true, "bold": false, "underline": false, - "labelWidth": 0, - "labelHeight": 0, - "labelPosition": "", + "labelWidth": 47, + "labelHeight": 21, + "labelPosition": "INSIDE_MIDDLE_CENTER", "labelPercentage": 0, "route": [ { @@ -114,7 +114,7 @@ }, { "x": 69, - "y": 238 + "y": 359 } ], "animated": false, diff --git a/e2etests/testdata/stable/stylish/elk/sketch.exp.svg b/e2etests/testdata/stable/stylish/elk/sketch.exp.svg index eff681d67..c472ba27b 100644 --- a/e2etests/testdata/stable/stylish/elk/sketch.exp.svg +++ b/e2etests/testdata/stable/stylish/elk/sketch.exp.svg @@ -2,7 +2,7 @@ \ No newline at end of file From 412713e2b724d76223582e51bc3532a6782703bb Mon Sep 17 00:00:00 2001 From: Gavin Nishizawa Date: Fri, 16 Dec 2022 15:44:26 -0800 Subject: [PATCH 3/5] render connection label background according to style.fill --- d2exporter/export.go | 4 ++++ d2renderers/d2svg/d2svg.go | 5 +++++ d2target/d2target.go | 1 + 3 files changed, 10 insertions(+) diff --git a/d2exporter/export.go b/d2exporter/export.go index 1f2a15b8d..96900ff01 100644 --- a/d2exporter/export.go +++ b/d2exporter/export.go @@ -200,6 +200,10 @@ func toConnection(edge *d2graph.Edge, theme *d2themes.Theme) d2target.Connection connection.StrokeWidth, _ = strconv.Atoi(edge.Attributes.Style.StrokeWidth.Value) } + if edge.Attributes.Style.Fill != nil { + connection.Fill = edge.Attributes.Style.Fill.Value + } + connection.FontSize = text.FontSize if edge.Attributes.Style.FontSize != nil { connection.FontSize, _ = strconv.Atoi(edge.Attributes.Style.FontSize.Value) diff --git a/d2renderers/d2svg/d2svg.go b/d2renderers/d2svg/d2svg.go index 022fcf66d..6e31221c8 100644 --- a/d2renderers/d2svg/d2svg.go +++ b/d2renderers/d2svg/d2svg.go @@ -432,6 +432,11 @@ func drawConnection(writer io.Writer, labelMaskID string, connection d2target.Co if connection.Color != "" { fontColor = connection.Color } + + if connection.Fill != "" { + fmt.Fprintf(writer, ``, + labelTL.X, labelTL.Y, connection.LabelWidth, connection.LabelHeight, connection.Fill) + } textStyle := fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "middle", connection.FontSize, fontColor) x := labelTL.X + float64(connection.LabelWidth)/2 y := labelTL.Y + float64(connection.FontSize) diff --git a/d2target/d2target.go b/d2target/d2target.go index 41dc4c718..ae098fd28 100644 --- a/d2target/d2target.go +++ b/d2target/d2target.go @@ -207,6 +207,7 @@ type Connection struct { StrokeDash float64 `json:"strokeDash"` StrokeWidth int `json:"strokeWidth"` Stroke string `json:"stroke"` + Fill string `json:"fill,omitempty"` Text LabelPosition string `json:"labelPosition"` From 73a4ac1a6e8d4deba36e9c8b41587bda55c74c59 Mon Sep 17 00:00:00 2001 From: Gavin Nishizawa Date: Fri, 16 Dec 2022 15:48:24 -0800 Subject: [PATCH 4/5] update tests --- e2etests/testdata/stable/font_sizes/dagre/board.exp.json | 1 + e2etests/testdata/stable/font_sizes/dagre/sketch.exp.svg | 2 +- e2etests/testdata/stable/font_sizes/elk/board.exp.json | 1 + e2etests/testdata/stable/font_sizes/elk/sketch.exp.svg | 2 +- e2etests/testdata/stable/stylish/dagre/board.exp.json | 1 + e2etests/testdata/stable/stylish/dagre/sketch.exp.svg | 2 +- e2etests/testdata/stable/stylish/elk/board.exp.json | 1 + e2etests/testdata/stable/stylish/elk/sketch.exp.svg | 2 +- 8 files changed, 8 insertions(+), 4 deletions(-) diff --git a/e2etests/testdata/stable/font_sizes/dagre/board.exp.json b/e2etests/testdata/stable/font_sizes/dagre/board.exp.json index 3a91ea14e..0579a08d9 100644 --- a/e2etests/testdata/stable/font_sizes/dagre/board.exp.json +++ b/e2etests/testdata/stable/font_sizes/dagre/board.exp.json @@ -591,6 +591,7 @@ "strokeDash": 0, "strokeWidth": 2, "stroke": "#0D32B2", + "fill": "lavender", "label": "custom 48", "fontSize": 48, "fontFamily": "DEFAULT", diff --git a/e2etests/testdata/stable/font_sizes/dagre/sketch.exp.svg b/e2etests/testdata/stable/font_sizes/dagre/sketch.exp.svg index 578b7397c..0d98903f7 100644 --- a/e2etests/testdata/stable/font_sizes/dagre/sketch.exp.svg +++ b/e2etests/testdata/stable/font_sizes/dagre/sketch.exp.svg @@ -18,7 +18,7 @@ width="2360" height="632" viewBox="-100 -100 2360 632">size XSsize Ssize Msize Lsize XLsize XXLsize XXXLcustom 8custom 12custom 18custom 21custom 64 custom 10custom 15custom 48 +size XSsize Ssize Msize Lsize XLsize XXLsize XXXLcustom 8custom 12custom 18custom 21custom 64 custom 10custom 15custom 48 diff --git a/e2etests/testdata/stable/font_sizes/elk/board.exp.json b/e2etests/testdata/stable/font_sizes/elk/board.exp.json index 2d5446e61..9658ee501 100644 --- a/e2etests/testdata/stable/font_sizes/elk/board.exp.json +++ b/e2etests/testdata/stable/font_sizes/elk/board.exp.json @@ -573,6 +573,7 @@ "strokeDash": 0, "strokeWidth": 2, "stroke": "#0D32B2", + "fill": "lavender", "label": "custom 48", "fontSize": 48, "fontFamily": "DEFAULT", diff --git a/e2etests/testdata/stable/font_sizes/elk/sketch.exp.svg b/e2etests/testdata/stable/font_sizes/elk/sketch.exp.svg index cb9321042..9c69d48ce 100644 --- a/e2etests/testdata/stable/font_sizes/elk/sketch.exp.svg +++ b/e2etests/testdata/stable/font_sizes/elk/sketch.exp.svg @@ -18,7 +18,7 @@ width="1965" height="793" viewBox="-88 -88 1965 793">size XSsize Ssize Msize Lsize XLsize XXLsize XXXLcustom 8custom 12custom 18custom 21custom 64 custom 10custom 15custom 48 +size XSsize Ssize Msize Lsize XLsize XXLsize XXXLcustom 8custom 12custom 18custom 21custom 64 custom 10custom 15custom 48 diff --git a/e2etests/testdata/stable/stylish/dagre/board.exp.json b/e2etests/testdata/stable/stylish/dagre/board.exp.json index 10836e6e0..7dce7c5ce 100644 --- a/e2etests/testdata/stable/stylish/dagre/board.exp.json +++ b/e2etests/testdata/stable/stylish/dagre/board.exp.json @@ -95,6 +95,7 @@ "strokeDash": 5, "strokeWidth": 2, "stroke": "green", + "fill": "lavender", "label": "in style", "fontSize": 16, "fontFamily": "DEFAULT", diff --git a/e2etests/testdata/stable/stylish/dagre/sketch.exp.svg b/e2etests/testdata/stable/stylish/dagre/sketch.exp.svg index f73951c97..8283749e7 100644 --- a/e2etests/testdata/stable/stylish/dagre/sketch.exp.svg +++ b/e2etests/testdata/stable/stylish/dagre/sketch.exp.svg @@ -28,7 +28,7 @@ width="314" height="552" viewBox="-100 -100 314 552">