diff --git a/d2compiler/compile.go b/d2compiler/compile.go index 28c6ba7f2..35bf27c37 100644 --- a/d2compiler/compile.go +++ b/d2compiler/compile.go @@ -356,7 +356,14 @@ func (c *compiler) compileField(obj *d2graph.Object, f *d2ir.Field) { parent := obj obj = obj.EnsureChild(([]d2ast.String{f.Name})) if f.Primary() != nil { + var s string + if obj.OuterSequenceDiagram() != nil { + s = obj.Attributes.Shape.Value + } c.compileLabel(&obj.Attributes, f) + if s != "" { + obj.Attributes.Shape.Value = s + } } if f.Map() != nil { c.compileMap(obj, f.Map()) diff --git a/d2graph/d2graph.go b/d2graph/d2graph.go index 2fa0a4115..d47b31977 100644 --- a/d2graph/d2graph.go +++ b/d2graph/d2graph.go @@ -955,7 +955,7 @@ func (obj *Object) GetLabelSize(mtexts []*d2target.MText, ruler *textmeasure.Rul return nil, err } dims = d2target.NewTextDimensions(width, height) - } else if obj.Language != "" { + } else if obj.Language != "" && shapeType != d2target.ShapeCode { var err error dims, err = getMarkdownDimensions(mtexts, ruler, obj.Text(), fontFamily) if err != nil { diff --git a/d2renderers/d2svg/d2svg.go b/d2renderers/d2svg/d2svg.go index a105abaa9..974ac60aa 100644 --- a/d2renderers/d2svg/d2svg.go +++ b/d2renderers/d2svg/d2svg.go @@ -1420,7 +1420,23 @@ func drawShape(writer, appendixWriter io.Writer, diagramHash string, targetShape return labelMask, err } gEl := d2themes.NewThemableElement("g", inlineTheme) - gEl.SetTranslate(float64(box.TopLeft.X), float64(box.TopLeft.Y)) + + labelPosition := label.FromString(targetShape.LabelPosition) + if labelPosition == label.Unset { + labelPosition = label.InsideMiddleCenter + } + var box *geo.Box + if labelPosition.IsOutside() { + box = s.GetBox() + } else { + box = s.GetInnerBox() + } + labelTL := labelPosition.GetPointOnBox(box, label.PADDING, + float64(targetShape.LabelWidth), + float64(targetShape.LabelHeight), + ) + gEl.SetTranslate(labelTL.X, labelTL.Y) + gEl.Color = targetShape.Stroke gEl.Content = render fmt.Fprint(writer, gEl.Render()) @@ -1429,9 +1445,26 @@ func drawShape(writer, appendixWriter io.Writer, diagramHash string, targetShape if err != nil { return labelMask, err } - fmt.Fprintf(writer, ``, - box.TopLeft.X, box.TopLeft.Y, targetShape.Width, targetShape.Height, + + labelPosition := label.FromString(targetShape.LabelPosition) + if labelPosition == label.Unset { + labelPosition = label.InsideMiddleCenter + } + var box *geo.Box + if labelPosition.IsOutside() { + box = s.GetBox() + } else { + box = s.GetInnerBox() + } + labelTL := labelPosition.GetPointOnBox(box, label.PADDING, + float64(targetShape.LabelWidth), + float64(targetShape.LabelHeight), ) + + fmt.Fprintf(writer, ``, + labelTL.X, labelTL.Y, targetShape.LabelWidth, targetShape.LabelHeight, + ) + // we need the self closing form in this svg/xhtml context render = strings.ReplaceAll(render, "
", "
") diff --git a/e2etests/testdata/txtar/md-label/dagre/board.exp.json b/e2etests/testdata/txtar/md-label/dagre/board.exp.json index ca5395c76..424408a9d 100644 --- a/e2etests/testdata/txtar/md-label/dagre/board.exp.json +++ b/e2etests/testdata/txtar/md-label/dagre/board.exp.json @@ -1,5 +1,13 @@ { "name": "", + "config": { + "sketch": false, + "themeID": 0, + "darkThemeID": null, + "pad": null, + "center": null, + "layoutEngine": null + }, "isFolderOnly": false, "fontFamily": "SourceSansPro", "shapes": [ @@ -18,6 +26,7 @@ "borderRadius": 0, "fill": "B6", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -59,6 +68,7 @@ "borderRadius": 0, "fill": "B6", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -100,6 +110,7 @@ "borderRadius": 0, "fill": "AB4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -141,6 +152,7 @@ "borderRadius": 0, "fill": "N5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -182,6 +194,7 @@ "borderRadius": 0, "fill": "AB4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -223,6 +236,7 @@ "borderRadius": 0, "fill": "AA4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -264,6 +278,7 @@ "borderRadius": 0, "fill": "N5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -305,6 +320,7 @@ "borderRadius": 0, "fill": "AA4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -346,6 +362,7 @@ "borderRadius": 0, "fill": "AB4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -387,6 +404,7 @@ "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -428,6 +446,7 @@ "borderRadius": 0, "fill": "AA4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -469,6 +488,7 @@ "borderRadius": 0, "fill": "B3", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -510,6 +530,7 @@ "borderRadius": 0, "fill": "N4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -551,6 +572,7 @@ "borderRadius": 0, "fill": "B6", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -592,6 +614,7 @@ "borderRadius": 0, "fill": "B6", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -633,6 +656,7 @@ "borderRadius": 0, "fill": "N5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -674,6 +698,7 @@ "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -718,6 +743,7 @@ "borderRadius": 0, "fill": "N7", "stroke": "", + "animated": false, "shadow": false, "3d": false, "multiple": false, diff --git a/e2etests/testdata/txtar/md-label/dagre/sketch.exp.svg b/e2etests/testdata/txtar/md-label/dagre/sketch.exp.svg index 53ab94c0a..66822ca58 100644 --- a/e2etests/testdata/txtar/md-label/dagre/sketch.exp.svg +++ b/e2etests/testdata/txtar/md-label/dagre/sketch.exp.svg @@ -1,13 +1,13 @@ -

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-
+
diff --git a/e2etests/testdata/txtar/md-label/elk/board.exp.json b/e2etests/testdata/txtar/md-label/elk/board.exp.json index 79cc92a57..221922f89 100644 --- a/e2etests/testdata/txtar/md-label/elk/board.exp.json +++ b/e2etests/testdata/txtar/md-label/elk/board.exp.json @@ -1,5 +1,13 @@ { "name": "", + "config": { + "sketch": false, + "themeID": 0, + "darkThemeID": null, + "pad": null, + "center": null, + "layoutEngine": null + }, "isFolderOnly": false, "fontFamily": "SourceSansPro", "shapes": [ @@ -18,6 +26,7 @@ "borderRadius": 0, "fill": "B6", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -59,6 +68,7 @@ "borderRadius": 0, "fill": "B6", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -100,6 +110,7 @@ "borderRadius": 0, "fill": "AB4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -141,6 +152,7 @@ "borderRadius": 0, "fill": "N5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -182,6 +194,7 @@ "borderRadius": 0, "fill": "AB4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -223,6 +236,7 @@ "borderRadius": 0, "fill": "AA4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -264,6 +278,7 @@ "borderRadius": 0, "fill": "N5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -305,6 +320,7 @@ "borderRadius": 0, "fill": "AA4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -346,6 +362,7 @@ "borderRadius": 0, "fill": "AB4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -387,6 +404,7 @@ "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -428,6 +446,7 @@ "borderRadius": 0, "fill": "AA4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -469,6 +488,7 @@ "borderRadius": 0, "fill": "B3", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -510,6 +530,7 @@ "borderRadius": 0, "fill": "N4", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -551,6 +572,7 @@ "borderRadius": 0, "fill": "B6", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -592,6 +614,7 @@ "borderRadius": 0, "fill": "B6", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -633,6 +656,7 @@ "borderRadius": 0, "fill": "N5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -674,6 +698,7 @@ "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -718,6 +743,7 @@ "borderRadius": 0, "fill": "N7", "stroke": "", + "animated": false, "shadow": false, "3d": false, "multiple": false, diff --git a/e2etests/testdata/txtar/md-label/elk/sketch.exp.svg b/e2etests/testdata/txtar/md-label/elk/sketch.exp.svg index 0e7aef997..14c2e2e9c 100644 --- a/e2etests/testdata/txtar/md-label/elk/sketch.exp.svg +++ b/e2etests/testdata/txtar/md-label/elk/sketch.exp.svg @@ -1,13 +1,13 @@ -

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-

hello

+

hello

  • world

blah blah

-
+
diff --git a/e2etests/testdata/txtar/sequence-diagram-note-md/dagre/board.exp.json b/e2etests/testdata/txtar/sequence-diagram-note-md/dagre/board.exp.json index 4ed4a2f6e..d067a7fab 100644 --- a/e2etests/testdata/txtar/sequence-diagram-note-md/dagre/board.exp.json +++ b/e2etests/testdata/txtar/sequence-diagram-note-md/dagre/board.exp.json @@ -1,5 +1,13 @@ { "name": "", + "config": { + "sketch": false, + "themeID": 0, + "darkThemeID": null, + "pad": null, + "center": null, + "layoutEngine": null + }, "isFolderOnly": false, "fontFamily": "SourceSansPro", "shapes": [ @@ -18,6 +26,7 @@ "borderRadius": 0, "fill": "B5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -48,7 +57,7 @@ "id": "y", "type": "rectangle", "pos": { - "x": 242, + "x": 265, "y": 52 }, "width": 100, @@ -59,6 +68,7 @@ "borderRadius": 0, "fill": "B5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -89,17 +99,18 @@ "id": "x.x", "type": "page", "pos": { - "x": -128, - "y": 258 + "x": -150, + "y": 279 }, - "width": 380, - "height": 119, + "width": 425, + "height": 164, "opacity": 1, "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -130,17 +141,18 @@ "id": "y.z", "type": "page", "pos": { - "x": 211, - "y": 447 + "x": 155, + "y": 513 }, - "width": 162, - "height": 41, + "width": 320, + "height": 64, "opacity": 1, "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -161,8 +173,8 @@ "italic": false, "bold": false, "underline": false, - "labelWidth": 162, - "labelHeight": 41, + "labelWidth": 275, + "labelHeight": 19, "labelPosition": "INSIDE_MIDDLE_CENTER", "zIndex": 5, "level": 2 @@ -171,17 +183,18 @@ "id": "x.z", "type": "page", "pos": { - "x": 27, - "y": 558 + "x": 13, + "y": 647 }, - "width": 69, - "height": 40, + "width": 98, + "height": 69, "opacity": 1, "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -233,14 +246,15 @@ "labelHeight": 21, "labelPosition": "INSIDE_MIDDLE_CENTER", "labelPercentage": 0, + "link": "", "route": [ { "x": 62, - "y": 188 + "y": 198 }, { - "x": 292, - "y": 188 + "x": 315, + "y": 198 } ], "animated": false, @@ -271,6 +285,7 @@ "labelHeight": 0, "labelPosition": "", "labelPercentage": 0, + "link": "", "route": [ { "x": 62, @@ -278,7 +293,7 @@ }, { "x": 62, - "y": 668 + "y": 786 } ], "animated": false, @@ -309,14 +324,15 @@ "labelHeight": 0, "labelPosition": "", "labelPercentage": 0, + "link": "", "route": [ { - "x": 292, + "x": 315, "y": 118 }, { - "x": 292, - "y": 668 + "x": 315, + "y": 786 } ], "animated": false, @@ -340,6 +356,7 @@ "borderRadius": 0, "fill": "N7", "stroke": "", + "animated": false, "shadow": false, "3d": false, "multiple": false, diff --git a/e2etests/testdata/txtar/sequence-diagram-note-md/dagre/sketch.exp.svg b/e2etests/testdata/txtar/sequence-diagram-note-md/dagre/sketch.exp.svg index dfd8ff0d8..d8d19fe2e 100644 --- a/e2etests/testdata/txtar/sequence-diagram-note-md/dagre/sketch.exp.svg +++ b/e2etests/testdata/txtar/sequence-diagram-note-md/dagre/sketch.exp.svg @@ -1,34 +1,34 @@ -xy hello

A man who fishes for marlin in ponds

+xy hello

A man who fishes for marlin in ponds

  • ...dramatic pause

will put his money in Etruscan bonds.

-
1 + 1 = 21 + 1 = 2 - +
1 + 1 = 21 + 1 = 2 + - - - - - + + + + +
\ No newline at end of file diff --git a/e2etests/testdata/txtar/sequence-diagram-note-md/elk/board.exp.json b/e2etests/testdata/txtar/sequence-diagram-note-md/elk/board.exp.json index 4ed4a2f6e..d067a7fab 100644 --- a/e2etests/testdata/txtar/sequence-diagram-note-md/elk/board.exp.json +++ b/e2etests/testdata/txtar/sequence-diagram-note-md/elk/board.exp.json @@ -1,5 +1,13 @@ { "name": "", + "config": { + "sketch": false, + "themeID": 0, + "darkThemeID": null, + "pad": null, + "center": null, + "layoutEngine": null + }, "isFolderOnly": false, "fontFamily": "SourceSansPro", "shapes": [ @@ -18,6 +26,7 @@ "borderRadius": 0, "fill": "B5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -48,7 +57,7 @@ "id": "y", "type": "rectangle", "pos": { - "x": 242, + "x": 265, "y": 52 }, "width": 100, @@ -59,6 +68,7 @@ "borderRadius": 0, "fill": "B5", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -89,17 +99,18 @@ "id": "x.x", "type": "page", "pos": { - "x": -128, - "y": 258 + "x": -150, + "y": 279 }, - "width": 380, - "height": 119, + "width": 425, + "height": 164, "opacity": 1, "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -130,17 +141,18 @@ "id": "y.z", "type": "page", "pos": { - "x": 211, - "y": 447 + "x": 155, + "y": 513 }, - "width": 162, - "height": 41, + "width": 320, + "height": 64, "opacity": 1, "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -161,8 +173,8 @@ "italic": false, "bold": false, "underline": false, - "labelWidth": 162, - "labelHeight": 41, + "labelWidth": 275, + "labelHeight": 19, "labelPosition": "INSIDE_MIDDLE_CENTER", "zIndex": 5, "level": 2 @@ -171,17 +183,18 @@ "id": "x.z", "type": "page", "pos": { - "x": 27, - "y": 558 + "x": 13, + "y": 647 }, - "width": 69, - "height": 40, + "width": 98, + "height": 69, "opacity": 1, "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, "fill": "N7", "stroke": "B1", + "animated": false, "shadow": false, "3d": false, "multiple": false, @@ -233,14 +246,15 @@ "labelHeight": 21, "labelPosition": "INSIDE_MIDDLE_CENTER", "labelPercentage": 0, + "link": "", "route": [ { "x": 62, - "y": 188 + "y": 198 }, { - "x": 292, - "y": 188 + "x": 315, + "y": 198 } ], "animated": false, @@ -271,6 +285,7 @@ "labelHeight": 0, "labelPosition": "", "labelPercentage": 0, + "link": "", "route": [ { "x": 62, @@ -278,7 +293,7 @@ }, { "x": 62, - "y": 668 + "y": 786 } ], "animated": false, @@ -309,14 +324,15 @@ "labelHeight": 0, "labelPosition": "", "labelPercentage": 0, + "link": "", "route": [ { - "x": 292, + "x": 315, "y": 118 }, { - "x": 292, - "y": 668 + "x": 315, + "y": 786 } ], "animated": false, @@ -340,6 +356,7 @@ "borderRadius": 0, "fill": "N7", "stroke": "", + "animated": false, "shadow": false, "3d": false, "multiple": false, diff --git a/e2etests/testdata/txtar/sequence-diagram-note-md/elk/sketch.exp.svg b/e2etests/testdata/txtar/sequence-diagram-note-md/elk/sketch.exp.svg index dfd8ff0d8..d8d19fe2e 100644 --- a/e2etests/testdata/txtar/sequence-diagram-note-md/elk/sketch.exp.svg +++ b/e2etests/testdata/txtar/sequence-diagram-note-md/elk/sketch.exp.svg @@ -1,34 +1,34 @@ -xy hello

A man who fishes for marlin in ponds

+xy hello

A man who fishes for marlin in ponds

  • ...dramatic pause

will put his money in Etruscan bonds.

-
1 + 1 = 21 + 1 = 2 - +
1 + 1 = 21 + 1 = 2 + - - - - - + + + + +
\ No newline at end of file