Merge pull request #127 from alixander/dagre-image-label

layout: dagre & elk image label
This commit is contained in:
Alexander Wang 2022-11-21 14:16:05 -08:00 committed by GitHub
commit 54206a2c19
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 371 additions and 9 deletions

View file

@ -1,15 +1,15 @@
For v0.0.99 we focused on X, Y and Z. Enjoy! #### Features 🚀
#### Features 💸 - Ability to export to PNG.
- Ability to export to PNG
- Now you can easily do x, y and z #9999
#### Improvements 🔧 #### Improvements 🔧
- Equivalency between flags and environment variables. You can set either one for all - There is now equivalency between CLI flags and environment variables. For any option,
options (flags take precedence). you can set either the flag or its equivalent environment variable (flags take
precedence). See `d2 --help` for more.
- Install script now uses `brew` for macOS machines with `brew` installed.
#### Bugfixes 🔴 #### Bugfixes 🔴
- Fixes something or the other #9999 - Labels for Image shapes in dagre and ELK are now placed above the shape, to not overlap
with the actual image.

View file

@ -1,6 +1,6 @@
For v0.0.99 we focused on X, Y and Z. Enjoy! For v0.0.99 we focused on X, Y and Z. Enjoy!
#### Features 💸 #### Features 🚀
- Now you can easily do x, y and z #9999 - Now you can easily do x, y and z #9999

View file

@ -135,6 +135,8 @@ func Layout(ctx context.Context, d2graph *d2graph.Graph) (err error) {
if obj.LabelWidth != nil && obj.LabelHeight != nil { if obj.LabelWidth != nil && obj.LabelHeight != nil {
if len(obj.ChildrenArray) > 0 { if len(obj.ChildrenArray) > 0 {
obj.LabelPosition = go2.Pointer(string(label.InsideTopCenter)) obj.LabelPosition = go2.Pointer(string(label.InsideTopCenter))
} else if obj.Attributes.Shape.Value == d2target.ShapeImage {
obj.LabelPosition = go2.Pointer(string(label.OutsideTopCenter))
} else { } else {
obj.LabelPosition = go2.Pointer(string(label.InsideMiddleCenter)) obj.LabelPosition = go2.Pointer(string(label.InsideMiddleCenter))
} }

View file

@ -16,6 +16,7 @@ import (
"oss.terrastruct.com/xdefer" "oss.terrastruct.com/xdefer"
"oss.terrastruct.com/d2/d2graph" "oss.terrastruct.com/d2/d2graph"
"oss.terrastruct.com/d2/d2target"
"oss.terrastruct.com/d2/lib/geo" "oss.terrastruct.com/d2/lib/geo"
"oss.terrastruct.com/d2/lib/go2" "oss.terrastruct.com/d2/lib/go2"
"oss.terrastruct.com/d2/lib/label" "oss.terrastruct.com/d2/lib/label"
@ -240,6 +241,8 @@ func Layout(ctx context.Context, g *d2graph.Graph) (err error) {
if obj.LabelWidth != nil && obj.LabelHeight != nil { if obj.LabelWidth != nil && obj.LabelHeight != nil {
if len(obj.ChildrenArray) > 0 { if len(obj.ChildrenArray) > 0 {
obj.LabelPosition = go2.Pointer(string(label.InsideTopCenter)) obj.LabelPosition = go2.Pointer(string(label.InsideTopCenter))
} else if obj.Attributes.Shape.Value == d2target.ShapeImage {
obj.LabelPosition = go2.Pointer(string(label.OutsideTopCenter))
} else { } else {
obj.LabelPosition = go2.Pointer(string(label.InsideMiddleCenter)) obj.LabelPosition = go2.Pointer(string(label.InsideMiddleCenter))
} }

View file

@ -6,6 +6,7 @@ import (
) )
// based on https://github.com/mxstbr/markdown-test-file // based on https://github.com/mxstbr/markdown-test-file
//
//go:embed markdowntest.md //go:embed markdowntest.md
var testMarkdown string var testMarkdown string
@ -868,6 +869,19 @@ shipments: {
users.id <-> orders.user_id users.id <-> orders.user_id
products.id <-> orders.product_id products.id <-> orders.product_id
shipments.order_id <-> orders.id`, shipments.order_id <-> orders.id`,
}, {
name: "images",
script: `a: {
shape: image
icon: https://icons.terrastruct.com/essentials/004-picture.svg
}
b: {
shape: image
icon: https://icons.terrastruct.com/essentials/004-picture.svg
}
a -> b
`,
}, },
} }

View file

@ -0,0 +1,152 @@
{
"name": "",
"shapes": [
{
"id": "a",
"type": "image",
"pos": {
"x": 0,
"y": 0
},
"width": 128,
"height": 128,
"level": 1,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "#FFFFFF",
"stroke": "#0D32B2",
"shadow": false,
"3d": false,
"multiple": false,
"tooltip": "",
"link": "",
"icon": {
"Scheme": "https",
"Opaque": "",
"User": null,
"Host": "icons.terrastruct.com",
"Path": "/essentials/004-picture.svg",
"RawPath": "",
"ForceQuery": false,
"RawQuery": "",
"Fragment": "",
"RawFragment": ""
},
"iconPosition": "INSIDE_MIDDLE_CENTER",
"fields": null,
"methods": null,
"columns": null,
"label": "a",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "#0A0F25",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 13,
"labelHeight": 26,
"labelPosition": "OUTSIDE_TOP_CENTER"
},
{
"id": "b",
"type": "image",
"pos": {
"x": 0,
"y": 228
},
"width": 128,
"height": 128,
"level": 1,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "#FFFFFF",
"stroke": "#0D32B2",
"shadow": false,
"3d": false,
"multiple": false,
"tooltip": "",
"link": "",
"icon": {
"Scheme": "https",
"Opaque": "",
"User": null,
"Host": "icons.terrastruct.com",
"Path": "/essentials/004-picture.svg",
"RawPath": "",
"ForceQuery": false,
"RawQuery": "",
"Fragment": "",
"RawFragment": ""
},
"iconPosition": "INSIDE_MIDDLE_CENTER",
"fields": null,
"methods": null,
"columns": null,
"label": "b",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "#0A0F25",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 13,
"labelHeight": 26,
"labelPosition": "OUTSIDE_TOP_CENTER"
}
],
"connections": [
{
"id": "(a -> b)[0]",
"src": "a",
"srcArrow": "none",
"srcLabel": "",
"dst": "b",
"dstArrow": "triangle",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"stroke": "#0D32B2",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "#676C7E",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 64,
"y": 128
},
{
"x": 64,
"y": 168
},
{
"x": 64,
"y": 188
},
{
"x": 64,
"y": 228
}
],
"isCurve": true,
"animated": false,
"tooltip": "",
"icon": null
}
]
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 324 KiB

View file

@ -0,0 +1,143 @@
{
"name": "",
"shapes": [
{
"id": "a",
"type": "image",
"pos": {
"x": 12,
"y": 12
},
"width": 128,
"height": 128,
"level": 1,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "#FFFFFF",
"stroke": "#0D32B2",
"shadow": false,
"3d": false,
"multiple": false,
"tooltip": "",
"link": "",
"icon": {
"Scheme": "https",
"Opaque": "",
"User": null,
"Host": "icons.terrastruct.com",
"Path": "/essentials/004-picture.svg",
"RawPath": "",
"ForceQuery": false,
"RawQuery": "",
"Fragment": "",
"RawFragment": ""
},
"iconPosition": "INSIDE_MIDDLE_CENTER",
"fields": null,
"methods": null,
"columns": null,
"label": "a",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "#0A0F25",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 13,
"labelHeight": 26,
"labelPosition": "OUTSIDE_TOP_CENTER"
},
{
"id": "b",
"type": "image",
"pos": {
"x": 240,
"y": 12
},
"width": 128,
"height": 128,
"level": 1,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "#FFFFFF",
"stroke": "#0D32B2",
"shadow": false,
"3d": false,
"multiple": false,
"tooltip": "",
"link": "",
"icon": {
"Scheme": "https",
"Opaque": "",
"User": null,
"Host": "icons.terrastruct.com",
"Path": "/essentials/004-picture.svg",
"RawPath": "",
"ForceQuery": false,
"RawQuery": "",
"Fragment": "",
"RawFragment": ""
},
"iconPosition": "INSIDE_MIDDLE_CENTER",
"fields": null,
"methods": null,
"columns": null,
"label": "b",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "#0A0F25",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 13,
"labelHeight": 26,
"labelPosition": "OUTSIDE_TOP_CENTER"
}
],
"connections": [
{
"id": "(a -> b)[0]",
"src": "a",
"srcArrow": "none",
"srcLabel": "",
"dst": "b",
"dstArrow": "triangle",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"stroke": "#0D32B2",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "#676C7E",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 140,
"y": 76
},
{
"x": 240,
"y": 76
}
],
"animated": false,
"tooltip": "",
"icon": null
}
]
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 324 KiB