# How to draw real-time data in a specific canvas area？

**URL:** <https://discourse.processing.org/t/how-to-draw-real-time-data-in-a-specific-canvas-area/45631>\
**Category:** Electronics (Arduino, etc.)\
**Created:** [January 22, 2025, 1:11pm UTC](https://discourse.processing.org/t/how-to-draw-real-time-data-in-a-specific-canvas-area/45631 "2025-01-22T13:11:28Z")\
**Posts on this page:** 1\
**Showing post:** 19

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [January 23, 2025, 7:28pm UTC](https://discourse.processing.org/t/how-to-draw-real-time-data-in-a-specific-canvas-area/45631/19 "2025-01-23T19:28:17Z")

</div>

> [@svan](#):
>
> But if I ever see a problem in Processing’s **serialEvent()** after adding a carriage return I could be convinced to change.

We can completely drop the `','`& `'\n'` separator characters and just use the [**buffer()**](https://processing.org/reference/libraries/serial/Serial_buffer_.html) method:

> [@Using two different readStringUntil "characters"](https://discourse.processing.org/t/using-two-different-readstringuntil-characters/10769/23):
>
> Now that it seems all’s been sorted out, how about some optimization? The range [-10 to 10] is so small (5-bit) that it comfortably fits in a byte (8-bit). So, rather than send those 2 small values as TSV, w/ lotsa extra separator characters, we can simply send 2 bytes only using Serial.write(): [https://www.Arduino.cc/reference/en/language/functions/communication/serial/write/](https://www.Arduino.cc/reference/en/language/functions/communication/serial/write/) We just need to create a char array of length = 2: signed char xy[2]; #define BAUDS 115200 #define DELAY 10 #define…

---

_[View the full topic](https://discourse.processing.org/t/how-to-draw-real-time-data-in-a-specific-canvas-area/45631)._