I am currently working on a dashboard that is able to connect to some devices and perform measurements. I am basically going to sweep two voltages, while measuring the output of another device simultaneously, resulting in a heatmap. The heatmap will be generated pixel by pixel and line by line.
The dashboard itself is divided into for now two tabs. The first tab is used to change the connection settings and test the devices. I have two options for storing these settings: in a hidden-div in the main layout (not in the tab layout, because this information gets lost when switching tabs I noticed) or globally. The second tab is used for the measurement. Some settings for the measurement are provided here. At last there is a button for starting the measurement. After pressing this button an empty heatmap (with only zero’s) must be created and a measurement process must be started. After each read pixel, the heatmap must be updated and when the measurement is done, the updating of the graph must stop. A next measurement should not overwrite the graph, but place it below the other. Even better would be to open a new tab in the browser and open the graph there and update it after each cycle.
I am not sure how to program this process efficiently. I can create a graph in an empty div and could make multiple of these empty div’s for consecutive measurements, with a maximum though. With the dcc.Interval method the graph can be updated after a time interval, which can be set equal to the duration of measuring one pixel. But how do I stop that dcc.Interval after the measurement is done? How should I program the measurement itself, should it be a function that is called when the button is clicked. Or should I make a thread, that handles the measurement and updates the measured data globally and the graph gets updated by the interval.
My question contains a lot of text, so I have tried to make a simple depiction of the process below:
