Plotting in app designer

I am creating an app to quickly plot csv data. UiAxis for plot needs to be updated once the data is imported but I cannot get it working. The UIAxis element is done in app designer. Plotting is done with app's internal function:

 methods (Access = private)

        function results = plotWidths(app)
            histogram(app.UIAxes, app.Data.Width)
        end

The plot component (named UIAxes) is within a panel if that makes any difference. The property Data is a table that has a column Width.

Thank you already in advanced.

[Birdman]

So basically, you want to upload some numerical data from your excel file and plot it on App Designer?

Answer 1

[Kai Domhardt]

From what I can tell, your version should be working. I tested the following:

The structure of the components:

app.UIFigure
  app.Panel
    app.UIAxes

test.csv:

Width, Height
1, 7
2, 6
3, 5
4, 4
5, 3
6, 2
7, 1

The function from where the .csv is read and the plotWidths function is called. I chose the startupFcn for ease of testing, but it could be any other method or callback.

function startupFcn(app)
   filename = 'test.csv';
   csv_table = readtable(filename);
   app.Data = csv_table;
   plotWidths(app);
end

The same plotWidths method that you used:

function results = plotWidths(app)
   histogram(app.UIAxes, app.Data.Width)
end

When I run this with Matlab R2017b it works without any errors. Does your use deviate in any meaningful way from this?

[Ville Saunajoki]

I am using matlab version R2017b. Only difference is that my application starts with blank plot elements. When the app is running the user chooses the data and then it should be drawn to graph.

I am wondering if the handle to original app is lost when the function is called? I had debug point in the row where the plotting occures. Then I went to matlab console:

 histogram(app.Data.Width)

and the graph appeared in new figure window as intented. But when I typed to console:

 histogram(app.UIAxes, app.Data.Width)

it went through without complains but nothing visual happened. Although in debugging the app.UIAxes seems to have Children object that is '1x1 Histogram' by type...

[Kai Domhardt]

Can you provide us with the function that calls plotWidths?

Is it possible that you have multiple UIAxes in your UIFigure (possibly ones that are not visible) and are using the wrong handle?

[Ville Saunajoki]

I do have an other UIAxes by the default name UIAxes2. I have tested plotting also to the second graph but still no changes.

 % Value changed function: FileEditField
 function FileEditFieldValueChanged(app, event)
         file = app.FileEditField.Value;
         length=strlength(file);
         if strcmp( file(length-3:length), '.csv')
             app.Data=readtable(file);
             plotWidths(app);
             pause(0.05) % Extra row to have a break point
         else
             warning('File to import is not a csv file.')
         end
 end

[Kai Domhardt]

That code should work, but maybe your .csv is not formated correctly and a series of NaN values are returned for Width.

Maybe you have previous instance of the figure open, which would naturally not react to changes?

As a side note: you might want to rename your variable length, since length refers to the matlab function length

[Ville Saunajoki]

Rescale the x and y axis! Their scaling is manual by default. Day well spent.

[Kai Domhardt]

The default value for UIAxes.XLimMode and UIAxes.YLimMode is 'auto', 'manual' would need to be set before plotting.

[Ville Saunajoki]

When the app designer adds a plot without data it lists the following

 % Create UIAxes
 app.UIAxes = uiaxes(app.Panel);
 app.UIAxes.DataAspectRatio = [1 1 1];
 app.UIAxes.PlotBoxAspectRatio = [1 1 1];
 app.UIAxes.XLim = [0 1];
 app.UIAxes.YLim = [0 1];
 app.UIAxes.ZLim = [0 1];
 app.UIAxes.CLim = [0 1];
 app.UIAxes.GridColor = [0.15 0.15 0.15];
 app.UIAxes.MinorGridColor = [0.1 0.1 0.1];
 app.UIAxes.XColor = [0.15 0.15 0.15];
 app.UIAxes.XTick = [0 0.2 0.4 0.6 0.8 1];
 app.UIAxes.YColor = [0.15 0.15 0.15];
 app.UIAxes.YTick = [0 0.5 1];
 app.UIAxes.ZColor = [0.15 0.15 0.15];
 app.UIAxes.ZTick = [0 0.5 1];
 app.UIAxes.CameraPosition = [0.5 0.5 9.16025403784439];
 app.UIAxes.CameraTarget = [0.5 0.5 0.5];
 app.UIAxes.CameraUpVector = [0 1 0];
 app.UIAxes.Position = [0 235 268 140];

In debugging most of those mode properties (XLimMode, PlotBoxAspectRatioMode, ZTickMode...) seem to be 'manual'. I guess that this specific declaration of properties sets their modes to 'manual'.

So I'll do a initialization function to set those modes of all graphs to 'auto' and then run it in start-up function. Hopefully that will auto scale all the later data.

As interesting work-around I tested to plot some random data points in start-up.

 function startupFcn(app, args)
     scatter(app.UIAxes, [1,2], [1,2]);
 end

That did not scale automatically. So I need to separately declare those modes to 'auto'.

I hope this is a lesson for others or fix for the next update :)