Snap to Grid functionality in Magic ETL

Options

Aligning the tiles in magic ETL can become quite cumbersome without any grid or guides for the tiles to line up with.

It would be great for the default behavior of tiles to snap to a grid or show guide-lines that signify when tiles are aligned.

10
10 votes

In Review · Last Updated

While there is already a "snap-to-grid" feature underlying the current Magic canvas, we do recognize that it is possibly too fine-grained to be useful. We are reviewing a more pronounced version of this feature for inclusion in some general updates we're looking to make to the authoring canvas.

Comments

  • skouzini
    Options

    Technically, there is a grid-snap system in Magic ETL. Through some testing, my coworkers discovered that it seems to be a 3px by 3px grid.

    We have come up with a simple command line script that overlays a grid for aligning tiles to this grid:

    let canvasNode = document.querySelector(".df-inner-canvas");canvasNode.setAttribute("style",canvasNode.getAttribute("style")+"background-image: repeating-linear-gradient(0deg, #ccc 0 1px, transparent 1px 100%), repeating-linear-gradient(270deg, #ccc 0 1px, transparent 1px 100%); background-size: 108px 60px;");
    console.log("%cGrid Applied!", "color: lime; font-weight: bold;")

    While in the ETL window, use CTRL + SHIFT + i to open the console, or right click and select "Inspect." Navigate to the console and copy the above code into the command line and hit ENTER. After a moment, a grid should appear on the background of the ETL window. You can change the size of the grid by adjusting the "background-size" attribute.

  • @skouzini Legendary! Thank you so much for this!

  • AndreaHenderson
    AndreaHenderson Domo Product Manager
    Options

    While there is already a "snap-to-grid" feature underlying the current Magic canvas, we do recognize that it is possibly too fine-grained to be useful. We are reviewing a more pronounced version of this feature for inclusion in some general updates we're looking to make to the authoring canvas.

    Domo Product Manager for Data Transformation (MagicETL)

  • skouzini
    skouzini Member
    edited July 18
    Options

    Since the last Domo shadow update, the previous ETL grid overlay has stopped working. I'm currently working on a fix.