Measure/Ruler tool and Snapping when configuring Operations Dashboard

[KaninS_]

When configuring an Operations Dashboard with many elements, it can be difficult to make sure that every element is equally placed and distributed. Sometimes, the 'traditional' way is needed where I need to use a physical ruler or card to measure the dimension of each element. This requires longer times to configure a presentable dashboard, as we cannot be definitely certain that the elements' dimensions are exactly equal.

[BrianKretzschmar]

You can do this in the JSON using the AGO assistant.  I have done so with one of our own dashboards.  But I do concur that it seems like it would be good to have ruler/guides to set a certain height/width to the information displayed for uniformity built into the dashboard layout screen instead of going through the JSON

[GaryStaker1]

@BrianKretzschmar  G'day Brian, do you mind sharing how you achieved your workaround? I've tried copying the measure widget JSON from a Web App Builder application into Dashboard's JSON without much luck. Cheers

[BrianKretzschmar]

Hi GaryStaker1, There is one assumption I am making, though it might work with other options.  When I did this workaround, my dashboard was in "Portal".  I'm not sure that will make a difference or not.

**WARNING - working with JSON's can be risky and cause your data/dashboard not to work properly after editing them.  Proceed at your own risk.  It is highly recommend to save a backup copy at minimum before proceeding.**
So go here: ArcGIS Online Assistant (esri.com), and sign in to the correct area you will be working (like I noted above, mine was for "Portal").  This will bring you to a screen that should show the information/projects contained within your ArcOnline Account.  In the bar/menu that's on the top, there is an option with "I want to" and a down arrow.  Click this and you should select the option to "view items JSON".  All of your content that you have posted should become highlighted.  Select on the appropriate file you want to examine (you said Dashboard).  Once this is selected, you will be able to view the code behind the source and should appear on the right side of the screen.  The first part is just the general code.  You will want to scroll down until you come to the "Data" section.  This is where the layout code of your dashboard is kept.  Where it says data, you will look for a pencil icon that is the symbol for editing.  You are now free to edit the code behind the dashboard.  Even if you are not fluent in coding, it is relatively obvious where each widget/window is laid out with obvious "width" and height" paramaters that you can change.  Once completed, scroll back to where it says "Data" and click the save icon.  Log out, reload your dashboard, and you should see the changes once the dashboard is loaded.  **WARNING** I highly suggest you make the changes to a backup copy first!!! **WARNING** editing a JSON can cause the page not to work properly once edits have been made.  Make a backup first!!  never work with the direct data unless you are willing to accept the risks.  With dashboards, it is easy enough to make copies of your work.  Please do so to avoid losing your work.

I had 9 different panels in mine (3x3), and was able to use percentages to figure out the width dimensions and heights of what I wanted each to be using this method.  I had thought they were mostly equal before, but the change was noticeable.  Play around once you get the hang of it, and don't be scared to stack objects (creating tabs) to create more room on your display.

Hope this helps,

Brian

[GaryStaker1]

Thanks for the thorough instruction, Brian.

This is pretty much what I had tried previously, but with no success.

Having recently migrated from Portal environment to AGOL I have noticed that there are quite a few differences in functionality between the equivalent application types, not only the versions but also some of the JSON structure and syntax. I'm guessing the references and support for some widgets has changed between Portal and AGOL.

Gary

[patrickb]

Since this idea was submitted (and last commented on), Dashboards has introduced the ability to equally distribute the width and height of dashboard elements within the layout.