# Display 3D image using ITK and VTK

**URL:** <https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897>\
**Category:** Beginner Questions\
**Created:** [May 3, 2018, 1:53pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897 "2018-05-03T13:53:33Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![mabou](https://discourse.itk.org/letter_avatar_proxy/v4/letter/m/bbce88/32.png) [@mabou](https://discourse.itk.org/u/mabou)\
**Post date:** [May 3, 2018, 1:53pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/1 "2018-05-03T13:53:33Z")

</div>

Hi,  
I am using simple code which I found in ITK [Example](https://itk.org/Wiki/ITK/Examples/QuickViewDemo).  
I need to display nifti image, but all I got is black box. And when I hover the mouse over the window, the color changes from black to white, and I can’t see the image.

I think I am doing something wrong, because the code is very trivial. Any help is much appreciated. Thank you!

```
#include "itkImage.h"
#include "itkImageFileReader.h"
#include "QuickView.h"
int main(int argc, char *argv[])
{
  typedef itk::Image<unsigned char, 2> ImageType;
  typedef itk::ImageFileReader<ImageType> ReaderType;
  ReaderType::Pointer reader = ReaderType::New();
  reader->SetFileName("OT.nii");
  reader->Update();
  QuickView viewer;
  viewer.AddImage(reader->GetOutput());
  viewer.Visualize(true);
}
```

---

<div class="post-metadata">

**Author:** ![dzenanz](https://discourse.itk.org/user_avatar/discourse.itk.org/dzenanz/32/1093_2.png) [@dzenanz](https://discourse.itk.org/u/dzenanz)\
**Post date:** [May 3, 2018, 3:46pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/2 "2018-05-03T15:46:32Z")

</div>

> [@mabou](#):
>
> typedef itk::Image\<unsigned char, 2\> ImageType;

Because you declare your image as 2D, only the first slice is read. And if it only contains zero-values (black) pixels, you can’t see anything else when you visualize it.

---

<div class="post-metadata">

**Author:** ![matt.mccormick](https://discourse.itk.org/user_avatar/discourse.itk.org/matt.mccormick/32/7_2.png) [@matt.mccormick](https://discourse.itk.org/u/matt.mccormick)\
**Post date:** [May 3, 2018, 9:30pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/3 "2018-05-03T21:30:34Z")

</div>

@mabou This patch by @phcerdan may be of interest:

```
http://review.source.kitware.com/#/c/23387/
```

---

<div class="post-metadata">

**Author:** ![phcerdan](https://discourse.itk.org/user_avatar/discourse.itk.org/phcerdan/32/286_2.png) [@phcerdan](https://discourse.itk.org/u/phcerdan)\
**Post date:** [May 4, 2018, 2:57pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/4 "2018-05-04T14:57:05Z")

</div>

`itkViewImage` has been recently pushed to master!

@mabou give it a try if you use ITK from master.  
If not, you can still try it copying the files `itkViewImage.h` and `itkViewImage.hxx` from [here](https://github.com/InsightSoftwareConsortium/ITK/tree/master/Modules/Bridge/VtkGlue/include)  
to your include directory.

You can see an example of usage [here](https://github.com/InsightSoftwareConsortium/ITK/blob/master/Modules/Bridge/VtkGlue/test/runViewImage.cxx), but basically would be:

```cpp
// Change QuickView.h for itkViewImage.h
#include "itkViewImage.h"
...
reader->Update();
itk::ViewImage<ImageType>::View(reader->GetOutput());

```

And let us know! And as @dzenanz said, if your image is 3D, change the dimension of `ImageType`.

---

<div class="post-metadata">

**Author:** ![mabou](https://discourse.itk.org/letter_avatar_proxy/v4/letter/m/bbce88/32.png) [@mabou](https://discourse.itk.org/u/mabou)\
**Post date:** [May 7, 2018, 11:45am UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/5 "2018-05-07T11:45:41Z")

</div>

Thanks all for your help.  
I have copied `itkViewImage.h` and `itkViewImage.hxx` and used the code of `runViewImage.cxx` and I think it works better now, because when moving the mouse cursor, I can see the coordinates changes, but the third coordinate is always zero, which means it is always the first slice (which is black of course).  
Now my question: how I can move between slices? It should be done from the code or by moving the cursor?

---

<div class="post-metadata">

**Author:** ![phcerdan](https://discourse.itk.org/user_avatar/discourse.itk.org/phcerdan/32/286_2.png) [@phcerdan](https://discourse.itk.org/u/phcerdan)\
**Post date:** [May 7, 2018, 12:25pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/6 "2018-05-07T12:25:08Z")

</div>

Thanks for testing it @mabou.

You don’t need to change the code. From the top of my head (not in front of computer right now) try to press the right click button with the cursor in the slice you want to move, then move the mouse. You might need to first reorient the camera a little to do this in the Z slice. To orient the camera do the same (hold right-click) but with the cursor outside the image. Easier to play with it than to explain! 😃

---

<div class="post-metadata">

**Author:** ![mabou](https://discourse.itk.org/letter_avatar_proxy/v4/letter/m/bbce88/32.png) [@mabou](https://discourse.itk.org/u/mabou)\
**Post date:** [May 7, 2018, 12:47pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/7 "2018-05-07T12:47:50Z")

</div>

Okay, I could play with the camera orientation as you said (hold right-click outside the cursor). But, still I only see black frame, and the coordinates changed from (0,0,0) to (230,230,0), which means the Z slice is always zero!

---

<div class="post-metadata">

**Author:** ![phcerdan](https://discourse.itk.org/user_avatar/discourse.itk.org/phcerdan/32/286_2.png) [@phcerdan](https://discourse.itk.org/u/phcerdan)\
**Post date:** [May 7, 2018, 2:36pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/8 "2018-05-07T14:36:45Z")

</div>

Great! Now you are only missing moving the Z slice to see other values. Hold right-click with the cursor over the image, and move the mouse.

---

<div class="post-metadata">

**Author:** ![phcerdan](https://discourse.itk.org/user_avatar/discourse.itk.org/phcerdan/32/286_2.png) [@phcerdan](https://discourse.itk.org/u/phcerdan)\
**Post date:** [May 7, 2018, 2:38pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/9 "2018-05-07T14:38:04Z")

</div>

By the way, did you change the dimension to 3 in your code? If the dimension is two, there is only one slice with z=0, so nothing to move.

---

<div class="post-metadata">

**Author:** ![phcerdan](https://discourse.itk.org/user_avatar/discourse.itk.org/phcerdan/32/286_2.png) [@phcerdan](https://discourse.itk.org/u/phcerdan)\
**Post date:** [May 7, 2018, 2:45pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/10 "2018-05-07T14:45:17Z")

</div>

For 3D images you should see something like:

![screen_viewImage3D](https://discourse.itk.org/uploads/default/original/1X/87422056aa8c3bfb26032020a1aae17a69f585f5.png)

For 2D images:

![screen_viewImage2D](https://discourse.itk.org/uploads/default/original/1X/bfbff6f60bd3f9b6e05ac803735895818cb80e9f.png)

---

<div class="post-metadata">

**Author:** ![mabou](https://discourse.itk.org/letter_avatar_proxy/v4/letter/m/bbce88/32.png) [@mabou](https://discourse.itk.org/u/mabou)\
**Post date:** [May 7, 2018, 3:05pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/11 "2018-05-07T15:05:30Z")

</div>

Thank you a lot! It works perfectly now (although I haven’t change something from my last reply, but it happens 🙂 )

 ![Screenshot%20-%2005072018](https://discourse.itk.org/uploads/default/original/1X/545b7f4563d318c354fe9dd1b1a67fcb95ee5cfe.png)

---

<div class="post-metadata">

**Author:** ![phcerdan](https://discourse.itk.org/user_avatar/discourse.itk.org/phcerdan/32/286_2.png) [@phcerdan](https://discourse.itk.org/u/phcerdan)\
**Post date:** [May 7, 2018, 3:07pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/12 "2018-05-07T15:07:49Z")

</div>

Beautiful! 😃

---

<div class="post-metadata">

**Author:** ![Sara\_Caffe](https://discourse.itk.org/user_avatar/discourse.itk.org/sara_caffe/32/974_2.png) [@Sara\_Caffe](https://discourse.itk.org/u/Sara_Caffe)\
**Post date:** [October 27, 2019, 11:55am UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/13 "2019-10-27T11:55:18Z")

</div>

Thank you for sharing your knowledge

I have images that I have already normalized the values between [0,1] and saved them in `nii.gz` files  
I created the itk::Image with the followings:

```
typedef float PixelType;
constexpr unsigned int Dimension=3;
using ImageType=itk::Image<PixelType ,Dimension>;

```

When I am moving the cursor, I can see the values of voxels in the image is changing, but it shows a black box. What could be the reason.

Thanks

---

<div class="post-metadata">

**Author:** ![dzenanz](https://discourse.itk.org/user_avatar/discourse.itk.org/dzenanz/32/1093_2.png) [@dzenanz](https://discourse.itk.org/u/dzenanz)\
**Post date:** [October 27, 2019, 2:14pm UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/14 "2019-10-27T14:14:48Z")

</div>

The image values are probably being cast to `unsigned char`, which has a range 0-255. So all your voxels get converted to 0 (black) or 1 (less deep black). To have non-black visualization, try rescaling your image to pixel type `unsigned char` using [RescaleIntensity](https://itk.org/Doxygen/html/classitk_1_1RescaleIntensityImageFilter.html) filter.

---

<div class="post-metadata">

**Author:** ![Chang2](https://discourse.itk.org/user_avatar/discourse.itk.org/chang2/32/1658_2.png) [@Chang2](https://discourse.itk.org/u/Chang2)\
**Post date:** [August 4, 2020, 12:52am UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/15 "2020-08-04T00:52:16Z")

</div>

Hi Pablo,  
I am new to ITK/VTK. I tried exactly the same code and CMakeList. It compiles fine. But I get seg fault whenever I ran the code. I have included my code below. I really want to get it working. Any help is much appreciated. Thank you so much!  
Chang

```auto
#include "itkImage.h"
#include "itkImageFileReader.h"
#include "itkRescaleIntensityImageFilter.h"
#include "itkViewImage.h"
#include <iostream>

int main(int argc, char *argv[]) {

using ImageType = itk::Image<unsigned char, 3>;
using ReaderType = itk::ImageFileReader<ImageType>;

ReaderType::Pointer reader = ReaderType::New();
reader->SetFileName("/home/chang2/c2dev/Data/ZZAILabUCSD_HN01/ct3dhn.nii");
reader->Update();

typedef itk::RescaleIntensityImageFilter< ImageType, ImageType > RescaleFilterType;
RescaleFilterType::Pointer rescaleFilter = RescaleFilterType::New();
rescaleFilter->SetInput(reader->GetOutput());
rescaleFilter->SetOutputMinimum(0);
rescaleFilter->SetOutputMaximum(255);

itk::ViewImage<ImageType>::View(rescaleFilter->GetOutput());

return EXIT_SUCCESS;
}

```

```auto
cmake_minimum_required(VERSION 3.10)

project(HelloITK)

set(ITK_DIR "/home/chang2/c2dev/ITK-Build")
set(VTK_DIR "/home/chang2/c2dev/VTK-Build")
find_package(ITK REQUIRED)
include(${ITK_USE_FILE})

if (ITKVtkGlue_LOADED)
  find_package(VTK REQUIRED)
  include(${VTK_USE_FILE})
else()
  find_package(ItkVtkGlue REQUIRED)
  include(${ItkVtkGlue_USE_FILE})
  set(Glue ItkVtkGlue)
endif()

# Add executable called "HelloITK" that is built from the source file "HelloITKWorld.cxx".
# Any number of source files can be listed here.  
add_executable(HelloITK HelloITK.cxx)

# Link the executable "HelloITK" to the libraries. 
target_link_libraries(HelloITK ${Glue} ${VTK_LIBRARIES} ${ITK_LIBRARIES})

```

---

<div class="post-metadata">

**Author:** ![phcerdan](https://discourse.itk.org/user_avatar/discourse.itk.org/phcerdan/32/286_2.png) [@phcerdan](https://discourse.itk.org/u/phcerdan)\
**Post date:** [August 4, 2020, 9:53am UTC](https://discourse.itk.org/t/display-3d-image-using-itk-and-vtk/897/16 "2020-08-04T09:53:29Z")

</div>

Hi @Chang2

My first guess is that you are missing the `Update` step for the `rescaleFilter`. Add it here:

```cpp
rescaleFilter->SetOutputMaximum(255);
rescaleFilter->Update();

itk::ViewImage::View(rescaleFilter->GetOutput());

```