tangent in GUI, user interaction

hello ,

im trying to build an Gui App with Matlab. the question ist how can i plot a tangents at specific points that can be moved and modified by a user . this tangent should automatically appear when the user push a button but i would like to know hpw can I let the user also move and modify this tangent .

Thank you

Answer 1

[Imran]

Hello Hussein,

I understand that you want to build an app with MATLAB where you can plot tangents at specific point of the curve and also want to move and modify the tangent.

You can build such app with just 3 components in app designer. These are axes, button and slider.

First of all drag and drop all the mentioned components. Now you've to write the callback function for the button. This function will plot the curve and the tangent.

function PlotButtonPushed(app, event)
% Define the x values
x = -4*pi:0.1:4*pi;

% Our curve is a normal sine curve
y = sin(x);

% Now define the point where the tangent is initially drawn
x1 = pi;
y1 = sin(x1);

% Equation of tangent at (x1,y1) of the curve.
ytan = y1 + cos(x1).*(x-x1);

% Plot the curve
plot(app.UIAxes,x,y);
hold(app.UIAxes);

% Draw the tanget 
plot(app.UIAxes,x,ytan);

% Display the point where the tangent is drawn
plot(app.UIAxes,x1, y1, 'r*', 'LineWidth', 2, 'MarkerSize', 4);
end

Here I've taken a sine curve and plotted a tangent at (pi,sin(pi)) initially. Once the curve and tangent are plotted, we can focus on moving the tangent. For that, callback of slider must be written.

function SliderValueChanging(app, event)
% Fetch the current value of the slider
changingValue = event.Value;

% Get the tangent from the axis object
tangent = app.UIAxes.Children(2,1);

% Get the point (where the tangent is drawn) from the axis object
pointer = app.UIAxes.Children(1,1);

% Move the point (where the tangent is drawn)
pointer.XData = changingValue;
pointer.YData = sin(changingValue);

% Move the tangent
tangent.YData = sin(changingValue) + cos(changingValue).*(tangent.XData-changingValue);
end

All we need to do, is to just fetch the current value of the slider and plug that value in tangent equation accordingly. That's how tangent can be moved dynamically.

After creating the app follow the below steps

1. Click the button to create the plot.
2. Move the slider to move the tangent.

I hope this helps.