luciano/d2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix

Browse source
This commit is contained in:
Alexander Wang 2023-01-19 00:46:30 -08:00
parent da4f60a141
commit d832fdd6af
No known key found for this signature in database
GPG key ID: D89FA31966BDBECE
18 changed files with 1081 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
d2renderers/d2sketch/sketch_test.go
View file

@ -326,6 +326,20 @@ a.9 <-> b.9: cf-one-required {
source-arrowhead.shape: cf-one-required
target-arrowhead.shape: cf-one-required
}
`,
},
{
name: "opacity",
script: `x.style.opacity: 0.4
y: |md
linux: because a PC is a terrible thing to waste
| {
style.opacity: 0.4
}
x -> a: {
label: You don't have to know how the computer works,\njust how to work the computer.
style.opacity: 0.4
}
`,
},
}

2
d2renderers/d2sketch/testdata/all_shapes/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 272 KiB

After

Width:  |  Height:  |  Size: 271 KiB

2
d2renderers/d2sketch/testdata/animated/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 253 KiB

After

Width:  |  Height:  |  Size: 253 KiB

2
d2renderers/d2sketch/testdata/arrowheads/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 304 KiB

After

Width:  |  Height:  |  Size: 304 KiB

2
d2renderers/d2sketch/testdata/basic/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 196 KiB

After

Width:  |  Height:  |  Size: 196 KiB

2
d2renderers/d2sketch/testdata/child_to_child/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 248 KiB

After

Width:  |  Height:  |  Size: 248 KiB

2
d2renderers/d2sketch/testdata/class/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 196 KiB

After

Width:  |  Height:  |  Size: 196 KiB

2
d2renderers/d2sketch/testdata/connection_label/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 246 KiB

After

Width:  |  Height:  |  Size: 246 KiB

836
d2renderers/d2sketch/testdata/opacity/sketch.exp.svg vendored Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 307 KiB

10
d2renderers/d2sketch/testdata/sql_tables/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 84 KiB

After

Width:  |  Height:  |  Size: 84 KiB

6
d2renderers/d2sketch/testdata/twitter/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 389 KiB

After

Width:  |  Height:  |  Size: 388 KiB

23
d2renderers/d2svg/d2svg.go
View file

@ -412,7 +412,11 @@ func makeLabelMask(labelTL *geo.Point, width, height int) string {
}
func drawConnection(writer io.Writer, labelMaskID string, connection d2target.Connection, markers map[string]struct{}, idToShape map[string]d2target.Shape, sketchRunner *d2sketch.Runner) (labelMask string, _ error) {
fmt.Fprintf(writer, `<g id="%s">`, svg.EscapeText(connection.ID))
opacityStyle := ""
if connection.Opacity != 1.0 {
opacityStyle = fmt.Sprintf(" style='opacity:%f'", connection.Opacity)
}
fmt.Fprintf(writer, `<g id="%s"%s>`, svg.EscapeText(connection.ID), opacityStyle)
var markerStart string
if connection.SrcArrow != d2target.NoArrowhead {
id := arrowheadMarkerID(false, connection)
@ -651,7 +655,12 @@ func drawShape(writer io.Writer, targetShape d2target.Shape, sketchRunner *d2ske
fmt.Fprintf(writer, `<a href="%s" xlink:href="%[1]s">`, targetShape.Link)
closingTag += "</a>"
}
fmt.Fprintf(writer, `<g id="%s">`, svg.EscapeText(targetShape.ID))
// Opacity is a unique style, it applies to everything for a shape
opacityStyle := ""
if targetShape.Opacity != 1.0 {
opacityStyle = fmt.Sprintf(" style='opacity:%f'", targetShape.Opacity)
}
fmt.Fprintf(writer, `<g id="%s"%s>`, svg.EscapeText(targetShape.ID), opacityStyle)
tl := geo.NewPoint(float64(targetShape.Pos.X), float64(targetShape.Pos.Y))
width := float64(targetShape.Width)
height := float64(targetShape.Height)
@ -839,7 +848,7 @@ func drawShape(writer io.Writer, targetShape d2target.Shape, sketchRunner *d2ske
svgStyles := styleToSVG(style)
containerStyle := fmt.Sprintf(`stroke: %s;fill:%s`, targetShape.Stroke, style.Get(chroma.Background).Background.String())
fmt.Fprintf(writer, `<g transform="translate(%f %f)" style="opacity:%f">`, box.TopLeft.X, box.TopLeft.Y, targetShape.Opacity)
fmt.Fprintf(writer, `<g transform="translate(%f %f)"">`, box.TopLeft.X, box.TopLeft.Y)
fmt.Fprintf(writer, `<rect class="shape" width="%d" height="%d" style="%s" />`,
targetShape.Width, targetShape.Height, containerStyle)
// Padding
@ -864,7 +873,7 @@ func drawShape(writer io.Writer, targetShape d2target.Shape, sketchRunner *d2ske
if err != nil {
return labelMask, err
}
fmt.Fprintf(writer, `<g transform="translate(%f %f)" style="opacity:%f">`, box.TopLeft.X, box.TopLeft.Y, targetShape.Opacity)
fmt.Fprintf(writer, `<g transform="translate(%f %f)">`, box.TopLeft.X, box.TopLeft.Y)
fmt.Fprint(writer, render)
fmt.Fprintf(writer, "</g>")
} else if targetShape.Type == d2target.ShapeText && targetShape.Language != "" {
@ -885,9 +894,6 @@ func drawShape(writer io.Writer, targetShape d2target.Shape, sketchRunner *d2ske
if targetShape.Stroke != "" {
mdStyle += fmt.Sprintf("color:%s;", targetShape.Stroke)
}
if targetShape.Opacity != 1.0 {
mdStyle += fmt.Sprintf("opacity:%f;", targetShape.Opacity)
}
fmt.Fprintf(writer, `<div xmlns="http://www.w3.org/1999/xhtml" class="md" style="%s">%v</div>`, mdStyle, render)
fmt.Fprint(writer, `</foreignObject></g>`)
@ -897,9 +903,6 @@ func drawShape(writer io.Writer, targetShape d2target.Shape, sketchRunner *d2ske
fontColor = targetShape.Color
}
textStyle := fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "middle", targetShape.FontSize, fontColor)
if targetShape.Opacity != 1.0 {
textStyle += fmt.Sprintf(";opacity:%f;", targetShape.Opacity)
}
x := labelTL.X + float64(targetShape.LabelWidth)/2.
// text is vertically positioned at its baseline which is at labelTL+FontSize
y := labelTL.Y + float64(targetShape.FontSize)

2
d2target/d2target.go
View file

@ -173,7 +173,6 @@ func (s Shape) CSSStyle() string {
out += fmt.Sprintf(`fill:%s;`, s.Fill)
out += fmt.Sprintf(`stroke:%s;`, s.Stroke)
}
out += fmt.Sprintf(`opacity:%f;`, s.Opacity)
out += fmt.Sprintf(`stroke-width:%d;`, s.StrokeWidth)
if s.StrokeDash != 0 {
dashSize, gapSize := svg.GetStrokeDashAttributes(float64(s.StrokeWidth), s.StrokeDash)
@ -279,7 +278,6 @@ func (c Connection) CSSStyle() string {
out := ""
out += fmt.Sprintf(`stroke:%s;`, c.Stroke)
out += fmt.Sprintf(`opacity:%f;`, c.Opacity)
out += fmt.Sprintf(`stroke-width:%d;`, c.StrokeWidth)
strokeDash := c.StrokeDash
if strokeDash == 0 && c.Animated {

4
e2etests/regression_test.go
View file

@ -390,6 +390,10 @@ y: |md
| {
style.opacity: 0.4
}
x -> a: {
label: You don't have to know how the computer works,\njust how to work the computer.
style.opacity: 0.4
}
`,
},
}

95
e2etests/testdata/regression/opacity-on-label/dagre/board.exp.json generated vendored
View file

@ -6,7 +6,7 @@
"id": "x",
"type": "",
"pos": {
"x": 0,
"x": 105,
"y": 0
},
"width": 113,
@ -46,7 +46,7 @@
"id": "y",
"type": "text",
"pos": {
"x": 173,
"x": 278,
"y": 51
},
"width": 304,
@ -80,7 +80,96 @@
"labelHeight": 24,
"zIndex": 0,
"level": 1
},
{
"id": "a",
"type": "",
"pos": {
"x": 105,
"y": 263
},
"width": 113,
"height": 126,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "#F7F8FE",
"stroke": "#0D32B2",
"shadow": false,
"3d": false,
"multiple": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"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": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
}
],
"connections": []
"connections": [
{
"id": "(x -> a)[0]",
"src": "x",
"srcArrow": "none",
"srcLabel": "",
"dst": "a",
"dstArrow": "triangle",
"dstLabel": "",
"opacity": 0.4,
"strokeDash": 0,
"strokeWidth": 2,
"stroke": "#0D32B2",
"label": "You don't have to know how the computer works,\njust how to work the computer.",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "#676C7E",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 322,
"labelHeight": 37,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPercentage": 0,
"route": [
{
"x": 161,
"y": 126
},
{
"x": 161,
"y": 180.8
},
{
"x": 161,
"y": 208.3
},
{
"x": 161,
"y": 263.5
}
],
"isCurve": true,
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
}
]
}

17
e2etests/testdata/regression/opacity-on-label/dagre/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 660 KiB

After

Width:  |  Height:  |  Size: 804 KiB

86
e2etests/testdata/regression/opacity-on-label/elk/board.exp.json generated vendored
View file

@ -6,7 +6,7 @@
"id": "x",
"type": "",
"pos": {
"x": 12,
"x": 116,
"y": 12
},
"width": 113,
@ -46,7 +46,7 @@
"id": "y",
"type": "text",
"pos": {
"x": 145,
"x": 249,
"y": 63
},
"width": 304,
@ -80,7 +80,87 @@
"labelHeight": 24,
"zIndex": 0,
"level": 1
},
{
"id": "a",
"type": "",
"pos": {
"x": 116,
"y": 375
},
"width": 113,
"height": 126,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "#F7F8FE",
"stroke": "#0D32B2",
"shadow": false,
"3d": false,
"multiple": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"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": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
}
],
"connections": []
"connections": [
{
"id": "(x -> a)[0]",
"src": "x",
"srcArrow": "none",
"srcLabel": "",
"dst": "a",
"dstArrow": "triangle",
"dstLabel": "",
"opacity": 0.4,
"strokeDash": 0,
"strokeWidth": 2,
"stroke": "#0D32B2",
"label": "You don't have to know how the computer works,\njust how to work the computer.",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "#676C7E",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 322,
"labelHeight": 37,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPercentage": 0,
"route": [
{
"x": 173,
"y": 138
},
{
"x": 173,
"y": 375
}
],
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
}
]
}

17
e2etests/testdata/regression/opacity-on-label/elk/sketch.exp.svg vendored
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 660 KiB

After

Width:  |  Height:  |  Size: 804 KiB