# Image Depth Maps Tutorial for iOS: Getting Started

**URL:** <https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377>\
**Category:** 🎓 Courses & Articles\
**Created:** [November 8, 2017, 2:00pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377 "2017-11-08T14:00:37Z")\
**Posts on this page:** 20\
**Page:** 3

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [March 22, 2018, 9:23pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/41 "2018-03-22T21:23:12Z")

</div>

Apple does do some processing on the depth data, so there are going to be issues in certain situations around the edges of objects (especially hair!).

There is even more post processing done, if the `isDepthDataFiltered` property is `true`. You could try setting it to false and create your own algorithm to fill in the holes in the depth data.

---

<div class="post-metadata">

**Author:** ![eyzuky](https://s3.amazonaws.com/cdn.raywenderlich.com/community/forum-assets/noun-game-ghost-878668.png) [@eyzuky](https://forums.kodeco.com/u/eyzuky)\
**Post date:** [March 22, 2018, 11:16pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/42 "2018-03-22T23:16:42Z")

</div>

Thanks, implementing this algorithm is not something that is possible at the moment due to logistic issues, but maybe the question I asked in SO is a way to solve this? link to the question:

> <https://stackoverflow.com/questions/49428776/how-to-apply-ciedgepreserveupsamplefilter-on-ciimage>

🙂

---

<div class="post-metadata">

**Author:** ![seereen2004](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/seereen2004/32/81494_2.png) [@seereen2004](https://forums.kodeco.com/u/seereen2004)\
**Post date:** [March 26, 2018, 9:12pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/43 "2018-03-26T21:12:31Z")

</div>

@toojuice Thank you so much for your replay … Yes I make sure it is in this name test10.jpg and it does not work !.. and I am not sure why I only see the top part of my added images in the original mode … I tried photos with both direction … do you think because I am running this project on mac not iphone? for saving the image could you please give me piece of code … unfortunately I have no clue about this

---

<div class="post-metadata">

**Author:** ![zhanqan](https://s3.amazonaws.com/cdn.raywenderlich.com/community/forum-assets/noun-game-ghost-878668.png) [@zhanqan](https://forums.kodeco.com/u/zhanqan)\
**Post date:** [March 30, 2018, 2:01am UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/44 "2018-03-30T02:01:39Z")

</div>

Thank you so much for your replay.And I have another question,when I use real machine debugging,after I install this app, I cann’t find it in the Settings,and I don’t know why,hope for your reply.

---

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [April 2, 2018, 7:43pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/45 "2018-04-02T19:43:42Z")

</div>

Hi, how are you taking the pictures if you’re not using an iPhone?

---

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [April 2, 2018, 7:47pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/46 "2018-04-02T19:47:22Z")

</div>

Hi, do you mean the Settings app on the iPhone? It doesn’t show up there because it doesn’t have any settings and does not require special permissions (i.e. it doesn’t use the camera or have access to the photo library – all photos are packaged with the app)

---

<div class="post-metadata">

**Author:** ![seereen2004](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/seereen2004/32/81494_2.png) [@seereen2004](https://forums.kodeco.com/u/seereen2004)\
**Post date:** [April 2, 2018, 9:03pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/47 "2018-04-02T21:03:28Z")

</div>

I am taking the photos using iphone X … then I send it to the mac to use it in with this code

---

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [April 3, 2018, 12:36pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/48 "2018-04-03T12:36:58Z")

</div>

Hi @eyzuky,

Did you try it out? If so, does it look better?

---

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [April 3, 2018, 12:40pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/49 "2018-04-03T12:40:45Z")

</div>

Hi @seereen2004,

Ok, that should work too. That’s how I created the sample images that come with the tutorial. I have some more questions for you:

1. Are you using HEIF or converting to JPG?
2. How are you transferring the images to the Mac? (Airdrop, Image Capture, email, something else?)
3. When transferring the image, do you have multiple options for the same picture? I.e. do you see two copies of the same image for each portrait-mode shot?

---

<div class="post-metadata">

**Author:** ![eyzuky](https://s3.amazonaws.com/cdn.raywenderlich.com/community/forum-assets/noun-game-ghost-878668.png) [@eyzuky](https://forums.kodeco.com/u/eyzuky)\
**Post date:** [April 3, 2018, 1:03pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/50 "2018-04-03T13:03:10Z")

</div>

It did help! Looks much better 🙂

---

<div class="post-metadata">

**Author:** ![seereen2004](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/seereen2004/32/81494_2.png) [@seereen2004](https://forums.kodeco.com/u/seereen2004)\
**Post date:** [April 3, 2018, 4:27pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/51 "2018-04-03T16:27:20Z")

</div>

Hi @toojuice  
I am using iphone X to capture the portrait images and I used front and back cameras. I tried images with vertical and horizontal positions for the phone… I found it in JPG formate so I do not have to convert it ! … then I send it to the mac using Image Capture … and I see 2 images one with E and one without E … so I am using images without E to try this app

---

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [April 3, 2018, 7:04pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/52 "2018-04-03T19:04:40Z")

</div>

Are all the images that come with the starter/final project still showing up correctly in the **Original** and **Depth** mode?

---

<div class="post-metadata">

**Author:** ![seereen2004](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/seereen2004/32/81494_2.png) [@seereen2004](https://forums.kodeco.com/u/seereen2004)\
**Post date:** [April 3, 2018, 7:29pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/53 "2018-04-03T19:29:13Z")

</div>

Yes your images works perfect… the images that I captured cannot be shown completely …  
try the image in this link … this is one of my images that I captured with back camera [https://ibb.co/kqZFsH](https://ibb.co/kqZFsH)

---

<div class="post-metadata">

**Author:** ![seereen2004](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/seereen2004/32/81494_2.png) [@seereen2004](https://forums.kodeco.com/u/seereen2004)\
**Post date:** [April 3, 2018, 8:27pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/54 "2018-04-03T20:27:02Z")

</div>

You can try these images as well …

> **[test00](https://ibb.co/vPSTfCL)**
>
> Image test00 hosted in ImgBB

> **[test02](https://ibb.co/3Syccvb)**
>
> Image test02 hosted in ImgBB

> **[test07](https://ibb.co/G7hzqNx)**
>
> Image test07 hosted in ImgBB

the images with several objects I took them using iphone X… one with front camera and one with back camera (portrait mode) …bottle image I took it with iphone 7 plus (portrait mode)… bottle image I can see just the top part in the app … however, the other images I can see just middle part!

---

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [April 4, 2018, 7:43am UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/55 "2018-04-04T07:43:31Z")

</div>

Ok, so the `UIImageView` in the view controller is set to **Aspect Fill** , meaning that it will cut off any extra image on the sides or top that doesn’t match the phone’s aspect ratio. Since the tutorial app was created to only work in portrait mode, you will have to make some adjustments to get this to work with landscape images.

I also took a look at the raw data for your image and compared it to the raw data for one of the included images. It seems like it’s in a different format. The metadata seems to be missing. Within one of the included tutorial images, you can find raw text that looks like XML and some attributes that include the string `depthData`. This is completely absent from your image.

This makes me think that either 1) no depth data was captured or 2) the depth data was corrupted/removed by some post processing (either on the phone or on your Mac – not sure). Actually, the image sharing service you used may have modified the image, too? Maybe I don’t get the original that way. You could verify by downloading from your link and `diff`ing it with the original.

---

<div class="post-metadata">

**Author:** ![zhanqan](https://s3.amazonaws.com/cdn.raywenderlich.com/community/forum-assets/noun-game-ghost-878668.png) [@zhanqan](https://forums.kodeco.com/u/zhanqan)\
**Post date:** [April 5, 2018, 2:08am UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/56 "2018-04-05T02:08:33Z")

</div>

OK,I got it.Thank you so much .  
There is another problem.Do you know how to save the distance data as a single channel image? I want to use the distance data and RGB image to create its pointcloud file.

---

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [April 5, 2018, 7:25am UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/57 "2018-04-05T07:25:20Z")

</div>

In the current project, the image for the depth data is created from a `CIImage`, which is created from a `CVPixelBuffer`. This will **not** allow you to write out the data using a function such as `UIImagePNGRepresentation` or `UIImageJPEGRepresentation`.

In order to be able to use those function to save the depth data, you will need to first create a `CGImage` and then create a `UIImage` from that. When you create a `CGImage`, you’ll have to be careful with the orientation of the data, so keep that in mind.

---

<div class="post-metadata">

**Author:** ![seereen2004](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/seereen2004/32/81494_2.png) [@seereen2004](https://forums.kodeco.com/u/seereen2004)\
**Post date:** [April 5, 2018, 6:17pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/58 "2018-04-05T18:17:58Z")

</div>

@toojuice Appreciate your replay … is it possible that you post the code that can help us to save the depth ?  
Thank you so much

---

<div class="post-metadata">

**Author:** ![shogunkaramazov](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/shogunkaramazov/32/108826_2.png) [@shogunkaramazov](https://forums.kodeco.com/u/shogunkaramazov)\
**Post date:** [April 25, 2018, 8:40pm UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/60 "2018-04-25T20:40:09Z")

</div>

Opened on April 25, 2018, 8:40pm UTC



---

<div class="post-metadata">

**Author:** ![toojuice](https://assets.chunter.kodeco.com/user_avatar/forums.kodeco.com/toojuice/32/100912_2.png) [@toojuice](https://forums.kodeco.com/u/toojuice)\
**Post date:** [April 26, 2018, 10:13am UTC](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377/61 "2018-04-26T10:13:22Z")

</div>

This tutorial didn’t discuss capturing photos with depth data programmatically, but you can take a look at this one to see how:

[https://www.raywenderlich.com/185885/video-depth-maps-tutorial-for-ios-getting-started](https://www.raywenderlich.com/185885/video-depth-maps-tutorial-for-ios-getting-started)

If you want to capture from the TrueDepth camera instead of the Dual camera, just change the `AVCaptureDevice` from `.builtInDualCamera` to `.builtInTrueDepthCamera`.

[Previous page](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377.md?page=2)

[Next page](https://forums.kodeco.com/t/image-depth-maps-tutorial-for-ios-getting-started/36377.md?page=4)
