# Problems with canvas size

**URL:** <https://discourse.processing.org/t/problems-with-canvas-size/4026>\
**Category:** Beginners\
**Created:** [October 1, 2018, 9:08pm UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026 "2018-10-01T21:08:36Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![mojo](https://avatars.discourse-cdn.com/v4/letter/m/85f322/32.png) [@mojo](https://discourse.processing.org/u/mojo)\
**Post date:** [October 1, 2018, 9:08pm UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/1 "2018-10-01T21:08:36Z")

</div>

Hi there,

I am happy to have started to learn Processing however I seem to have fallen at the first hurdle.

When I am completing the beginner tutorial video, and code I type in just results in what I would guess to be a 25x25 pixel grey canvas.

I sometimes catch a glimpse of the shape if I make it big enough.

Thank you for any help given!

Cheers Joe

---

<div class="post-metadata">

**Author:** ![ScottGrogin](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/scottgrogin/32/1689_2.png) [@ScottGrogin](https://discourse.processing.org/u/ScottGrogin)\
**Post date:** [October 1, 2018, 9:22pm UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/2 "2018-10-01T21:22:55Z")

</div>

Hey mojo,

Could you post your code so we can see what is happening?

---

<div class="post-metadata">

**Author:** ![Sarah](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/sarah/32/1675_2.png) [@Sarah](https://discourse.processing.org/u/Sarah)\
**Post date:** [October 2, 2018, 1:23am UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/3 "2018-10-02T01:23:29Z")

</div>

Did you specify the sketches size in `void setup() {}` with `size(width,height);`?

---

<div class="post-metadata">

**Author:** ![mojo](https://avatars.discourse-cdn.com/v4/letter/m/85f322/32.png) [@mojo](https://discourse.processing.org/u/mojo)\
**Post date:** [October 2, 2018, 7:07am UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/4 "2018-10-02T07:07:21Z")

</div>

Hi Scott,

This is the code:

```auto
ellipse(200, 250, 200, 200) ;

```

Cheers Joe!

---

<div class="post-metadata">

**Author:** ![mojo](https://avatars.discourse-cdn.com/v4/letter/m/85f322/32.png) [@mojo](https://discourse.processing.org/u/mojo)\
**Post date:** [October 2, 2018, 7:08am UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/5 "2018-10-02T07:08:29Z")

</div>

I didn’t! In the video Dan Shiffman doesn’t specify to do so!

Is this something you always need to do or perhaps a change in the update?

Many thanks, Joe

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [October 2, 2018, 7:11am UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/6 "2018-10-02T07:11:54Z")

</div>

Usually you need a call to `size()` to specify how big the sketch window should be.

Try this:

```auto
size(600,400);
ellipse(200, 250, 200, 200);

```

You might also consider using `setup()` and `draw()`, like so:

```auto
void setup(){
  size(600,400);
}

void draw(){
  background(0);
  ellipse(200, 250, 200, 200);
}

```

This is about as basic as a decent sketch gets. next, try adding color (`stroke()` or `fill()`), or maybe move the ellipse (try drawing it at (`mouseX`, `mouseY`) instead)?

---

<div class="post-metadata">

**Author:** ![Sarah](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/sarah/32/1675_2.png) [@Sarah](https://discourse.processing.org/u/Sarah)\
**Post date:** [October 2, 2018, 8:03am UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/7 "2018-10-02T08:03:23Z")

</div>

I also suggest you check out [https://processing.org/tutorials/](https://processing.org/tutorials/) for more basic information on Processing.

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [October 3, 2018, 2:38am UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/8 "2018-10-03T02:38:53Z")

</div>

In general:

If you do not define a sketch size, a sketch defaults to 100x100 pixels.

For this reason, almost every example sketch (see the examples in your PDE Examples folder) defines a `size()` in `setup()`.

[https://processing.org/reference/size\_.html](https://processing.org/reference/size_.html)

---

<div class="post-metadata">

**Author:** ![mojo](https://avatars.discourse-cdn.com/v4/letter/m/85f322/32.png) [@mojo](https://discourse.processing.org/u/mojo)\
**Post date:** [October 3, 2018, 7:22pm UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/9 "2018-10-03T19:22:52Z")

</div>

Amazing, thank you everyone for your help. My processing journey shall continue.

[http://hello.processing.org/editor/](http://hello.processing.org/editor/)

That is the video I was following, the problem is in the shapes section.

Cheers Joe

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [October 4, 2018, 2:41pm UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/10 "2018-10-04T14:41:12Z")

</div>

> [@mojo](#):
>
> That is the video I was following, the problem is in the shapes section.

When I go to the Shapes section and click “Skip to Exercise” I see this:

![48%20AM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/a/ae13651d8f7f7a14603ba2364229e6865cf7b02c.png)

What is the problem you are having with it? Was your browser window too narrow to see the full output area?

Or is the issue that you wanted to do the exercise in the desktop PDE, and that the example didn’t have a size directive when you cut-pasted it?

---

<div class="post-metadata">

**Author:** ![mojo](https://avatars.discourse-cdn.com/v4/letter/m/85f322/32.png) [@mojo](https://discourse.processing.org/u/mojo)\
**Post date:** [October 6, 2018, 11:28am UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/11 "2018-10-06T11:28:12Z")

</div>

Hi Jeremy,

It was that it didn’t have a size directive in the code when I copied and pasted it, but he doesn’t make it clear to do so.

Many thanks, Joe

---

<div class="post-metadata">

**Author:** ![random](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/random/32/16096_2.png) [@random](https://discourse.processing.org/u/random)\
**Post date:** [April 21, 2022, 2:35pm UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/12 "2022-04-21T14:35:08Z")

</div>

I have a similar problem. I define size canvas on processing 3 but it shows a huge canvas

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/7/2/72e1c5ac13d14377bdcea82a18a7cb64aa1224f3.png)

---

<div class="post-metadata">

**Author:** ![SomeOne](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/someone/32/8639_2.png) [@SomeOne](https://discourse.processing.org/u/SomeOne)\
**Post date:** [April 22, 2022, 4:16am UTC](https://discourse.processing.org/t/problems-with-canvas-size/4026/13 "2022-04-22T04:16:24Z")

</div>

size() definition must be in setup() otherwise it’s ignored.