How to display an array with textbox in a figure? - arrays

Question

I'm trying to display an array as a figure in MATLAB using coloured textbox that varies according to the value at that location.
So far, I have tried to use the MATLAB Edit Plot Tool to draw such a figure and then generate the code to see what it might look like. Here is what I came up with:
figure1=figure
annotation(figure1,'textbox',...
[0.232125037302298 0.774079320113315 0.034810205908684 0.0410764872521246],...
'String','HIT',...
'FitBoxToText','off',...
'BackgroundColor',[0.470588235294118 0.670588235294118 0.188235294117647]);
annotation(figure1,'textbox',...
[0.27658937630558 0.774079320113315 0.034810205908684 0.0410764872521246],...
'String',{'STAY'},...
'FitBoxToText','off',...
'BackgroundColor',[1 0 0]);
Here the result does not look so good. I'd like something neat and not as hard to write. Visually, I'd like something like this:

Answer 1

I've found a possible solution using the pcolor function.
Warning: I've tested it only with Octave
If you want to create a (m x n) table with, as per your picture, 4 colour, you have to:
create an array with size (m+1 x n+1) of integers' in the1:4` range setting them according to the desired order
call pcolor to plot the table
adjust the size of the figure
create your own colormap according to the desired colors
set the `colormap'
add the desired text using the text function
set the tick and ticklabel of the axes
Edit to answer the comment
In the following you can find a possible implementation of the proposed solution.
The code creates two figure:
In the first one wil be ploted the values of the input matrix
In the second one the user defined strings
The association "color - value" is performed through the user-defined colormap.
Since in the matrix x there are 4 different possible values (it has been defined as x=randi([1 4],n_row+1,n_col+1);) the colormap has to consists of 4 RGB entry as follows.
cm=[1 0.3 0.3 % RED
0.3 0.3 1 % BLUE
0 1 0 % GREEN
1 1 1]; % WHITE
Should you want to change the association, you just have to change the order of the rows of the colormap.
The comments in the code should clarify the above steps.
Code updated
% Define a rnadom data set
n_row=24;
n_col=10;
x=randi([1 4],n_row+1,n_col+1);
for fig_idx=1:2
% Open two FIGURE
% In the first one wil be ploted the values of the input matrix
% In the second one the user defined strings
figure('position',[ 1057 210 606 686])
% Plot the matrix
s=pcolor(x);
set(s,'edgecolor','w','linewidth',3)
% Define the colormap
%cm=[1 1 1
% 0 1 0
% 0.3 0.3 1
% 1 0.3 0.3];
cm=[1 0.3 0.3 % RED
0.3 0.3 1 % BLUE
0 1 0 % GREEN
1 1 1]; % WHITE
% Set the colormap
colormap(cm);
% Write the text according to the color
[r,c]=find(x(1:end-1,1:end-1) == 1);
for i=1:length(r)
if(fig_idx == 1)
ht=text(c(i)+.1,r(i)+.5,num2str(x(r(i),c(i))));
else
ht=text(c(i)+.1,r(i)+.5,'SUR');
end
set(ht,'fontweight','bold','fontsize',10);
end
% Write the text according to the color
[r,c]=find(x(1:end-1,1:end-1) == 2);
for i=1:length(r)
if(fig_idx == 1)
ht=text(c(i)+.1,r(i)+.5,num2str(x(r(i),c(i))));
else
ht=text(c(i)+.1,r(i)+.5,'DBL');
end
set(ht,'fontweight','bold','fontsize',10);
end
% Write the text according to the color
[r,c]=find(x(1:end-1,1:end-1) == 3);
for i=1:length(r)
if(fig_idx == 1)
ht=text(c(i)+.1,r(i)+.5,num2str(x(r(i),c(i))));
else
ht=text(c(i)+.1,r(i)+.5,'HIT');
end
set(ht,'fontweight','bold','fontsize',10);
end
% Write the text according to the color
[r,c]=find(x(1:end-1,1:end-1) == 4);
for i=1:length(r)
if(fig_idx == 1)
ht=text(c(i)+.1,r(i)+.5,num2str(x(r(i),c(i))));
else
ht=text(c(i)+.1,r(i)+.5,'STK');
end
set(ht,'fontweight','bold','fontsize',10);
end
% Create and set the X labels
xt=.5:10.5;
xtl={' ';'2';'3';'4';'5';'6';'7';'8';'9';'10';'A'};
set(gca,'xtick',xt);
set(gca,'xticklabel',xtl,'xaxislocation','top','fontweight','bold');
% Create and set the X labels
yt=.5:24.5;
ytl={' ';'Soft20';'Soft19';'Soft18';'Soft17';'Soft16';'Soft15';'Soft14';'Soft13'; ...
'20';'19';'18';'17';'16';'15';'14';'13';'12';'11';'10';'9';'8';'7';'6';'5'};
set(gca,'ytick',yt);
set(gca,'yticklabel',ytl,'fontweight','bold');
title('Dealer''s Card')
end
Table with the values in the input matrix
Table with the user-defined strings

Answer 2

This is an answer inspired by il_raffa's answer, but with also quite a few differences. There is no better or worse, it's just a matter of preferences.
Main differences are:
it uses imagesc instead of pcolor
it uses a second overlaid axes for fine control of the grid color/thickness/transparency etc...
The association between value - label - color is set right at the beginning in one single table. All the code will then respect this
table.
It goes like this:
%% Random data
n_row = 24;
n_col = 10;
vals = randi([1 4], n_row, n_col);
%% Define labels and associated colors
% this is your different labels and the color associated. There will be
% associated to the values 1,2,3, etc ... in the order they appear in this
% table:
Categories = {
'SUR' , [1 0 0] % red <= Label and color associated to value 1
'DBL' , [0 0 1] % blue <= Label and color associated to value 2
'HIT' , [0 1 0] % green <= Label and color associated to value 3
'STK' , [1 1 1] % white <= you know what this is by now ;-)
} ;
% a few more settings
BgColor = 'w' ; % Background color for various elements
strTitle = 'Dealer''s Card' ;
%% Parse settings
% get labels according to the "Categories" defined above
labels = Categories(:,1) ;
% build the colormap according to the "Categories" defined above
cmap = cell2mat( Categories(:,2) ) ;
%% Display
hfig = figure('Name',strTitle,'Color',BgColor,...
'Toolbar','none','Menubar','none','NumberTitle','off') ;
ax1 = axes ;
imagesc(vals) % Display each cell with an associated color
colormap(cmap); % Set the colormap
grid(ax1,'off') % Make sure there is no grid
% Build and place the texts objects
textStrings = labels(vals) ;
[xl,yl] = meshgrid(1:n_col,1:n_row);
hStrings = text( xl(:), yl(:), textStrings(:), 'HorizontalAlignment','center');
%% Modify text color if needed
% (White text for the darker box colors)
textColors = repmat(vals(:) <= 2 ,1,3);
set(hStrings,{'Color'},num2cell(textColors,2));
%% Set the axis labels
xlabels = [ cellstr(num2str((2:10).')) ; {'A'} ] ;
ylabels = [ cellstr(num2str((5:20).')) ; cellstr(reshape(sprintf('soft %2d',[13:20]),7,[]).') ] ;
set(ax1,'XTick', 1:numel(xlabels), ...
'XTickLabel', xlabels, ...
'YTick', 1:numel(ylabels), ...
'YTickLabel', ylabels, ...
'TickLength', [0 0], ...
'fontweight', 'bold' ,...
'xaxislocation','top') ;
title(strTitle)
%% Prettify
ax2 = axes ; % create new axe and retrieve handle
% superpose the new axe on top, at the same position
set(ax2,'Position', get(ax1,'Position') );
% make it transparent (no color)
set(ax2,'Color','none')
% set the X and Y grid ticks and properties
set(ax2,'XLim',ax1.XLim , 'XTick',[0 ax1.XTick+0.5],'XTickLabel','' ,...
'YLim',ax1.YLim , 'YTick',[0 ax1.YTick+0.5],'YTickLabel','' ,...
'GridColor',BgColor,'GridAlpha',1,'Linewidth',2,...
'XColor',BgColor,'YColor',BgColor) ;
% Make sure the overlaid axes follow the underlying one
resizeAxe2 = #(s,e) set(ax2,'Position', get(ax1,'Position') );
hfig.SizeChangedFcn = resizeAxe2 ;
It produces the following figure:
Of course, you can replace the colors with your favorite colors.
I would encourage you to play with the grid settings of the ax2 for different effects, and you can also play with the properties of the text objects (make them bold, other color etc ...). Have fun !