Online and Offline Modes

As we have seen in the previous topics, Plotly Graphing Library for MATLAB® is so easy to use that you only need to add one line of code to your original MATLAB code. Basically, you just need to invoke the main library function, fig2plotly(), which creates the Plotly Chart from the MATLAB generated Chart.

Like any function, fig2plotly() has input parameters. However, it can be invoked without passing parameters and will still work with default values. Let’s look at the following example

load patients
tbl = table(LastName,Diastolic,Systolic,Smoker);
s = scatterhistogram(tbl,'Diastolic','Systolic','GroupVariable','Smoker');

fig2plotly();

By executing the above code, MATLAB will generate its own chart but fig2plotly will create its corresponding Plotly Chart. Now, you should note that we have invoked fig2plotly with no input parameters. Then, the generated Plotly Chart will be in the mode (Offline/Online) configured by default.

In my case, I have installed the library using the file plotlysetup_offline.m (as I specified in the previous topic), so the default mode configured on my machine is offline mode. But if you use the file plotlysetup_online.m, then the online mode will be set by default on your machine.

Returning to the example, the result I have obtained is that of the offline mode, which is: an HTML file that fig2plotly generates and saves in my current working folder. Also, fig2plotly displays that HTML file in my web browser. I attach below both the HTML file and a screenshot of it displayed in my web browser.


Link to download the HTML file: untitled.html - Google Drive. Please feel free to download HTML file and open it from your end.

Next we will see how to invoke fig2plotly in both modes (online/offline) properly using input parameters.

Offline Mode

We already know what the results generated by fig2plotly are like in offline mode. Remember that we have only invoked fig2plotly with its default parameters.

To invoke fig2plotly in offline mode properly, we need to set input parameters. First of all, we need to talk a bit about the input parameters of fig2plotly.

fig2plotly has a main input parameter. The other input parameters are optional parameters. The offline mode is set through an optional parameter.

In order to set an optional parameter in fig2plotly (or in any MATLAB function, in general) it is necessary to specify the main input parameter. The data type for the main input parameter is a MATLAB figure handling structure, like gcf (you can learn about that data type here). This parameter specifies to fig2plotly which MATLAB chart we want fig2plotly to create in Plotly. This means that, if our MATLAB code generates several Charts, fig2plotly will only create the one that we specify as the main input parameter.

Now, fig2plotly has a large number of optional parameters, of which there is one called 'offline', which is of the Boolean type. If it is true, the mode will be set to offline. In the following example we will configure the offline mode using what was explained above.

x = randn(10000,1);
h = histogram(x);

fig2plotly(gcf, 'offline', true);

When executing previous MATLAB code, the HTML file corresponding to the offline mode will be created and it will be displayed in our web browser. Attached below is a screenshot of HTML displayed in conjunction with the MATLAB Chart

Online Mode

To configure the online mode in fig2plotly we only need to set the parameter 'offline' to false. To illustrate this please let us review the following example

X = randn(50,3);  
plotmatrix(X);

fig2plotly(gcf, 'offline', false);

When executing the MATLAB code above, fig2plotly will display the corresponding Plotly Chart in Chart-Studio, opening the respective link to Chart-Studio in our web browser. This is the behavior of the online mode.

Attached below is a screenshot of the Chart created by Plotly displayed in Chart-Studio (along with the MATLAB generated chart on the left), as well as the link to Chart-Studio.

Link to Chart-Studio:
https://chart-studio.plotly.com/~galvisgilberto/4390/#/

Please feel free to go through that link to see the awesome Plotly Chart created