add pad option

ci/release/changelogs/next.md

@@ -1,5 +1,8 @@
 #### Features 🚀
 
+- Diagram padding can now can be configured in the CLI (default 100px).
+  [https://github.com/terrastruct/d2/pull/431](https://github.com/terrastruct/d2/pull/431)
+
 #### Improvements 🧹
 
 #### Bugfixes ⛑️

ci/release/template/man/d2.1

@@ -58,6 +58,9 @@ Port listening address when used with
 Set the diagram theme to the passed integer. For a list of available options, see
 .Lk https://oss.terrastruct.com/d2
 .Ns .
+.It Fl -pad Ar 100
+Pixels padded around the rendered diagram
+.Ns .
 .It Fl l , -layout Ar dagre
 Set the diagram layout engine to the passed string. For a list of available options, run
 .Ar layout

d2renderers/d2svg/d2svg.go

@@ -34,7 +34,7 @@ import (
 )
 
 const (
-	padding                    = 100
+	DEFAULT_PADDING            = 100
 	MIN_ARROWHEAD_STROKE_WIDTH = 2
 	threeDeeOffset             = 15
 )
@@ -47,10 +47,10 @@ var styleCSS string
 //go:embed github-markdown.css
 var mdCSS string
 
-func setViewbox(writer io.Writer, diagram *d2target.Diagram) (width int, height int) {
+func setViewbox(writer io.Writer, diagram *d2target.Diagram, pad int) (width int, height int) {
 	tl, br := diagram.BoundingBox()
-	w := br.X - tl.X + padding*2
-	h := br.Y - tl.Y + padding*2
+	w := br.X - tl.X + pad*2
+	h := br.Y - tl.Y + pad*2
 	// TODO minify
 
 	// TODO background stuff. e.g. dotted, grid, colors
@@ -58,7 +58,7 @@ func setViewbox(writer io.Writer, diagram *d2target.Diagram) (width int, height
 <svg
 style="background: white;"
 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-width="%d" height="%d" viewBox="%d %d %d %d">`, w, h, tl.X-padding, tl.Y-padding, w, h)
+width="%d" height="%d" viewBox="%d %d %d %d">`, w, h, tl.X-pad, tl.Y-pad, w, h)
 
 	return w, h
 }
@@ -949,9 +949,9 @@ func embedFonts(buf *bytes.Buffer) {
 }
 
 // TODO minify output at end
-func Render(diagram *d2target.Diagram) ([]byte, error) {
+func Render(diagram *d2target.Diagram, pad int) ([]byte, error) {
 	buf := &bytes.Buffer{}
-	w, h := setViewbox(buf, diagram)
+	w, h := setViewbox(buf, diagram, pad)
 
 	buf.WriteString(fmt.Sprintf(`<style type="text/css">
 <![CDATA[

docs/examples/lib/1-d2lib/d2lib.go

@@ -20,6 +20,6 @@ func main() {
 		Ruler:   ruler,
 		ThemeID: d2themescatalog.GrapeSoda.ID,
 	})
-	out, _ := d2svg.Render(diagram)
+	out, _ := d2svg.Render(diagram, d2svg.DEFAULT_PADDING)
 	_ = ioutil.WriteFile(filepath.Join("out.svg"), out, 0600)
 }

docs/examples/lib/3-lowlevel/lowlevel.go

@@ -21,6 +21,6 @@ func main() {
 	_ = graph.SetDimensions(nil, ruler)
 	_ = d2dagrelayout.Layout(context.Background(), graph)
 	diagram, _ := d2exporter.Export(context.Background(), graph, d2themescatalog.NeutralDefault.ID)
-	out, _ := d2svg.Render(diagram)
+	out, _ := d2svg.Render(diagram, d2svg.DEFAULT_PADDING)
 	_ = ioutil.WriteFile(filepath.Join("out.svg"), out, 0600)
 }

e2etests/e2e_test.go

@@ -125,7 +125,7 @@ func run(t *testing.T, tc testCase) {
 		dataPath := filepath.Join("testdata", strings.TrimPrefix(t.Name(), "TestE2E/"), layoutName)
 		pathGotSVG := filepath.Join(dataPath, "sketch.got.svg")
 
-		svgBytes, err := d2svg.Render(diagram)
+		svgBytes, err := d2svg.Render(diagram, d2svg.DEFAULT_PADDING)
 		assert.Success(t, err)
 		err = os.MkdirAll(dataPath, 0755)
 		assert.Success(t, err)

main.go

@@ -59,6 +59,10 @@ func run(ctx context.Context, ms *xmain.State) (err error) {
 	if err != nil {
 		return err
 	}
+	padFlag, err := ms.Opts.Int64("D2_PAD", "pad", "", d2svg.DEFAULT_PADDING, "pixels padded around the rendered diagram")
+	if err != nil {
+		return err
+	}
 	versionFlag, err := ms.Opts.Bool("", "version", "v", false, "get the version")
 	if err != nil {
 		return err
@@ -161,6 +165,7 @@ func run(ctx context.Context, ms *xmain.State) (err error) {
 		w, err := newWatcher(ctx, ms, watcherOpts{
 			layoutPlugin: plugin,
 			themeID:      *themeFlag,
+			pad:          *padFlag,
 			host:         *hostFlag,
 			port:         *portFlag,
 			inputPath:    inputPath,
@@ -177,7 +182,7 @@ func run(ctx context.Context, ms *xmain.State) (err error) {
 	ctx, cancel := context.WithTimeout(ctx, time.Minute*2)
 	defer cancel()
 
-	_, written, err := compile(ctx, ms, plugin, *themeFlag, inputPath, outputPath, *bundleFlag, pw.Page)
+	_, written, err := compile(ctx, ms, plugin, *padFlag, *themeFlag, inputPath, outputPath, *bundleFlag, pw.Page)
 	if err != nil {
 		if written {
 			return fmt.Errorf("failed to fully compile (partial render written): %w", err)
@@ -188,7 +193,7 @@ func run(ctx context.Context, ms *xmain.State) (err error) {
 	return nil
 }
 
-func compile(ctx context.Context, ms *xmain.State, plugin d2plugin.Plugin, themeID int64, inputPath, outputPath string, bundle bool, page playwright.Page) (_ []byte, written bool, _ error) {
+func compile(ctx context.Context, ms *xmain.State, plugin d2plugin.Plugin, pad, themeID int64, inputPath, outputPath string, bundle bool, page playwright.Page) (_ []byte, written bool, _ error) {
 	input, err := ms.ReadPath(inputPath)
 	if err != nil {
 		return nil, false, err
@@ -209,7 +214,7 @@ func compile(ctx context.Context, ms *xmain.State, plugin d2plugin.Plugin, theme
 		return nil, false, err
 	}
 
-	svg, err := d2svg.Render(diagram)
+	svg, err := d2svg.Render(diagram, int(pad))
 	if err != nil {
 		return nil, false, err
 	}

watch.go

@@ -41,6 +41,7 @@ var staticFS embed.FS
 type watcherOpts struct {
 	layoutPlugin d2plugin.Plugin
 	themeID      int64
+	pad          int64
 	host         string
 	port         string
 	inputPath    string
@@ -354,7 +355,7 @@ func (w *watcher) compileLoop(ctx context.Context) error {
 			w.pw = newPW
 		}
 
-		svg, _, err := compile(ctx, w.ms, w.layoutPlugin, w.themeID, w.inputPath, w.outputPath, w.bundle, w.pw.Page)
+		svg, _, err := compile(ctx, w.ms, w.layoutPlugin, w.pad, w.themeID, w.inputPath, w.outputPath, w.bundle, w.pw.Page)
 		errs := ""
 		if err != nil {
 			if len(svg) > 0 {