# Paint on Webcam Stream

**URL:** <https://discourse.processing.org/t/paint-on-webcam-stream/44803>\
**Category:** Libraries\
**Created:** [July 23, 2024, 6:41pm UTC](https://discourse.processing.org/t/paint-on-webcam-stream/44803 "2024-07-23T18:41:27Z")\
**Posts on this page:** 1\
**Showing post:** 7

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [July 23, 2024, 11:07pm UTC](https://discourse.processing.org/t/paint-on-webcam-stream/44803/7 "2024-07-23T23:07:11Z")

</div>

Hello @Atelierista,

> [@Atelierista](#):
>
> I have repeatedly proposed writing a small piece of software to superimpose whatever is drawn onto the webcam picture. (But the suggestion has been turned down because it’s “too much work.”)

A simple example that will draw with the mouse on an offscreen buffer with a transparent background and superimpose it on the webcam image:

```auto
import processing.video.*;

Capture cam;

PGraphics pg;
boolean clear;

void setup() 
  {
  size(640, 480);
  pg = createGraphics(640, 480);

  String[] cameras = Capture.list();
  
  if (cameras.length == 0) 
    {
    println("There are no cameras available for capture.");
    exit();
    } 
  else 
    {
    println("Available cameras:");
    for (int i = 0; i < cameras.length; i++) 
      {
      println(cameras[i]);
      }
    
    // The camera can be initialized directly using an 
    // element from the array returned by list():
    cam = new Capture(this, cameras[0]);
    cam.start();     
    }      
    
  pg.beginDraw();
  pg.clear(); // Transparent background
  pg.endDraw();      
  }

void draw() 
  {
  if (cam.available() == true) 
    {
    cam.read();
    }
  
  pg.beginDraw();
  pg.strokeWeight(10);
  pg.stroke(mouseX*255.0/640, mouseY*255/480, 0);
  pg.point(mouseX, mouseY);
  pg.endDraw();
  
  // The following does the same, and is faster when just drawing the image
  // without any additional resizing, transformations, or tint.
  set(0, 0, cam);
  image(pg, 0, 0);
  }
  
void mousePressed()
  {
  pg.clear();
  }

```

References:

> **[Render Techniques](https://processing.org/tutorials/rendering/)**
>
> Tools for rendering geometries in Processing.

> **[PGraphics / Reference](https://processing.org/reference/pgraphics)**
>
> Main graphics and rendering context, as well as the base API implementation for processing "core". Use this class if you need to draw into an off-screen graphics buffer. A PGraphics object can be cons…

Drawing pad:

> [@Wacom Intuos drawing + pressure](https://discourse.processing.org/t/wacom-intuos-drawing-pressure/44590/2):
>
> Hello @lucnijs, I brushed the dust off of my Wacom Intuos (CTL-6100WL) and took it out for a spin! There is a Tablet library that seems to work: References to get me started: [Processing 1.0 - Processing Discourse - Using graphics tablet with JPen](https://forum.processing.org/beta/num_1252169588.html) \< JPen was a keyword I searched for [sdk - Wacom Integration into java - Stack Overflow](https://stackoverflow.com/questions/53067393/wacom-integration-into-java) \< I have not yet explored this! I need to work on my pen strokes! I will have to integrate it with my project: [GLV Paint A very simple dra…](https://discourse.processing.org/t/glv-paint-a-very-simple-draw-and-save-program/12669)

`:)`

---

_[View the full topic](https://discourse.processing.org/t/paint-on-webcam-stream/44803)._