# Text inaccuracies in P2D/P3D mode
**URL:** https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634
**Category:** Processing
**Created:** [January 15, 2022, 5:11am UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634 "2022-01-15T05:11:54Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@macwarrior](https://discourse.processing.org/u/macwarrior)
#### Post date: [January 15, 2022, 5:11am UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/1 "2022-01-15T05:11:54Z")
I have been working on a project that involves a lot of text handling, and I’ve recently started trying to add some 3D rotations and transformations to some of the graphics. However, when I switch to the P3D renderer, the text comes out distorted and ugly.
Here is the default software renderer:
[ ](https://i.imgur.com/kgXMSkL.png)
Here I’ve used the P3D renderer to transform the grid in 3D, and it also changes the look of the text pretty dramatically:
[ ](https://i.imgur.com/7yysqet.png)
(it may help to click through and view these at actual size.)
The baseline is no longer consistent (especially comparing rounded letters like C and O to square ones like T), and there are noticeable artifacts in the small font. In all cases I am using createFont() in setup with a specific size, not adjusting it afterwards with textSize(). I’ve chosen a font that exaggerates the effect, but there are shifts and distortions with every font I use.
I know that there are always going to be some pixel-scale differences between rendering in the default renderer and P3D. But since typography is so sensitive to this stuff, are there any ways to minimize the font glitches that occur? Alternately, is there a way to use the default rendering engine on top of the 3D canvas, so I can have nice clean text regardless of what’s going on underneath?
Thanks.
---
### Author:  [@hamoid](https://discourse.processing.org/u/hamoid)
#### Post date: [January 15, 2022, 10:29am UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/2 "2022-01-15T10:29:15Z")
Hi hi 🙂
Does calling `smooth(8)` make any difference?
Here a way to combine P3D and JAVA2D:
```auto
PGraphics textLayer;
void settings() {
size(640, 480, P3D);
smooth(8);
}
void setup() {
textLayer = createGraphics(width, height, JAVA2D);
textLayer.beginDraw();
textLayer.textAlign(CENTER, CENTER);
textLayer.textSize(60);
textLayer.fill(#FF0000);
textLayer.text("nudiustertian", width/2, height/2);
textLayer.endDraw();
}
void draw() {
background(0);
pushMatrix();
translate(width/2, height/2);
rotateY(millis() * 0.001);
rotateX(millis() * 0.0001);
box(200);
popMatrix();
hint(DISABLE_DEPTH_TEST);
image(textLayer, 0, 0);
hint(ENABLE_DEPTH_TEST);
}
```
---
### Author:  [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [January 15, 2022, 10:45am UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/3 "2022-01-15T10:45:36Z")
In 3D I always use textMode(SHAPE);
for a 2D HUD inside 3D see #9 here [25 life saving tips for processing (blogpost) - Processing Forum](https://forum.processing.org/one/topic/25-life-saving-tips-for-processing-blogpost.html)
**Remark**
also, for 3D I use lights(); and a function to avoid clipping
---
### Author:  [@macwarrior](https://discourse.processing.org/u/macwarrior)
#### Post date: [January 16, 2022, 9:16pm UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/4 "2022-01-16T21:16:24Z")
Thank you! This is a big help, and works perfectly.
Now the only annoying part is that most of my project is 2D graphics, with only a few small 3D aspects, and apparently I can only run a JAVA2D PGraphics on top of a P3D sketch – not the other way around. So now I have to go through and change every single line of my program, except for the handful of 3D transformations, to textlayer.something 😑
---
### Author:  [@glv](https://discourse.processing.org/u/glv)
#### Post date: [January 16, 2022, 10:19pm UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/5 "2022-01-16T22:19:45Z")
Hello,
Keep at it!
I just played with the code @hamoid provided:
```auto
boolean toggle;
void settings()
{
size(600, 600, P3D);
//smooth(8);
}
void setup()
{
textAlign(CENTER, CENTER);
textSize(100);
}
void draw() {
background(0);
translate(width/2, height/2);
pushMatrix();
//translate(width/2, height/2);
rotateY(frameCount * TAU/360);
rotateX(frameCount * TAU/360);
fill(128);
box(200);
popMatrix();
//At end of draw();
if(toggle)
{
//textMode(SHAPE);
hint(DISABLE_DEPTH_TEST);
fill(#FF0000);
rotate(45*TAU/360);
text("nudiustertian", 0, 0);
hint(ENABLE_DEPTH_TEST);
}
else
{
// This seems to work also.
// I found this in my notes...
ortho();
fill(#FF0000);
rotate(-45*TAU/360);
text("nudiustertian", 0, 0);
perspective();
}
}
void keyPressed()
{
toggle = !toggle;
}
```
`:)`
---
### Author:  [@jafal](https://discourse.processing.org/u/jafal)
#### Post date: [January 17, 2022, 5:03am UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/6 "2022-01-17T05:03:18Z")
> [@Some Movies I made](https://discourse.processing.org/t/some-movies-i-made/13306/23):
>
> Architecture showing a floor plan in 3D It features a house for 2 persons (and guests) with a Loft like atmosphere. [[Architecture] ](https://www.youtube.com/watch?v=AaB51WEhTiw) Water Pool in Living Room I Pool Billard Table in Living Room II
---
### Author:  [@glv](https://discourse.processing.org/u/glv)
#### Post date: [January 17, 2022, 3:53pm UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/7 "2022-01-17T15:53:35Z")
Hello @macwarrior,
Are you using a mac?
Can you provide a few lines of code (an [MCVE](https://stackoverflow.com/help/minimal-reproducible-example)) to reproduce your original issue?
I am just curious and want to try it on my W10 PC.
`:)`
---
### Author:  [@macwarrior](https://discourse.processing.org/u/macwarrior)
#### Post date: [January 18, 2022, 12:35am UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/8 "2022-01-18T00:35:22Z")
I am using Windows 10 as well. The name is an old one I’ve been using since the 1990s 🙂
However, here’s a cut down version of what I used to make the example screenshots.
The font is freely available at [VCR OSD Mono Font | dafont.com](https://www.dafont.com/vcr-osd-mono.font)
```auto
PFont small, smaller;
color bg = #000000;
color fg = #ff0000;
void setup() {
size(800, 480);
//size(800, 480, P2D);
//size(800, 480, P3D);
hint(ENABLE_STROKE_PERSPECTIVE);
small = createFont("VCR_OSD_MONO_1.001.ttf", 30);
smaller = createFont("VCR_OSD_MONO_1.001.ttf", 24);
}
void draw() {
background(bg);
stroke(fg);
strokeWeight(2);
pushMatrix();
translate(width/2, height/2);
rotateX(radians(75));
rotateY(radians(mouseX/4));
for (int i = -10; i < 10; i++) {
line(i*50, 0, i*50, 500);
}
for (int i = 0; i < 10; i++) {
line(-400, i*50, 400, i*50);
}
line(-400, 0, 400, 0);
popMatrix();
noStroke();
fill(#FFFFFF);
textAlign(CENTER);
textFont(small);
text("AUTOMATIC CUCKOO CLOCK 01234567890", width/2, 100);
textFont(smaller);
text("AUTOMATIC CUCKOO CLOCK 01234567890", width/2, 130);
}
void keyPressed() {
saveFrame();
}
```
---
### Author:  [@glv](https://discourse.processing.org/u/glv)
#### Post date: [January 18, 2022, 11:53am UTC](https://discourse.processing.org/t/text-inaccuracies-in-p2d-p3d-mode/34634/9 "2022-01-18T11:53:33Z")
Hell @macwarrior,
I was curious and wanted to compare outputs:
```auto
PFont small, smaller;
PGraphics pg;
boolean tog1, tog2;
color bg, fg;
void settings()
{
//size(800, 480);
//size(800, 480, P2D);
size(800, 480, P3D);
//noSmooth();
//smooth(2);
}
void setup()
{
small = createFont("VCR_OSD_MONO_1.001.ttf", 30);
smaller = createFont("VCR_OSD_MONO_1.001.ttf", 24);
pg = createGraphics(width, 200); //Could also try P2D and P3D here
if (tog1)
{
bg = color(0);
fg = color(255);
}
else
{
bg = color(255);
fg = color(0);
}
pg.beginDraw();
pg.fill(fg);
pg.textAlign(CENTER);
pg.textFont(small);
pg.text("AUTOMATIC CUCKOO CLOCK 01234567890", width/2, 100, 0);
pg.textFont(smaller);
pg.text("AUTOMATIC CUCKOO CLOCK 01234567890", width/2, 130, 0);
pg.endDraw();
println(frameCount);
}
void draw()
{
background(bg);
//if(frameCount%60 ==0) println(frameCount);
stroke(fg);
line(mouseX, 0, mouseX, height);
noStroke();
fill(fg);
textAlign(CENTER);
textFont(small);
text("AUTOMATIC CUCKOO CLOCK 01234567890", width/2, 100, 0);
textFont(smaller);
text("AUTOMATIC CUCKOO CLOCK 01234567890", width/2, 130, 0);
textMode(SHAPE);
fill(fg);
textAlign(CENTER);
textFont(small);
text("AUTOMATIC CUCKOO CLOCK 01234567890", width/2, 200, 0);
textFont(smaller);
text("AUTOMATIC CUCKOO CLOCK 01234567890", width/2, 230, 0);
textMode(MODEL);
image(pg, 0, 200);
}
void keyPressed()
{
tog1 = !tog1;
frameCount = 0;
setup();
}
```
You can toggle the background\foreground color and there is a line that moves with the mouse.
`noSmooth()` needs to be set in settings() in my example; it will end up there in the end when you run it. See references for details.
`smooth()` has different defaults depending on the renderer used:
[https://processing.org/reference/smooth\_.html](https://processing.org/reference/smooth_.html)
There are more combinations to try… my exploration ends here for now.
`:)`