render 3d keyword
Gavin Nishizawa
|
|
@ -22,6 +22,7 @@ import (
|
|||
"oss.terrastruct.com/d2/d2renderers/d2fonts"
|
||||
"oss.terrastruct.com/d2/d2renderers/textmeasure"
|
||||
"oss.terrastruct.com/d2/d2target"
|
||||
"oss.terrastruct.com/d2/lib/color"
|
||||
"oss.terrastruct.com/d2/lib/geo"
|
||||
"oss.terrastruct.com/d2/lib/go2"
|
||||
"oss.terrastruct.com/d2/lib/label"
|
||||
|
|
@ -31,6 +32,7 @@ import (
|
|||
const (
|
||||
padding = 100
|
||||
MIN_ARROWHEAD_STROKE_WIDTH = 2
|
||||
threeDeeOffset = 15
|
||||
)
|
||||
|
||||
var multipleOffset = geo.NewVector(10, -10)
|
||||
|
|
@ -474,7 +476,7 @@ func drawShape(writer io.Writer, targetShape d2target.Shape) error {
|
|||
s := shape.NewShape(shapeType, geo.NewBox(tl, width, height))
|
||||
|
||||
var shadowAttr string
|
||||
if targetShape.Shadow && d2target.IsShape(targetShape.Type) {
|
||||
if targetShape.Shadow {
|
||||
switch targetShape.Type {
|
||||
case d2target.ShapeText,
|
||||
d2target.ShapeCode,
|
||||
|
|
@ -512,6 +514,41 @@ func drawShape(writer io.Writer, targetShape d2target.Shape) error {
|
|||
|
||||
// TODO should standardize "" to rectangle
|
||||
case d2target.ShapeRectangle, "":
|
||||
if targetShape.ThreeDee {
|
||||
darkerColor, err := color.Darken(targetShape.Fill)
|
||||
if err != nil {
|
||||
darkerColor = targetShape.Fill
|
||||
}
|
||||
|
||||
var topPolygonPoints []string
|
||||
for _, v := range []d2target.Point{
|
||||
{X: 0, Y: 0},
|
||||
{X: threeDeeOffset, Y: -1 * threeDeeOffset},
|
||||
{X: targetShape.Width + threeDeeOffset, Y: -1 * threeDeeOffset},
|
||||
{X: targetShape.Width, Y: 0},
|
||||
{X: 0, Y: 0},
|
||||
} {
|
||||
topPolygonPoints = append(topPolygonPoints,
|
||||
fmt.Sprintf("%d,%d ", v.X+targetShape.Pos.X, v.Y+targetShape.Pos.Y),
|
||||
)
|
||||
}
|
||||
fmt.Fprintf(writer, `<polygon points="%s" style="fill:%s;"/>`,
|
||||
strings.Join(topPolygonPoints, ""), darkerColor)
|
||||
|
||||
var rightPolygonPoints []string
|
||||
for _, v := range []d2target.Point{
|
||||
{X: targetShape.Width, Y: 0},
|
||||
{X: targetShape.Width + threeDeeOffset, Y: -1 * threeDeeOffset},
|
||||
{X: targetShape.Width + threeDeeOffset, Y: targetShape.Height - threeDeeOffset},
|
||||
{X: targetShape.Width, Y: targetShape.Height},
|
||||
} {
|
||||
rightPolygonPoints = append(rightPolygonPoints,
|
||||
fmt.Sprintf("%d,%d ", v.X+targetShape.Pos.X, v.Y+targetShape.Pos.Y),
|
||||
)
|
||||
}
|
||||
fmt.Fprintf(writer, `<polygon points="%s" style="fill:%s;"/>`,
|
||||
strings.Join(rightPolygonPoints, ""), darkerColor)
|
||||
}
|
||||
if targetShape.Multiple {
|
||||
fmt.Fprintf(writer, `<rect x="%d" y="%d" width="%d" height="%d"/>`,
|
||||
targetShape.Pos.X+10, targetShape.Pos.Y-10, targetShape.Width, targetShape.Height)
|
||||
|
|
@ -804,6 +841,7 @@ func Render(diagram *d2target.Diagram) ([]byte, error) {
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1539" height="824" viewBox="-100 -100 1539 824"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1539" height="824" viewBox="-100 -100 1539 824"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1539" height="824" viewBox="-100 -100 1539 824"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="480" height="778" viewBox="-100 -100 480 778"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1518" height="1004" viewBox="-100 -100 1518 1004"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="634" height="652" viewBox="-100 -100 634 652"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1317" height="1854" viewBox="-100 -100 1317 1854"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="694" height="626" viewBox="-100 -100 694 626"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="313" height="778" viewBox="-100 -100 313 778"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="955" height="818" viewBox="-100 -100 955 818"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="494" height="1178" viewBox="-100 -100 494 1178"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="786" height="1530" viewBox="-100 -100 786 1530"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1590" height="1682" viewBox="-100 -100 1590 1682"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="2542" height="1104" viewBox="-100 -100 2542 1104"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="3251" height="5500" viewBox="-100 -100 3251 5500"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="938" height="786" viewBox="-100 -100 938 786"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1011" height="4426" viewBox="-100 -100 1011 4426"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="3244" height="1780" viewBox="-100 -100 3244 1780"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="579" height="752" viewBox="-100 -100 579 752"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="445" height="728" viewBox="-100 -100 445 728"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="547" height="1164" viewBox="-100 -100 547 1164"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1120" height="1028" viewBox="-100 -100 1120 1028"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="466" height="702" viewBox="-100 -100 466 702"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="731" height="838" viewBox="-100 -100 731 838"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="396" height="763" viewBox="-100 -100 396 763"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="412" height="803" viewBox="-100 -100 412 803"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="313" height="676" viewBox="-100 -100 313 676"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="402" height="358" viewBox="-100 -100 402 358"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1950" height="1456" viewBox="-100 -100 1950 1456"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="1354" height="1908" viewBox="-150 -100 1354 1908"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="679" height="1330" viewBox="-100 -100 679 1330"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="706" height="978" viewBox="-100 -100 706 978"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="2057" height="676" viewBox="-100 -100 2057 676"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="802" height="822" viewBox="-100 -100 802 822"><style type="text/css">
|
|||
<![CDATA[
|
||||
.shape {
|
||||
shape-rendering: geometricPrecision;
|
||||
stroke-linejoin: round;
|
||||
}
|
||||
.connection {
|
||||
stroke-linecap: round;
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 841 KiB After Width: | Height: | Size: 841 KiB |
130
e2etests/testdata/stable/square_3d/board.exp.json
vendored
Normal file
|
|
@ -0,0 +1,130 @@
|
|||
{
|
||||
"name": "",
|
||||
"shapes": [
|
||||
{
|
||||
"id": "rectangle",
|
||||
"type": "rectangle",
|
||||
"pos": {
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"width": 171,
|
||||
"height": 126,
|
||||
"level": 1,
|
||||
"opacity": 1,
|
||||
"strokeDash": 0,
|
||||
"strokeWidth": 2,
|
||||
"borderRadius": 0,
|
||||
"fill": "#F7F8FE",
|
||||
"stroke": "#0D32B2",
|
||||
"shadow": false,
|
||||
"3d": true,
|
||||
"multiple": false,
|
||||
"tooltip": "",
|
||||
"link": "",
|
||||
"icon": null,
|
||||
"iconPosition": "",
|
||||
"fields": null,
|
||||
"methods": null,
|
||||
"columns": null,
|
||||
"label": "rectangle",
|
||||
"fontSize": 16,
|
||||
"fontFamily": "DEFAULT",
|
||||
"language": "",
|
||||
"color": "#0A0F25",
|
||||
"italic": false,
|
||||
"bold": true,
|
||||
"underline": false,
|
||||
"labelWidth": 71,
|
||||
"labelHeight": 26,
|
||||
"labelPosition": "INSIDE_MIDDLE_CENTER"
|
||||
},
|
||||
{
|
||||
"id": "square",
|
||||
"type": "rectangle",
|
||||
"pos": {
|
||||
"x": 9,
|
||||
"y": 226
|
||||
},
|
||||
"width": 154,
|
||||
"height": 154,
|
||||
"level": 1,
|
||||
"opacity": 1,
|
||||
"strokeDash": 0,
|
||||
"strokeWidth": 2,
|
||||
"borderRadius": 0,
|
||||
"fill": "#F7F8FE",
|
||||
"stroke": "#0D32B2",
|
||||
"shadow": false,
|
||||
"3d": true,
|
||||
"multiple": false,
|
||||
"tooltip": "",
|
||||
"link": "",
|
||||
"icon": null,
|
||||
"iconPosition": "",
|
||||
"fields": null,
|
||||
"methods": null,
|
||||
"columns": null,
|
||||
"label": "square",
|
||||
"fontSize": 16,
|
||||
"fontFamily": "DEFAULT",
|
||||
"language": "",
|
||||
"color": "#0A0F25",
|
||||
"italic": false,
|
||||
"bold": true,
|
||||
"underline": false,
|
||||
"labelWidth": 54,
|
||||
"labelHeight": 26,
|
||||
"labelPosition": "INSIDE_MIDDLE_CENTER"
|
||||
}
|
||||
],
|
||||
"connections": [
|
||||
{
|
||||
"id": "(rectangle -> square)[0]",
|
||||
"src": "rectangle",
|
||||
"srcArrow": "none",
|
||||
"srcLabel": "",
|
||||
"dst": "square",
|
||||
"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": 85.5,
|
||||
"y": 126
|
||||
},
|
||||
{
|
||||
"x": 85.5,
|
||||
"y": 166
|
||||
},
|
||||
{
|
||||
"x": 85.5,
|
||||
"y": 186
|
||||
},
|
||||
{
|
||||
"x": 85.5,
|
||||
"y": 226
|
||||
}
|
||||
],
|
||||
"isCurve": true,
|
||||
"animated": false,
|
||||
"tooltip": "",
|
||||
"icon": null
|
||||
}
|
||||
]
|
||||
}
|
||||
23
e2etests/testdata/stable/square_3d/sketch.exp.svg
vendored
Normal file
|
After Width: | Height: | Size: 324 KiB |
|
|
@ -6,6 +6,7 @@ width="999" height="1730" viewBox="-100 -100 999 1730"><style type="text/css">
|
|||
<
|
|
@ -6,6 +6,7 @@ width="3322" height="2812" viewBox="-100 -100 3322 2812"><style type="text/css">
|
|||
<![CDATA[
|
||||
.shape {
|
||||
shape-rendering: geometricPrecision;
|
||||
stroke-linejoin: round;
|
||||
}
|
||||
.connection {
|
||||
stroke-linecap: round;
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 363 KiB After Width: | Height: | Size: 363 KiB |
5
go.mod
|
|
@ -9,6 +9,8 @@ require (
|
|||
github.com/fsnotify/fsnotify v1.6.0
|
||||
github.com/golang/freetype v0.0.0-20170609003504-e2365dfdc4a0
|
||||
github.com/google/go-github v17.0.0+incompatible
|
||||
github.com/lucasb-eyer/go-colorful v1.2.0
|
||||
github.com/mazznoer/csscolorparser v0.1.3
|
||||
github.com/pkg/browser v0.0.0-20210911075715-681adbf594b8
|
||||
github.com/spf13/pflag v1.0.5
|
||||
github.com/stretchr/testify v1.7.0
|
||||
|
|
@ -39,6 +41,7 @@ require (
|
|||
github.com/go-playground/validator/v10 v10.10.0 // indirect
|
||||
github.com/golang/groupcache v0.0.0-20210331224755-41bb18bfe9da // indirect
|
||||
github.com/google/go-querystring v1.1.0 // indirect
|
||||
github.com/gorilla/websocket v1.4.2 // indirect
|
||||
github.com/json-iterator/go v1.1.12 // indirect
|
||||
github.com/klauspost/compress v1.13.6 // indirect
|
||||
github.com/kr/pretty v0.3.0 // indirect
|
||||
|
|
@ -49,7 +52,7 @@ require (
|
|||
github.com/rogpeppe/go-internal v1.8.0 // indirect
|
||||
github.com/ugorji/go/codec v1.2.6 // indirect
|
||||
go.opencensus.io v0.23.0 // indirect
|
||||
golang.org/x/crypto v0.0.0-20220112180741-5e0467b6c7ce // indirect
|
||||
golang.org/x/crypto v0.0.0-20220214200702-86341886e292 // indirect
|
||||
golang.org/x/sys v0.1.0 // indirect
|
||||
golang.org/x/term v0.0.0-20221017184919-83659145692c // indirect
|
||||
golang.org/x/xerrors v0.0.0-20220907171357-04be3eba64a2 // indirect
|
||||
|
|
|
|||
11
go.sum
|
|
@ -223,8 +223,9 @@ github.com/googleapis/gax-go/v2 v2.2.0/go.mod h1:as02EH8zWkzwUoLbBaFeQ+arQaj/Oth
|
|||
github.com/googleapis/gax-go/v2 v2.3.0/go.mod h1:b8LNqSzNabLiUpXKkY7HAR5jr6bIT99EXz9pXxye9YM=
|
||||
github.com/googleapis/gax-go/v2 v2.4.0/go.mod h1:XOTVJ59hdnfJLIP/dh8n5CGryZR2LxK9wbMD5+iXC6c=
|
||||
github.com/googleapis/go-type-adapters v1.0.0/go.mod h1:zHW75FOG2aur7gAO2B+MLby+cLsWGBF62rFAi7WjWO4=
|
||||
github.com/gorilla/websocket v1.4.1 h1:q7AeDBpnBk8AogcD4DSag/Ukw/KV+YhzLj2bP5HvKCM=
|
||||
github.com/gorilla/websocket v1.4.1/go.mod h1:YR8l580nyteQvAITg2hZ9XVh4b55+EU/adAjf1fMHhE=
|
||||
github.com/gorilla/websocket v1.4.2 h1:+/TMaTYc4QFitKJxsQ7Yye35DkWvkdLcvGKqM+x0Ufc=
|
||||
github.com/gorilla/websocket v1.4.2/go.mod h1:YR8l580nyteQvAITg2hZ9XVh4b55+EU/adAjf1fMHhE=
|
||||
github.com/grpc-ecosystem/grpc-gateway v1.16.0/go.mod h1:BDjrQk3hbvj6Nolgz8mAMFbcEtjT1g+wF4CSlocrBnw=
|
||||
github.com/hashicorp/golang-lru v0.5.0/go.mod h1:/m3WP610KZHVQ1SGc6re/UDhFvYD7pJ4Ao+sR/qLZy8=
|
||||
github.com/hashicorp/golang-lru v0.5.1/go.mod h1:/m3WP610KZHVQ1SGc6re/UDhFvYD7pJ4Ao+sR/qLZy8=
|
||||
|
|
@ -250,12 +251,16 @@ github.com/kr/text v0.2.0/go.mod h1:eLer722TekiGuMkidMxC/pM04lWEeraHUUmBw8l2grE=
|
|||
github.com/leodido/go-urn v1.2.0/go.mod h1:+8+nEpDfqqsY+g338gtMEUOtuK+4dEMhiQEgxpxOKII=
|
||||
github.com/leodido/go-urn v1.2.1 h1:BqpAaACuzVSgi/VLzGZIobT2z4v53pjosyNd9Yv6n/w=
|
||||
github.com/leodido/go-urn v1.2.1/go.mod h1:zt4jvISO2HfUBqxjfIshjdMTYS56ZS/qv49ictyFfxY=
|
||||
github.com/lucasb-eyer/go-colorful v1.2.0 h1:1nnpGOrhyZZuNyfu1QjKiUICQ74+3FNCN69Aj6K7nkY=
|
||||
github.com/lucasb-eyer/go-colorful v1.2.0/go.mod h1:R4dSotOR9KMtayYi1e77YzuveK+i7ruzyGqttikkLy0=
|
||||
github.com/mattn/go-colorable v0.1.9/go.mod h1:u6P/XSegPjTcexA+o6vUJrdnUu04hMope9wVRipJSqc=
|
||||
github.com/mattn/go-colorable v0.1.12 h1:jF+Du6AlPIjs2BiUiQlKOX0rt3SujHxPnksPKZbaA40=
|
||||
github.com/mattn/go-colorable v0.1.12/go.mod h1:u5H1YNBxpqRaxsYJYSkiCWKzEfiAb1Gb520KVy5xxl4=
|
||||
github.com/mattn/go-isatty v0.0.12/go.mod h1:cbi8OIDigv2wuxKPP5vlRcQ1OAZbq2CE4Kysco4FUpU=
|
||||
github.com/mattn/go-isatty v0.0.14 h1:yVuAays6BHfxijgZPzw+3Zlu5yQgKGP2/hcQbHb7S9Y=
|
||||
github.com/mattn/go-isatty v0.0.14/go.mod h1:7GGIvUiUoEMVVmxf/4nioHXj79iQHKdU27kJ6hsGG94=
|
||||
github.com/mazznoer/csscolorparser v0.1.3 h1:vug4zh6loQxAUxfU1DZEu70gTPufDPspamZlHAkKcxE=
|
||||
github.com/mazznoer/csscolorparser v0.1.3/go.mod h1:Aj22+L/rYN/Y6bj3bYqO3N6g1dtdHtGfQ32xZ5PJQic=
|
||||
github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
|
||||
github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd h1:TRLaZ9cD/w8PVh93nsPXa1VrQ6jlwL5oN8l14QlcNfg=
|
||||
github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
|
||||
|
|
@ -310,8 +315,8 @@ golang.org/x/crypto v0.0.0-20190605123033-f99c8df09eb5/go.mod h1:yigFU9vqHzYiE8U
|
|||
golang.org/x/crypto v0.0.0-20191011191535-87dc89f01550/go.mod h1:yigFU9vqHzYiE8UmvKecakEJjdnWj3jj499lnFckfCI=
|
||||
golang.org/x/crypto v0.0.0-20200622213623-75b288015ac9/go.mod h1:LzIPMQfyMNhhGPhUkYOs5KpL4U8rLKemX1yGLhDgUto=
|
||||
golang.org/x/crypto v0.0.0-20210711020723-a769d52b0f97/go.mod h1:GvvjBRRGRdwPK5ydBHafDWAxML/pGHZbMvKqRZ5+Abc=
|
||||
golang.org/x/crypto v0.0.0-20220112180741-5e0467b6c7ce h1:Roh6XWxHFKrPgC/EQhVubSAGQ6Ozk6IdxHSzt1mR0EI=
|
||||
golang.org/x/crypto v0.0.0-20220112180741-5e0467b6c7ce/go.mod h1:IxCIyHEi3zRg3s0A5j5BB6A9Jmi73HwBIUl50j+osU4=
|
||||
golang.org/x/crypto v0.0.0-20220214200702-86341886e292 h1:f+lwQ+GtmgoY+A2YaQxlSOnDjXcQ7ZRLWOHbC6HtRqE=
|
||||
golang.org/x/crypto v0.0.0-20220214200702-86341886e292/go.mod h1:IxCIyHEi3zRg3s0A5j5BB6A9Jmi73HwBIUl50j+osU4=
|
||||
golang.org/x/exp v0.0.0-20190121172915-509febef88a4/go.mod h1:CJ0aWSM057203Lf6IL+f9T1iT9GByDxfZKAQTCR3kQA=
|
||||
golang.org/x/exp v0.0.0-20190306152737-a1d7652674e8/go.mod h1:CJ0aWSM057203Lf6IL+f9T1iT9GByDxfZKAQTCR3kQA=
|
||||
golang.org/x/exp v0.0.0-20190510132918-efd6b22b2522/go.mod h1:ZjyILWgesfNpC6sMxTJOJm9Kp84zZh5NQWvqDGG3Qr8=
|
||||
|
|
|
|||
16
lib/color/color.go
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
package color
|
||||
|
||||
import (
|
||||
"github.com/lucasb-eyer/go-colorful"
|
||||
"github.com/mazznoer/csscolorparser"
|
||||
)
|
||||
|
||||
func Darken(colorString string) (string, error) {
|
||||
c, err := csscolorparser.Parse(colorString)
|
||||
if err != nil {
|
||||
return "", err
|
||||
}
|
||||
h, s, l := colorful.Color{R: c.R, G: c.G, B: c.B}.Hsl()
|
||||
// decrease luminance by 10%
|
||||
return colorful.Hsl(h, s, l-.1).Clamped().Hex(), nil
|
||||
}
|
||||