# How to display multiple images in one window?

I load 1 image and display them in 2 separate windows , one is normal and other one is grayscale filtered. But i need to display them in 1 window , side by side. I made example image :

My Code itself is atmoment simple , but is there any simple way how display them in 1 window ?

## C O D E :

**import numpy as np import cv2

cv2.imshow("frame1",aa) #display in windows cv2.imshow("frame2",bb)

cv2.waitKey(0) cv2.destroyAllWindows()**

edit retag close merge delete

nobody cant help ???

( 2017-11-16 08:29:31 -0500 )edit
1

I'm confused as to why this is still an issue!

( 2017-11-16 08:33:29 -0500 )edit

Sort by ยป oldest newest most voted

Since images are numpy arrays in OpenCV, we could use concatenate, vstack or hstack to help us achieve the task.

The comments in the code should be self explanatory but one thing to be aware of is:

1. Image Channels

A coloured and grey scale image have 3 and 1 channels respectively. You cannot just combine their respective matrices together so you need to convert one to the other. With this code, I converted the grey scale to a coloured one to facilitate the combination

2. Image Sizes

It goes without saying that this method fails when you have images of different sizes. Why? Because you are trying to perform operations on matrices of different dimensions.

PS: OpenCV also has hconcat and vconcat. I got the C++ version of it working just fine but never tested it on Python.

import cv2
import numpy as np

# I just resized the image to a quarter of its original size
image = cv2.resize(image, (0, 0), None, .25, .25)

grey = cv2.cvtColor(image, cv2.COLOR_RGB2GRAY)
# Make the grey scale image have three channels
grey_3_channel = cv2.cvtColor(grey, cv2.COLOR_GRAY2BGR)

numpy_vertical = np.vstack((image, grey_3_channel))
numpy_horizontal = np.hstack((image, grey_3_channel))

numpy_vertical_concat = np.concatenate((image, grey_3_channel), axis=0)
numpy_horizontal_concat = np.concatenate((image, grey_3_channel), axis=1)

cv2.imshow('Main', image)
cv2.imshow('Numpy Vertical', numpy_vertical)
cv2.imshow('Numpy Horizontal', numpy_horizontal)
cv2.imshow('Numpy Vertical Concat', numpy_vertical_concat)
cv2.imshow('Numpy Horizontal Concat', numpy_horizontal_concat)

cv2.waitKey()


Horizontal Stack

Vertical Stack

more

This is not right way.So I use this grey = cv2.cvtColor(image, cv2.COLOR_BGR2GRAY)

( 2017-11-16 21:42:44 -0500 )edit

@supra56 Why is it not right? I've never had any problem with whether to use cv2.COLOR_RGB2GRAY or cv2.COLOR_BGR2GRAY when it comes to converting a coloured image to grey scale. The image already has 3 channels so it's a matter of whether you want to read the blue or red channel first. If you are going for platform convention, then yes OpenCV uses BGR but I go for readability hence RGB. Plus, RGB is the widely adapted convention no wonder even OpenCV added it even though at the beginning BGR was the standard.

( 2017-11-16 22:23:15 -0500 )edit

Sorry, I did not realize that you are using on windows and I'm using on raspberry pi using linux. But I haven't attempted both cv2.COLOR_RGB2GRAY and cv2.COLOR_GRAY2BGR. I don't have time to attempt this. Because I'm working on robot.

( 2017-11-17 07:41:37 -0500 )edit

Hi, will this works in visual studio? unable to write import commands in visual studio.

( 2018-08-17 01:25:45 -0500 )edit

I corrected for u from eshirima 's code as above. Here is code:

import cv2
import numpy as np

# I just resized the image to a quarter of its original size
#image = cv2.resize(image, (0, 0), None, .25, .25)    #rem it out if u want smaller size

grey = cv2.cvtColor(image, cv2.COLOR_BGR2GRAY)
# Make the grey scale image have three channels
grey_3_channel = cv2.cvtColor(grey, cv2.COLOR_GRAY2BGR)

numpy_horizontal = np.hstack((image, grey_3_channel))

numpy_horizontal_concat = np.concatenate((image, grey_3_channel), axis=1)

cv2.imshow('Numpy Horizontal Concat', numpy_horizontal_concat)
cv2.waitKey()

more

1

thank you , this was helpful

( 2017-11-27 15:25:57 -0500 )edit

Can we run the same program in visual studio?

( 2018-08-17 01:29:06 -0500 )edit

the key of the problem is "set the roi"

 Mat matSrc = imread("e:/template/lena.jpg");
Mat matGray ;
cvtColor(matSrc,matGray,COLOR_BGR2GRAY);
cvtColor(matGray,matGray,COLOR_GRAY2BGR);

Mat matDst(Size(matSrc.cols*2,matSrc.rows),matSrc.type(),Scalar::all(0));
Mat matRoi = matDst(Rect(0,0,matSrc.cols,matSrc.rows));
matSrc.copyTo(matRoi);
matRoi = matDst(Rect(matSrc.cols,0,matSrc.cols,matSrc.rows));
matGray.copyTo(matRoi);

imshow("result",matSrc);
waitKey(0);
return;

more

c++ answer to a python problem ;(

( 2017-10-08 10:05:56 -0500 )edit
1

looks like im not only on who needs this in python

( 2017-10-08 12:43:10 -0500 )edit

( 2017-11-16 08:31:11 -0500 )edit

@poljakov13, please do not post answers here, if you have a question or comment, thank you.

( 2017-11-16 08:36:50 -0500 )edit

just wanted to correct this answer(atleast as I did it in Java):

imshow("result",matSrc); -> imshow("result",matDst);

( 2020-09-23 07:25:28 -0500 )edit

Official site

GitHub

Wiki

Documentation