# Render to image with D2D

**URL:** <https://forum.juce.com/t/render-to-image-with-d2d/62542>\
**Category:** Direct2D\
**Created:** [August 19, 2024, 8:42am UTC](https://forum.juce.com/t/render-to-image-with-d2d/62542 "2024-08-19T08:42:22Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Fandusss](https://avatars.discourse-cdn.com/v4/letter/f/a4c791/32.png) [@Fandusss](https://forum.juce.com/u/Fandusss)\
**Post date:** [August 19, 2024, 8:42am UTC](https://forum.juce.com/t/render-to-image-with-d2d/62542/1 "2024-08-19T08:42:22Z")

</div>

Hi everyone,

I wanted to gain some clarity on image rendering with D2D. I’m about to implement a goniometer, to show phase correlation. The art style is a lot of dots, which fade over time. Historically I’ve done this by rendering all new dots into an image, then the next frame, I reduce the alpha of the whole image, then render new dots into it. This cycle repeats each frame, resulting in old dots fading out and new dots being full alpha.

Does D2D change this in any way? I know it’s not good to do anything pixel by pixel, but is rendering into an image every frame an issue in its own right? How should this ideally be done?

Thanks in advance!

---

<div class="post-metadata">

**Author:** ![matt](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/matt/32/18340_2.png) [@matt](https://forum.juce.com/u/matt)\
**Post date:** [August 19, 2024, 4:29pm UTC](https://forum.juce.com/t/render-to-image-with-d2d/62542/2 "2024-08-19T16:29:18Z")

</div>

That should be doable. Let me give this some thought.

Matt

---

<div class="post-metadata">

**Author:** ![matt](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/matt/32/18340_2.png) [@matt](https://forum.juce.com/u/matt)\
**Post date:** [August 19, 2024, 5:05pm UTC](https://forum.juce.com/t/render-to-image-with-d2d/62542/3 "2024-08-19T17:05:29Z")

</div>

How big are the dots? How many dots are you drawing at once?

---

<div class="post-metadata">

**Author:** ![djb-2](https://avatars.discourse-cdn.com/v4/letter/d/73ab20/32.png) [@djb-2](https://forum.juce.com/u/djb-2)\
**Post date:** [August 20, 2024, 1:33am UTC](https://forum.juce.com/t/render-to-image-with-d2d/62542/4 "2024-08-20T01:33:07Z")

</div>

I’d be curious about this too.

So far we’ve been using a SoftwareImage type to do all the pixel work (such as fading out pixels, setting a specific colour to pixels, or drawing lines on top of an existing bitmap) and render the resulting image into a Graphics context. Curious to see if this is still a recommended way in case we have a lot of individual pixel operations and D2D to work with.

---

<div class="post-metadata">

**Author:** ![matt](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/matt/32/18340_2.png) [@matt](https://forum.juce.com/u/matt)\
**Post date:** [August 20, 2024, 12:04pm UTC](https://forum.juce.com/t/render-to-image-with-d2d/62542/5 "2024-08-20T12:04:32Z")

</div>

Here’s one approach; I can think of a few others.

[https://github.com/mattgonzalez/JUCEDirect2DTest/blob/pips/PIPs/ImageOverlay.h](https://github.com/mattgonzalez/JUCEDirect2DTest/blob/pips/PIPs/ImageOverlay.h)

The overall concept:

- Create a software image
- Paint the dots onto the software image
- Create two Direct2D images called previousImage and composite
- Clear the composite image
- Paint previousImage onto composite with partial transparency
- Paint the software image onto the composite with full opacity
- Paint the composite image onto the window
- Swap the composite and previousImage variables

This avoids the cost of mapping the software image from the GPU back to the CPU.

Hope that helps-

Matt