# Image from One Sketch to the Next

**URL:** <https://cl.desmos.com/t/image-from-one-sketch-to-the-next/7871>\
**Category:** Questions\
**Tags:** sketch\
**Created:** [April 4, 2025, 12:51pm UTC](https://cl.desmos.com/t/image-from-one-sketch-to-the-next/7871 "2025-04-04T12:51:00Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Bella\_Dukes](https://yyz1.discourse-cdn.com/flex031/user_avatar/cl.desmos.com/bella_dukes/32/6862_2.png) [@Bella\_Dukes](https://cl.desmos.com/u/Bella_Dukes)\
**Post date:** [April 4, 2025, 12:51pm UTC](https://cl.desmos.com/t/image-from-one-sketch-to-the-next/7871/1 "2025-04-04T12:51:00Z")

</div>

I have several sketch layers that students can draw on for the first 4 slides. I coded a way for whatever the students sketched on each separate slide will be shown all on one slide at the end. All they have to do is click the button to shuffle through all their sketches, all that last slide. My issue is that the images that are being used as the background of the original sketches don’t show up. Is there a way to make this happen? Here’s my activity for reference: [9B - Surface Area TBD • Activity by Nancy Dukes](https://teacher.desmos.com/activitybuilder/custom/67ef2ac6d70a7f947bcc7e48?utm_campaign=share&utm_content=activity)

---

<div class="post-metadata">

**Author:** ![Daniel\_Grubbs](https://yyz1.discourse-cdn.com/flex031/user_avatar/cl.desmos.com/daniel_grubbs/32/719_2.png) [@Daniel\_Grubbs](https://cl.desmos.com/u/Daniel_Grubbs)\
**Post date:** [April 4, 2025, 4:04pm UTC](https://cl.desmos.com/t/image-from-one-sketch-to-the-next/7871/2 "2025-04-04T16:04:31Z")

</div>

Welcome @Bella_Dukes! The `background:` sink you’re using takes “layers”. You are importing only the `sketchLayer`, and unfortunately there’s no `imageLayer`, which could be oversight but could be by design (i.e. because images have different dimensions, it could cause issues referencing them).

There are two methods I can see you might use. Both will first require using sketches with graph backgrounds (instead of image backgrounds) with your images imported into the graphs (or rebuilt in the graph). I’d recommend keeping the same bounds for each screen, and adjusting your image dimensions to fit. The final composite screen should also be a sketch with a graph with the same bounds, or define a `bounds:` sink.

Next, you have two routes. (1) Edit your current final screen conditional to include the `calculatorState` for each sketch. To combine different layer types, you use `layerStack`.  
Note: layers stack left to right (bottom to top).

```auto
when graph12.number("D")=0 layerStack(graphLayer(sketch8.calculatorState), sketchLayer(sketch8.sketch))

```

(2) Alternatively, you can keep your original `background:` sink, but add a `number` sink to use to conditionally display each image based on variable D. Your final graph should have all the images as you’re not pulling them from another screen.

```auto
number(`D`): graph12.number(`D`)

```

Here’s a [sample graph](https://www.desmos.com/calculator/5atzry5ikd) with some images conditionally displayed by D.

---

<div class="post-metadata">

**Author:** ![Bella\_Dukes](https://yyz1.discourse-cdn.com/flex031/user_avatar/cl.desmos.com/bella_dukes/32/6862_2.png) [@Bella\_Dukes](https://cl.desmos.com/u/Bella_Dukes)\
**Post date:** [April 6, 2025, 2:37am UTC](https://cl.desmos.com/t/image-from-one-sketch-to-the-next/7871/3 "2025-04-06T02:37:03Z")

</div>

Thank you so much! The final product is exactly what I wanted!