Introducing New Interactions System in MATLAB R2025a
![]() |
Guest Writer: Will Jackson Will Jackson serves as the manager of the interactions and accessibility team for MATLAB. Will joined MathWorks in 2008 and contributed to the charting and interactions areas as a developer before becoming a manager. |
I’m Will and I’ve developed interactive tools for exploring graphics in MATLAB for many years and I’m now the manager of the graphics interactions and accessibility team. Graphics interactions come in the form of panning, zooming, rotating, creating a datatip, or some other change to graphics objects using the mouse, keyboard or touch. Today, I’m going to share some key points about how interactions work differently in our new web-based graphics system, introduced in R2025a, and how you can best take advantage of it!
When we began the transition to web technologies, we knew right away that we wanted graphics interactions to be more flexible and contextual than the system we had and we wanted to provide these at a high performance no matter how you use MATLAB, like in the Live Editor, a deployed web app, MATLAB Online or of course, the desktop. We also knew that we wanted to maintain compatibility with the existing system and ensure that longstanding interactions code be able to continue to work for everyone.
Contextual Interactions
Let’s start with contextual interactions. It used to be the case that interaction customization could only occur at the figure level and when you wanted to explore your axes, you enabled, disabled and customized how you interacted at a figure level. For example, you could say that zoom should work only in the horizontal direction in your figure with,
z = zoom;
z.Motion = "horizontal";
This restricts zooming to the horizontal direction for all axes in the figure which may not be desired.
Over the years, we’ve expanded the number of customizations users can make to their axes and created charts with highly customized interactions. For the web-based graphics system, we’ve moved to a more contextual system where interactions are enabled, disabled and customized at an axes or chart level or even below that, at the object level (see the doc for DataTipTemplate for how to customize the contents of a datatip on a particular object like a line). For example, here is how you restrict pan and zoom to one direction on an individual axes.
ax = axes;
ax.InteractionOptions.LimitsDimensions= "x";
This enables pan and zoom in only the x-direction and only for the specified axes. This becomes critical when you have multiple axes in a figure, and you want them to interact in different ways.
Using the InteractionOptions property on axes is the new, most up-to-date way we have to customize interactions and should be used over previous methods. There are even significant performance benefits as well which we’ll explore in the next section. Different kinds of axes have different customizations available to them and hence have different InteractionOptions properties since they support different kinds of interactions. For more information on InteractionOptions in various axes, see our doc pages here,
Performance
When it came to performance, our original interactions were built off of figure-based mouse callbacks - WindowButtonDownFcn, WindowButtonMotionFcn, etc. We knew right away that those callbacks would not be as fast as we would want them in a deployed app, for example, where network latency could make the interaction slower to execute. So, we re-wrote some core interactions in JavaScript, including most pan, zoom and rotate interactions as well as some others. Doing this allows us to have much faster interactions and we are continuing to make them faster and write more interactions in this way each release.
Here is an example of a plot with 5 million markers that panned at 1fps in Java, and now rotates at 60fps on the web.
|
|
|
|
R2024b Java-based Graphics
|
R2025a Web-based Graphics
|
We are also using the web-based graphics system to improve interactive performance in new ways. For example, here is how we can get faster performance on web by rendering more efficiently. In the videos below, note specifically that when you pan a line with a large amount of data in Java (R2024a, left), you may have seen slow performance. In web graphics (R2025a, right), we display your line data more efficiently, so that even lines with large data can be panned with high performance.
|
|
|
|
R2024b Java-based Graphics
|
R2025a Web-based Graphics
|
For a guide to optimizing performance, see the table below. Use features on the left-side for best performance. If you are using functionality on the right, consider whether it’s necessary or if the left-side alternative meets your needs.
|
For high performance, use these
|
avoid these
|
|
InteractionOptions
Example code: To limit panning and zooming to the x dimension, use, ax = axes;
ax.InteractionOptions.LimitsDimensions = "x";
|
Example code: To limit zooming to the x dimension, use,
z = zoom;
z.Motion = "horizontal";
|
|
linkaxes – this will give high performance for panning and zooming on all linked axes
|
LimitsChangeFcn – This is a MATLAB callback that will run whenever the limits change. If this is being used to synchronize axes limits among multiple axes, linkaxes is a more performant choice.
|
|
yyaxis
|
plotyy
|
Overall, I am really happy with the progress we have made to provide you with axes and chart-level customizations of your interactions that are high-performance, even on a web-based system where your figure is displayed on a different machine than MATLAB commands are run. I hope you enjoy them and please know that we are working hard to expand our high-speed interactive offerings each release!



コメント
コメントを残すには、ここ をクリックして MathWorks アカウントにサインインするか新しい MathWorks アカウントを作成します。