How to create perspective responsive dashboard

I would like to develop a responsive Perspective dashboard that is accessible on both desktop and mobile devices. What steps should I take to achieve this?

Start here:

1 Like

i can't find solution one dashboard view both device.

I don't think you can achieve what you described with only 1 view.

In my opinion, the simplest solution would be to use a combination of Breakpoint and Flex containers and design 2 separate dashboard screens - above and below the breakpoint.
Perspective also has a dashboard component, perhaps it will be of some use to you ( Perspective - Dashboard | Ignition User Manual).

We used a method to retrieve the dashboard config manipulate the positions based on the viewport width.

The script is a bit complicated and I can't share it here, but the gist is to manipulate the following properties for each widget:

widget['position']['rowStart']
widget['position']['rowEnd']
widget['position']['columnStart']
widget['position']['columnEnd']

The approach that we took is to discard the original position and simply display the widget in a single column when the viewport is too narrow, with an overflow to allow scrolling vertically. The vertical order is then just determined by the order in the widget configuration.

I am also keen on learning a better way, but this works for us for the time being.

1 Like