Repository: processing/p5.js (JavaScript)

Issue:
get(x, y, w, h) output image width/height is doubled
### Most appropriate sub-area of p5.js?

- [ ] Accessibility
- [ ] Color
- [X] Core/Environment/Rendering
- [ ] Data
- [ ] DOM
- [ ] Events
- [x] Image
- [ ] IO
- [ ] Math
- [ ] Typography
- [ ] Utilities
- [ ] WebGL
- [ ] Build Process
- [ ] Unit Testing
- [ ] Internalization
- [ ] Friendly Errors
- [ ] Other (specify if possible)

### p5.js version

1.8.0

### Web browser and version

119.0.6045.123

### Operating System

MacOSX 12.5.1

### Steps to reproduce this

### Steps:
1. set canvas to specific size, ie. `createCanvas(400, 400`
2. `fb = get(0, 0, width, height)` to grab the whole canvas 
3. check size of of `print(fb.width)`, returns 800...

I loooove using [visual feedback](https://editor.p5js.org/ffd8/sketches/G8ZZpD0lI) in p5.js, using `get()` to grab the image at the end of the draw, and place it back at the top of the draw scaled or rotated... just tried loading some works i had made the past weeks after updating to 1.8.0 and nothing worked.. computer ran slow.. no feedback, weird.. tested code in v1.7.0 and voila, worked great again. Turns out there's a *bug?* in v1.8.0 for the `get()` function that's doubling the image size... probably has something to do with the pixelDensity or some new WEBGL(2?) aspect of the canvas?? I know by default when one says `createCanvas(400, 400)` it's actually `800,800` on a retina display unless using `pixelDensity(1)`.. however it seems like a bug that the `get()` image size is that doubled size compared to that of the canvas. I think the [3rd example](https://p5js.org/reference/#/p5/get) for `get()` in the docs even looks different than expected.. it's asking for half the image, but showing 1/4 of it due to the scaling issue. Change the demo code with the following two lines and the problem is clear:
```js
let c = get(0, 0, width / 2, height / 2);
image(c, 0, 0);
```
Aaand digging into the render js, [found the change](https://github.com/processing/p5.js/blob/28740f9cda2e6983bd27c0564cd029fa9241d733/src/core/p5.Renderer.js#L161) that is causing it! Curious if/why or for what other function this needed to change...

Here's a basic example Example:
https://editor.p5js.org/ffd8/sketches/SUf60UZhg

### Snippet:

```js
function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  fb = get(0, 0, width, height)
  print(fb.width)
}```


Discussion: @davepagurek  @Gaurav-1306 – curious if you also experience the issue mentioned above. I tracked down the [commit](https://github.com/processing/p5.js/commit/963b77f26bb8dea7bbb25cfd010840aa17324f1d) that changed the `get()` along with similar changes for `pixelDensity()`, which came out of [this issue](https://github.com/processing/p5.js/issues/6114). 
oh I bet it's because the next line is `region._pixelDensity = pd;` instead of `region.pixelDensity(pd);` -- the latter should divide the width and height back again:
https://github.com/processing/p5.js/blob/17304ce9e9ef3f967bd828102a51b62a2d39d4f4/src/image/p5.Image.js#L253-L255
I understand the mistake there. Let me make a new commit. Will change according to Dave's suggestion.



Fix (patch):
diff --git a/src/core/p5.Renderer.js b/src/core/p5.Renderer.js
index c869f3e6b4..21ce3bd64b 100644
--- a/src/core/p5.Renderer.js
+++ b/src/core/p5.Renderer.js
@@ -159,7 +159,7 @@ class Renderer extends p5.Element {
     }
 
     const region = new p5.Image(w*pd, h*pd);
-    region._pixelDensity = pd;
+    region.pixelDensity(pd);
     region.canvas
       .getContext('2d')
       .drawImage(canvas, x, y, w * pd, h * pd, 0, 0, w*pd, h*pd);