{"id":170,"date":"2015-01-08T10:20:55","date_gmt":"2015-01-08T15:20:55","guid":{"rendered":"https:\/\/blogs.mathworks.com\/graphics\/?p=170"},"modified":"2015-12-31T13:04:27","modified_gmt":"2015-12-31T18:04:27","slug":"linked-selection","status":"publish","type":"post","link":"https:\/\/blogs.mathworks.com\/graphics\/2015\/01\/08\/linked-selection\/","title":{"rendered":"Linked Selection"},"content":{"rendered":"<div class=\"content\"><h3>Linked Selection<\/h3><p>When we create visualizations of data which have multiple values per data point, we need to use different graphics features to represent the different values. These are called \"visual channels\". For example, consider the following four charts.<\/p><pre class=\"codeinput\">figure(<span class=\"string\">'Position'<\/span>,[200 200 760 150]);\r\nco = get(groot,<span class=\"string\">'DefaultAxesColorOrder'<\/span>);\r\ncol = co(1,:);\r\nv1 = [9 10 2 8];\r\nv2 = [7 1 3 6];\r\nv3 = [7 2 9 3];\r\nv4 = [1 6 3 8];\r\nv5 = [5 10 8 10];\r\nsubplot(1,4,1)\r\nbar(v1,<span class=\"string\">'FaceColor'<\/span>,col)\r\ntitle(<span class=\"string\">'One Value'<\/span>)\r\nsubplot(1,4,2)\r\nscatter(v1,v2,<span class=\"string\">'filled'<\/span>)\r\ntitle(<span class=\"string\">'Two Values'<\/span>)\r\nsubplot(1,4,3)\r\nscatter(v1,v2,25*v3,<span class=\"string\">'filled'<\/span>)\r\ntitle(<span class=\"string\">'Three Values'<\/span>)\r\nsubplot(1,4,4)\r\nscatter(v1,v2,25*v3,v4,<span class=\"string\">'filled'<\/span>)\r\ntitle(<span class=\"string\">'Four Values'<\/span>)\r\n<\/pre><img decoding=\"async\" vspace=\"5\" hspace=\"5\" src=\"https:\/\/blogs.mathworks.com\/images\/graphics\/2015\/linked_scatter_example_01.png\" alt=\"\"> <p>In the first, we're representing a single set of data values using the heights of the bars.<\/p><p>In the second, we're representing two data values using the X &amp; Y coordinates of the points in the scatter chart.<\/p><p>In the third, we're using the size of the bubbles to represent a third data value.<\/p><p>And finally, in the fourth, we're using the colors to represent a fourth data value.<\/p><p>There are a number of different visual channels we can use. Tamara Munzner's wonderful new book <a href=\"http:\/\/www.crcpress.com\/product\/isbn\/9781466508910\">\"Visualization Analysis &amp; Design\"<\/a> lists these visual channels in decreasing order of effectiveness.<\/p><div><ul><li>Position<\/li><li>Length<\/li><li>Angle<\/li><li>Area<\/li><li>Depth (3D Position)<\/li><li>Color luminance<\/li><li>Color saturation<\/li><li>Curvature<\/li><li>Volume<\/li><\/ul><\/div><p>Unfortunately we can't mix all of these visual channels in one chart. For example, the human vision system uses size as a depth cue for figuring out how far away objects are. This means that we can't use both the area and the depth channels. In practice, once we get past three or four visual channels, we're probably not really creating an effective visualization.<\/p><p>So what can we do if we have data with more than three of four values? The best answer is usually to combine multiple charts.<\/p><pre class=\"codeinput\">clf\r\nsubplot(1,5,1)\r\nbar(v1,<span class=\"string\">'FaceColor'<\/span>,col)\r\ntitle(<span class=\"string\">'First Value'<\/span>)\r\nsubplot(1,5,2)\r\nbar(v2,<span class=\"string\">'FaceColor'<\/span>,col)\r\ntitle(<span class=\"string\">'Second Value'<\/span>)\r\nsubplot(1,5,3)\r\nbar(v3,<span class=\"string\">'FaceColor'<\/span>,col)\r\ntitle(<span class=\"string\">'Third Value'<\/span>)\r\nsubplot(1,5,4)\r\nbar(v4,<span class=\"string\">'FaceColor'<\/span>,col)\r\ntitle(<span class=\"string\">'Fourth Value'<\/span>)\r\nsubplot(1,5,5)\r\nbar(v5,<span class=\"string\">'FaceColor'<\/span>,col)\r\ntitle(<span class=\"string\">'Fifth Value'<\/span>)\r\n<\/pre><img decoding=\"async\" vspace=\"5\" hspace=\"5\" src=\"https:\/\/blogs.mathworks.com\/images\/graphics\/2015\/linked_scatter_example_02.png\" alt=\"\"> <p>The problem with this approach is that it can be difficult to keep track of the which items in the different charts correspond to the same data point. This can be very challenging when we're looking at a static visualization, but if we create an interactive application we can make it easier to see how multiple charts are related. One of my favorite techniques for this is something called \"linked selection\". The basic idea is that when you select an item in one chart, the corresponding items get highlighted in the other charts.<\/p><p>Here's an example. When I drag a rectangle in the scatter chart on the right, I can see that that the data points in the lower left corner of that chart correspond to the ones in the upper left of the other chart.<\/p><p><img decoding=\"async\" vspace=\"5\" hspace=\"5\" src=\"https:\/\/blogs.mathworks.com\/images\/graphics\/2015\/linked_selection_animation.gif\" alt=\"\"> <\/p><p>There's a bit of setup required to link charts like this, but it really isn't hard once you've learned the tricks. Let's walk through how I created that example.<\/p><p>First we'll need some data. This is the famous <a href=\"http:\/\/en.wikipedia.org\/wiki\/Iris_flower_data_set\">\"Fisher Iris\" dataset<\/a>. If you have the <a href=\"https:\/\/www.mathworks.com\/products\/statistics\/\">Statistics Toolbox<\/a>, then you've already got this dataset. Otherwise, you'll have to download it from the net.<\/p><pre class=\"codeinput\"><span class=\"keyword\">if<\/span> ~exist(<span class=\"string\">'fisheriris.mat'<\/span>)\r\n    load <span class=\"string\">fisheriris<\/span>\r\n<span class=\"keyword\">else<\/span>\r\n    txt = urlread(<span class=\"string\">'https:\/\/archive.ics.uci.edu\/ml\/machine-learning-databases\/iris\/iris.data'<\/span>);\r\n    meas = textscan(txt,<span class=\"string\">'%f%f%f%f%s'<\/span>,<span class=\"string\">'delimiter'<\/span>,<span class=\"string\">','<\/span>);\r\n<span class=\"keyword\">end<\/span>\r\n<\/pre><p>Next we'll need 2 axes and 4 scatter charts. Why four? Because we're going to do the highlighting using <a title=\"https:\/\/blogs.mathworks.com\/graphics\/2014\/11\/11\/highlighting-parts-of-charts\/ (link no longer works)\">the technique I described a couple of weeks ago<\/a>.<\/p><pre class=\"codeinput\">close\r\nfigure(<span class=\"string\">'Position'<\/span>,[500 500 750 350])\r\na = gobjects(1,2);\r\ns = gobjects(1,2);\r\nh = gobjects(1,2);\r\n<span class=\"keyword\">for<\/span> i=1:2\r\n    a(i) = subplot(1,2,i);\r\n    s(i) = scatter(meas{2*i-1},meas{2*i},<span class=\"string\">'filled'<\/span>);\r\n    s(i).PickableParts = <span class=\"string\">'none'<\/span>;\r\n    s(i).MarkerFaceColor = col;\r\n    hold(a(i),<span class=\"string\">'on'<\/span>);\r\n    h(i) = scatter(nan,nan);\r\n    h(i).PickableParts = <span class=\"string\">'none'<\/span>;\r\n    h(i).Marker = <span class=\"string\">'o'<\/span>;\r\n    h(i).SizeData = 50;\r\n    h(i).MarkerFaceColor = <span class=\"string\">'red'<\/span>;\r\n<span class=\"keyword\">end<\/span>\r\n\r\nxlabel(a(1),<span class=\"string\">'SepalLength'<\/span>)\r\nylabel(a(1),<span class=\"string\">'SepalWidth'<\/span>)\r\nxlabel(a(2),<span class=\"string\">'PetalLength'<\/span>)\r\nylabel(a(2),<span class=\"string\">'PetalWidth'<\/span>)\r\n<\/pre><img decoding=\"async\" vspace=\"5\" hspace=\"5\" src=\"https:\/\/blogs.mathworks.com\/images\/graphics\/2015\/linked_scatter_example_03.png\" alt=\"\"> <p>Now we need to add the interaction part. That starts when we click on an axes, so we'll need to add a Hit event listener to each axes.<\/p><pre class=\"codeinput\">addlistener(a(1),<span class=\"string\">'Hit'<\/span>,@(~,evd)mybtndown(a(1),evd,s(1).XData,s(1).YData,s,h));\r\naddlistener(a(2),<span class=\"string\">'Hit'<\/span>,@(~,evd)mybtndown(a(2),evd,s(2).XData,s(2).YData,s,h));\r\n<\/pre><p>Where mybtndown is the following function.<\/p><pre class=\"language-matlab\"><span class=\"keyword\">function<\/span> mybtndown(ax,~,xdata,ydata,s,h)\r\n  <span class=\"comment\">% Start point<\/span>\r\n  sp = [];\r\n  <span class=\"comment\">% Don't let things move while we're selecting<\/span>\r\n  ax.XLimMode = <span class=\"string\">'manual'<\/span>;\r\n  ax.YLimMode = <span class=\"string\">'manual'<\/span>;\r\n  <span class=\"comment\">%<\/span>\r\n  <span class=\"comment\">% 1) Create the rectangle<\/span>\r\n  r = rectangle(<span class=\"string\">'Parent'<\/span>,ax);\r\n  <span class=\"comment\">%<\/span>\r\n  <span class=\"comment\">% 2) Figure's button motion function updates rectangle and highlight<\/span>\r\n  fig = ancestor(ax,<span class=\"string\">'figure'<\/span>);\r\n  fig.WindowButtonMotionFcn = @btnmotion;\r\n  <span class=\"keyword\">function<\/span> btnmotion(~,~)\r\n    cp = [ax.CurrentPoint(1,1:2)'];\r\n    <span class=\"keyword\">if<\/span> isempty(sp)\r\n        sp = cp;\r\n    <span class=\"keyword\">end<\/span>\r\n    <span class=\"comment\">% Make the rectangle go from sp to cp<\/span>\r\n    xmin = min([sp(1), cp(1)]);\r\n    xmax = max([sp(1), cp(1)]);\r\n    ymin = min([sp(2), cp(2)]);\r\n    ymax = max([sp(2), cp(2)]);\r\n    r.Position = [xmin, ymin, xmax-xmin, ymax-ymin];\r\n    <span class=\"comment\">% Identify all of the data points inside the rectangle<\/span>\r\n    mask = xdata&gt;=xmin &amp; xdata&lt;=xmax &amp; ydata&gt;=ymin &amp; ydata&lt;=ymax;\r\n    <span class=\"comment\">% And highlight them in both charts<\/span>\r\n    <span class=\"keyword\">for<\/span> i=1:length(h)\r\n        h(i).XData = s(i).XData(mask);\r\n        h(i).YData = s(i).YData(mask);\r\n    <span class=\"keyword\">end<\/span>\r\n  <span class=\"keyword\">end<\/span>\r\n  <span class=\"comment\">%<\/span>\r\n  <span class=\"comment\">% 3) Figure's button up function cleans up<\/span>\r\n  fig.WindowButtonUpFcn = @btnup;\r\n  <span class=\"keyword\">function<\/span> btnup(fig,~)\r\n    delete(r);\r\n    ax.XLimMode = <span class=\"string\">'auto'<\/span>;\r\n    ax.YLimMode = <span class=\"string\">'auto'<\/span>;\r\n    fig.WindowButtonMotionFcn = <span class=\"string\">''<\/span>;\r\n    fig.WindowButtonUpFcn = <span class=\"string\">''<\/span>;\r\n  <span class=\"keyword\">end<\/span>\r\n<span class=\"keyword\">end<\/span>\r\n<\/pre><p>This function creates the rectangle which shows what we're selecting, and two callbacks.<\/p><p>The first callback gets called whenever the mouse moves. In this one we update the rectangle, identify all of the data points inside it, and add them to the highlight in both charts.<\/p><p>The second callback gets called when the mouse button is released. This simply puts everything back to the way it started.<\/p><p>Of course you really need to try this out to get a feel for how effective this technique is. You should download <a href=\"https:\/\/blogs.mathworks.com\/images\/graphics\/2015\/linked_scatter.m\">this function<\/a> and try it yourself.<\/p><pre class=\"codeinput\">close\r\nfigure(<span class=\"string\">'Position'<\/span>,[500 500 750 350])\r\nt = table(meas{1},meas{2},meas{3},meas{4});\r\nt.Properties.VariableNames = {<span class=\"string\">'SepalLength'<\/span>,<span class=\"string\">'SepalWidth'<\/span>,<span class=\"string\">'PetalLength'<\/span>,<span class=\"string\">'PetalWidth'<\/span>};\r\nlinked_scatter(t);\r\n<\/pre><img decoding=\"async\" vspace=\"5\" hspace=\"5\" src=\"https:\/\/blogs.mathworks.com\/images\/graphics\/2015\/linked_scatter_example_04.png\" alt=\"\"> <script language=\"JavaScript\"> <!-- \r\n    function grabCode_3153fd14aeec4a199d3ea136167f0bb0() {\r\n        \/\/ Remember the title so we can use it in the new page\r\n        title = document.title;\r\n\r\n        \/\/ Break up these strings so that their presence\r\n        \/\/ in the Javascript doesn't mess up the search for\r\n        \/\/ the MATLAB code.\r\n        t1='3153fd14aeec4a199d3ea136167f0bb0 ' + '##### ' + 'SOURCE BEGIN' + ' #####';\r\n        t2='##### ' + 'SOURCE END' + ' #####' + ' 3153fd14aeec4a199d3ea136167f0bb0';\r\n    \r\n        b=document.getElementsByTagName('body')[0];\r\n        i1=b.innerHTML.indexOf(t1)+t1.length;\r\n        i2=b.innerHTML.indexOf(t2);\r\n \r\n        code_string = b.innerHTML.substring(i1, i2);\r\n        code_string = code_string.replace(\/REPLACE_WITH_DASH_DASH\/g,'--');\r\n\r\n        \/\/ Use \/x3C\/g instead of the less-than character to avoid errors \r\n        \/\/ in the XML parser.\r\n        \/\/ Use '\\x26#60;' instead of '<' so that the XML parser\r\n        \/\/ doesn't go ahead and substitute the less-than character. \r\n        code_string = code_string.replace(\/\\x3C\/g, '\\x26#60;');\r\n\r\n        copyright = 'Copyright 2015 The MathWorks, Inc.';\r\n\r\n        w = window.open();\r\n        d = w.document;\r\n        d.write('<pre>\\n');\r\n        d.write(code_string);\r\n\r\n        \/\/ Add copyright line at the bottom if specified.\r\n        if (copyright.length > 0) {\r\n            d.writeln('');\r\n            d.writeln('%%');\r\n            if (copyright.length > 0) {\r\n                d.writeln('% _' + copyright + '_');\r\n            }\r\n        }\r\n\r\n        d.write('<\/pre>\\n');\r\n\r\n        d.title = title + ' (MATLAB code)';\r\n        d.close();\r\n    }   \r\n     --> <\/script><p style=\"text-align: right; font-size: xx-small; font-weight:lighter;   font-style: italic; color: gray\"><br><a href=\"javascript:grabCode_3153fd14aeec4a199d3ea136167f0bb0()\"><span style=\"font-size: x-small;        font-style: italic;\">Get \r\n      the MATLAB code <noscript>(requires JavaScript)<\/noscript><\/span><\/a><br><br>\r\n      Published with MATLAB&reg; R2014b<br><\/p><\/div><!--\r\n3153fd14aeec4a199d3ea136167f0bb0 ##### SOURCE BEGIN #####\r\n%% Linked Selection\r\n% When we create visualizations of data which have multiple values\r\n% per data point, we need to use different graphics features to represent the\r\n% different values. These are called \"visual channels\". For example,\r\n% consider the following four charts.\r\nfigure('Position',[200 200 760 150]);\r\nco = get(groot,'DefaultAxesColorOrder');\r\ncol = co(1,:);\r\nv1 = [9 10 2 8];\r\nv2 = [7 1 3 6];\r\nv3 = [7 2 9 3];\r\nv4 = [1 6 3 8];\r\nv5 = [5 10 8 10];\r\nsubplot(1,4,1)\r\nbar(v1,'FaceColor',col)\r\ntitle('One Value')\r\nsubplot(1,4,2)\r\nscatter(v1,v2,'filled')\r\ntitle('Two Values')\r\nsubplot(1,4,3)\r\nscatter(v1,v2,25*v3,'filled')\r\ntitle('Three Values')\r\nsubplot(1,4,4)\r\nscatter(v1,v2,25*v3,v4,'filled')\r\ntitle('Four Values')\r\n\r\n%%\r\n% In the first, we're representing a single set of data values using the\r\n% heights of the bars.\r\n%\r\n% In the second, we're representing two data values using the X & Y\r\n% coordinates of the points in the scatter chart.\r\n%\r\n% In the third, we're using the size of the bubbles to represent a third \r\n% data value.\r\n%\r\n% And finally, in the fourth, we're using the colors to represent a fourth\r\n% data value.\r\n%\r\n% There are a number of different visual channels we can use. Tamara\r\n% Munzner's wonderful new book <http:\/\/www.crcpress.com\/product\/isbn\/9781466508910 \"Visualization Analysis & Design\"> lists\r\n% these visual channels in decreasing order of effectiveness.\r\n% \r\n% * Position\r\n% * Length\r\n% * Angle\r\n% * Area\r\n% * Depth (3D Position)\r\n% * Color luminance\r\n% * Color saturation\r\n% * Curvature\r\n% * Volume\r\n%\r\n% Unfortunately we can't mix all of these visual channels in one chart. For \r\n% example, the human vision system uses size as a depth cue for figuring \r\n% out how far away objects are. This means that we can't use both the area \r\n% and the depth channels. In practice, once we get past three or four \r\n% visual channels, we're probably not really creating an effective visualization. \r\n%\r\n% So what can we do if we have data with more than three of four values?\r\n% The best answer is usually to combine multiple charts. \r\nclf\r\nsubplot(1,5,1)\r\nbar(v1,'FaceColor',col)\r\ntitle('First Value')\r\nsubplot(1,5,2)\r\nbar(v2,'FaceColor',col)\r\ntitle('Second Value')\r\nsubplot(1,5,3)\r\nbar(v3,'FaceColor',col)\r\ntitle('Third Value')\r\nsubplot(1,5,4)\r\nbar(v4,'FaceColor',col)\r\ntitle('Fourth Value')\r\nsubplot(1,5,5)\r\nbar(v5,'FaceColor',col)\r\ntitle('Fifth Value')\r\n\r\n%%\r\n% The problem with this approach is that it can be difficult to keep track \r\n% of the which items in the different charts correspond to the same data \r\n% point. This can be very challenging when we're looking at a static \r\n% visualization, but if we create an interactive application we can make it \r\n% easier to see how multiple charts are related. One of my favorite techniques for\r\n% this is something called \"linked selection\". The basic idea is that when\r\n% you select an item in one chart, the corresponding items get highlighted in\r\n% the other charts. \r\n%\r\n% Here's an example. When I drag a rectangle in the scatter chart on the\r\n% right, I can see that that the data points in the lower left corner of\r\n% that chart correspond to the ones in the upper left of the other chart.\r\n%\r\n% <<..\/linked_selection_animation.gif>>\r\n%\r\n% There's a bit of setup required to link charts like this, but it really \r\n% isn't hard once you've learned the tricks. Let's walk through how I \r\n% created that example.\r\n%\r\n% First we'll need some data. This is the famous <http:\/\/en.wikipedia.org\/wiki\/Iris_flower_data_set \"Fisher Iris\" dataset>. \r\n% If you have the <https:\/\/www.mathworks.com\/products\/statistics\/ Statistics\r\n% Toolbox>, then you've already got this dataset. Otherwise, you'll have to\r\n% download it from the net.\r\nif ~exist('fisheriris.mat')\r\n    load fisheriris\r\nelse\r\n    txt = urlread('https:\/\/archive.ics.uci.edu\/ml\/machine-learning-databases\/iris\/iris.data');\r\n    meas = textscan(txt,'%f%f%f%f%s','delimiter',',');\r\nend\r\n\r\n%%\r\n% Next we'll need 2 axes and 4 scatter charts. Why four? Because we're\r\n% going to do the highlighting using\r\n% <https:\/\/blogs.mathworks.com\/graphics\/2014\/11\/11\/highlighting-parts-of-charts\/\r\n% the technique I described a couple of weeks ago>.\r\n%\r\nclose\r\nfigure('Position',[500 500 750 350])\r\na = gobjects(1,2);\r\ns = gobjects(1,2);\r\nh = gobjects(1,2);\r\nfor i=1:2\r\n    a(i) = subplot(1,2,i);\r\n    s(i) = scatter(meas{2*i-1},meas{2*i},'filled');\r\n    s(i).PickableParts = 'none';\r\n    s(i).MarkerFaceColor = col;\r\n    hold(a(i),'on');\r\n    h(i) = scatter(nan,nan);\r\n    h(i).PickableParts = 'none';\r\n    h(i).Marker = 'o';\r\n    h(i).SizeData = 50;\r\n    h(i).MarkerFaceColor = 'red';\r\nend\r\n\r\nxlabel(a(1),'SepalLength')\r\nylabel(a(1),'SepalWidth')\r\nxlabel(a(2),'PetalLength')\r\nylabel(a(2),'PetalWidth')\r\n\r\n%%\r\n% Now we need to add the interaction part. That starts when we click\r\n% on an axes, so we'll need to add a Hit event listener to each axes.\r\n%\r\naddlistener(a(1),'Hit',@(~,evd)mybtndown(a(1),evd,s(1).XData,s(1).YData,s,h));\r\naddlistener(a(2),'Hit',@(~,evd)mybtndown(a(2),evd,s(2).XData,s(2).YData,s,h));\r\n%%\r\n% Where mybtndown is the following function.\r\n%\r\n%   function mybtndown(ax,~,xdata,ydata,s,h)\r\n%     % Start point\r\n%     sp = [];    \r\n%     % Don't let things move while we're selecting\r\n%     ax.XLimMode = 'manual';\r\n%     ax.YLimMode = 'manual';\r\n%     %\r\n%     % 1) Create the rectangle\r\n%     r = rectangle('Parent',ax);\r\n%     %\r\n%     % 2) Figure's button motion function updates rectangle and highlight\r\n%     fig = ancestor(ax,'figure');\r\n%     fig.WindowButtonMotionFcn = @btnmotion;\r\n%     function btnmotion(~,~)\r\n%       cp = [ax.CurrentPoint(1,1:2)'];\r\n%       if isempty(sp)\r\n%           sp = cp;\r\n%       end\r\n%       % Make the rectangle go from sp to cp\r\n%       xmin = min([sp(1), cp(1)]);\r\n%       xmax = max([sp(1), cp(1)]);\r\n%       ymin = min([sp(2), cp(2)]);\r\n%       ymax = max([sp(2), cp(2)]);\r\n%       r.Position = [xmin, ymin, xmax-xmin, ymax-ymin];\r\n%       % Identify all of the data points inside the rectangle\r\n%       mask = xdata>=xmin & xdata<=xmax & ydata>=ymin & ydata<=ymax;\r\n%       % And highlight them in both charts\r\n%       for i=1:length(h)\r\n%           h(i).XData = s(i).XData(mask);\r\n%           h(i).YData = s(i).YData(mask);\r\n%       end\r\n%     end\r\n%     %\r\n%     % 3) Figure's button up function cleans up\r\n%     fig.WindowButtonUpFcn = @btnup;\r\n%     function btnup(fig,~)\r\n%       delete(r);\r\n%       ax.XLimMode = 'auto';\r\n%       ax.YLimMode = 'auto';\r\n%       fig.WindowButtonMotionFcn = '';\r\n%       fig.WindowButtonUpFcn = '';\r\n%     end\r\n%   end\r\n%\r\n% This function creates the rectangle which shows what we're selecting, and\r\n% two callbacks. \r\n%\r\n% The first callback gets called whenever the mouse moves.\r\n% In this one we update the rectangle, identify all of the data points\r\n% inside it, and add them to the highlight in both charts. \r\n%\r\n% The second callback gets called when the mouse button is released. This \r\n% simply puts everything back to the way it started.\r\n%\r\n% Of course you really need to try this out to get a feel for how effective\r\n% this technique is. You should download\r\n% <https:\/\/blogs.mathworks.com\/images\/graphics\/2015\/linked_scatter.m\r\n% this function> and try it yourself.\r\nclose\r\nfigure('Position',[500 500 750 350])\r\nt = table(meas{1},meas{2},meas{3},meas{4});\r\nt.Properties.VariableNames = {'SepalLength','SepalWidth','PetalLength','PetalWidth'};\r\nlinked_scatter(t);\r\n\r\n##### SOURCE END ##### 3153fd14aeec4a199d3ea136167f0bb0\r\n-->","protected":false},"excerpt":{"rendered":"<div class=\"overview-image\"><img src=\"https:\/\/blogs.mathworks.com\/graphics\/files\/feature_image\/linked_selection_thumbnail.gif\" class=\"img-responsive attachment-post-thumbnail size-post-thumbnail wp-post-image\" alt=\"\" decoding=\"async\" loading=\"lazy\" \/><\/div><p>Linked SelectionWhen we create visualizations of data which have multiple values per data point, we need to use different graphics features to represent the different values. These are called \"visual... <a class=\"read-more\" href=\"https:\/\/blogs.mathworks.com\/graphics\/2015\/01\/08\/linked-selection\/\">read more >><\/a><\/p>","protected":false},"author":89,"featured_media":172,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[7,9],"tags":[],"_links":{"self":[{"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/posts\/170"}],"collection":[{"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/users\/89"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/comments?post=170"}],"version-history":[{"count":5,"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/posts\/170\/revisions"}],"predecessor-version":[{"id":176,"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/posts\/170\/revisions\/176"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/media\/172"}],"wp:attachment":[{"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/media?parent=170"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/categories?post=170"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.mathworks.com\/graphics\/wp-json\/wp\/v2\/tags?post=170"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}