Plot using radio buttons overwritten instead of substituted

I am trying to change the plot depicted on my app using radio buttons (one for cases, other for deads and other for both), but when I click on other button to change the plot, the new data overwrites the previous one, instead of substituting it. I will add a couple of screenshots for better understanding:

In this picture you can see how the Cases button is selected, and cases are depicted. Nothing wrong with that.

But in this second picture you can see how the deaths button is pressed but both deaths (red line) and cases (blue histogram) are depicted. And that blue histogram would never come out.

The code I am using for plotting is this:

function plotData(app)
            load CovidData.mat covid_data
            
            if app.CasesButton.Value
                yyaxis(app.UIAxes,'left');
                bar(app.UIAxes,app.TimePoints,app.CovidCases, 'blue');
                datetick(app.UIAxes,'x','mmm yy');
            end

             if app.DeathsButton.Value
                yyaxis(app.UIAxes,'right');
                plot(app.UIAxes, app.TimePoints, app.CovidDeaths, 'r');
                datetick(app.UIAxes, 'x','mmm yy');
             end
             
             if app.BothButton.Value
                 yyaxis(app.UIAxes,'left');
                 bar(app.UIAxes,app.TimePoints,app.CovidCases, 'blue');
                 yyaxis(app.UIAxes,'right');
                 plot(app.UIAxes, app.TimePoints, app.CovidDeaths, 'r');
                 datetick(app.UIAxes, 'x','mmm yy');
                 
             end
             

And the radio button callback looks like this:

              % Selection changed function: DatatoplotButtonGroup
        function DatatoplotButtonGroupSelectionChanged(app, event)
            app.plotData();
        end
  

What am I doing wrong?

Answer 1

[Voss]

You need some way to delete old plots whose corresponding radiobutton was selected at some point but now is no longer selected. In this case, the easiest way is probably to put

cla(app.UIAxes);

in plotData() before the plotting functions are called, which will clear the axes before the selected plots are created. So plotData() would look like this:

function plotData(app)
    
    load CovidData.mat covid_data
    
    cla(app.UIAxes); % clear out old plots
    
    if app.CasesButton.Value
        % make new plots, same as you have now
    end
    
    % etc., same as you have now
    
end

[Rik]

I would suggest setting the plots to invisible instead. If the number of graphics elements is reasonble that should improve performance (because you only need to set Visible back to on, instead of creating a new object).

Also, those mat files should be loaded when starting the GUI (and using the function syntax), not in the plotting function. (but that is on OP to change)

[Pablo Rodríguez Suárez]

It worked if I press Cases or Deaths (if I click on the other one, it substitutes the plot), but if I click on Both, then when click on another option (e.g. Cases), the other plot (in this cases, Deaths) won't disappear...

[Pablo Rodríguez Suárez]

Ok, it's solved. I add the 'reset' option to cla:

cla (app.UIAxes,"reset");

and it works just fine. Thank you :)