How can I implement two cursors that can be moved for a UIAxes in Matlab AppDesigner, and that I can calculate what interests me in the area between the two cursors?

% Definir función para graficar la señal seleccionada
function updatePlot(app)
% Obtener la señal seleccionada del ListBox
selectedSignalName = app.SignalListBox.Value; % Obtén el nombre seleccionado
index = find(strcmp(app.SignalListBox.Items, selectedSignalName)); % Índice correspondiente
% Verificar si el índice es válido
if ~isempty(index)
    % Definir tiempo para el rango enfocado
    t_enf = app.t_ini:app.Ts:app.t_fin;
    % Limpiar el UIAxes antes de graficar
    cla(app.SPLUIAxes);
    % Graficar la señal SPL en el eje izquierdo
    yyaxis(app.SPLUIAxes, 'left');
    h1 = plot(app.SPLUIAxes, app.x_values, app.SPL{index}, 'DisplayName', 'SPL signal'); % Asignar DisplayName para SPL
    ylabel(app.SPLUIAxes, 'dBA');
    % Establecer límites para el eje izquierdo (SPL)
    maxSPL = max(app.SPL{index});
    ylim(app.SPLUIAxes, [maxSPL-35 maxSPL+5]);
    % Configurar el eje derecho y graficar señal de voltaje si está habilitado
    if app.ShowVoltageCheckBox.Value % Comprobar si el checkbox está marcado
        yyaxis(app.SPLUIAxes, 'right');
        h2 = plot(app.SPLUIAxes, app.x_values, app.V_values, 'DisplayName', 'Passby sensor'); % Asignar DisplayName para Voltaje
        ylabel(app.SPLUIAxes, 'V[V]');
        % Establecer límites para el eje derecho (Voltaje)
        minV = min(app.V_values);
        maxV = max(app.V_values);
        ylim(app.SPLUIAxes, [minV maxV+maxV*0.05]);
    else
        % Si el checkbox está desmarcado, elimina la segunda señal
        yyaxis(app.SPLUIAxes, 'right');
        plot(app.SPLUIAxes, NaN, NaN); % "Borrar" la gráfica secundaria
    end
    % Graficar las líneas verticales
    xline(app.SPLUIAxes, app.t_ini, 'k', 'LineWidth', 2);
    xline(app.SPLUIAxes, app.t_fin, 'k', 'LineWidth', 2);
    % Configurar etiquetas y título
    
    title(app.SPLUIAxes, sprintf('SPL signal and sensor - %s', selectedSignalName));
    xlabel(app.SPLUIAxes, 't[s]');
    xlim(app.SPLUIAxes, [app.t_ini-1 app.t_fin+1]);
    % Añadir leyenda solo con las señales que se están mostrando
    if app.ShowVoltageCheckBox.Value
        % Solo mostrar la leyenda para las señales activas
        legend(app.SPLUIAxes, {'SPL signal', 'Passby sensor'}, 'Location', 'best');
    else
        % Si solo SPL está activado, mostrar solo la leyenda de SPL
        legend(app.SPLUIAxes, 'SPL signal', 'Location', 'best');
    end
    hold(app.SPLUIAxes, 'off');
end
end
end

Answer 1

[Deepak]

Hi @Axier,

We can implement two movable cursors on a UIAxes in MATLAB App Designer by using "xline" to create vertical lines representing the cursors. These cursors can be dragged interactively using the "MouseMotion" event listener, which updates their position on the plot. The area between the cursors can be calculated by finding the signal values within the range of the cursors and performing numerical integration (using "trapz"). This allows us to dynamically compute and display the area under the curve between the two cursors as they are moved, providing an interactive way to analyze the data in a specific region of interest.

Below is the sample App Designer code to achieve the same:

% Define properties for the cursors
app.cursor1 = xline(app.SPLUIAxes, app.t_ini, 'Color', 'r', 'LineWidth', 2, 'Label', 'Cursor 1');
app.cursor2 = xline(app.SPLUIAxes, app.t_fin, 'Color', 'b', 'LineWidth', 2, 'Label', 'Cursor 2');

% Define callback functions for moving the cursors
addlistener(app.cursor1, 'MouseMotion', @(src, event) moveCursor(app, 1, event));
addlistener(app.cursor2, 'MouseMotion', @(src, event) moveCursor(app, 2, event));

% Callback to move the cursor
function moveCursor(app, cursorId, event)
    % Get the current mouse position
    mousePos = event.IntersectionPoint(1);
    
    % Check if the cursor is the first or second one
    if cursorId == 1
        % Move the first cursor
        app.cursor1.Position = mousePos;
    else
        % Move the second cursor
        app.cursor2.Position = mousePos;
    end
    
    % Call a function to update calculations (e.g., area between cursors)
    updateArea(app);
end

% Function to calculate and display the area between the cursors
function updateArea(app)
    % Get the x-positions of the cursors
    cursor1Pos = app.cursor1.Position;
    cursor2Pos = app.cursor2.Position;
    
    % Ensure the cursors are ordered correctly
    if cursor1Pos > cursor2Pos
        temp = cursor1Pos;
        cursor1Pos = cursor2Pos;
        cursor2Pos = temp;
    end
    
    % Find the indices of the signal within the cursor range
    xValuesInRange = app.x_values(app.x_values >= cursor1Pos & app.x_values <= cursor2Pos);
    signalInRange = app.SPL{index}(app.x_values >= cursor1Pos & app.x_values <= cursor2Pos);
    
    % Calculate the area under the curve between the two cursors (numerical integration)
    area = trapz(xValuesInRange, signalInRange);
    
    % Display the area or update it in the app (e.g., in a Label)
    app.AreaLabel.Text = sprintf('Area: %.2f', area);
end

Please find attached the documentation of functions used for reference:

xline: www.mathworks.com/help/matlab/ref/xline.html

trapz: www.mathworks.com/help/matlab/ref/trapz.html

I hope this helps in resolving the issue.