Number Visualisation

General Discussion Other

danielbede

in General Discussion » Other • 1 year ago

Hi,

I want to make an endless division of a number by adding partial numbers each second the program runs.

e.g.

1 2

1 1.5 2

1 1.25 1.5 1.75 2

1 1.125 1.25 1.375 1.5 1.625 1.75 1.875 2

etc etc.

can anyone point me in the right direction for this?

Thanks

Dan

Replies(19)

tfguy44

Re: Number Visualisation

1 year ago

final float startNum = 1;
final float endNum = 2;
int lastTime;
float stepSize;
void setup(){
size(200,200);
lastTime = millis();
stepSize = endNum - startNum;
}
void draw(){
if( millis() - lastTime > 1000 ){
String result = "";
for( float j = startNum; j <=endNum; j+=stepSize ){
result = result + j + " ";
}
println( result );
lastTime = millis();
stepSize/=2;
}
}

danielbede

Re: Number Visualisation

1 year ago

Thanks so much.

I'm sorry but I'm completely new.

How do I display this as text in the app window?

I want the next line in the process to replace the one before it... with the Line taking up the entire screen... the font size adjusting to the amount of numbers..... until eventually the numbers fill the whole page at such a small font size that whoever watching would simply be overwhelmed.

Thanks tfguy44 for being so helpful.

PhiLho

Re: Number Visualisation

1 year ago

text() and the related functions seen beside it in the Reference is what you look for.

danielbede

Re: Number Visualisation

1 year ago

I just can't work out how to get the new result to show

PFont font;

font = loadFont("ACaslonPro-Regular-48.vlw");

textFont(font);

text(--what do i type here??---, 15, 20, 70, 70);

danielbede

Re: Number Visualisation

1 year ago

do i have to convert the result to nf()?

when I try to use "result" It only displays 1.0 and then nothing else.

calsign

Re: Number Visualisation

1 year ago

Problem:

That's because that's all it has room to display.
Expand the text box as so:

text(result, 15, 20, 140, 70);

(140 instead of 70)
and you see that more text is being drawn to the right...

The first step to fix this problem is to redraw the background each frame.
See background().
So, that would be:

background(0);

or something of the sort as the first line of draw().

Next, you'll probably want to decrease the font size so that you can fit everything on the screen...
See textSize()...
For example, when you initialize the font:

textSize(12);

This will make the font four times smaller than what you had before...

You should now have something that works.

Notes:

Make sure that you initialize the font in setup() (not every frame).
This is a common error...

Final Code:

With some modifications to make it... more aesthetically pleasing...
The modifications appear in the comments.

final float startNum = 1;
final float endNum = 2;
int lastTime;
float stepSize;
//Added the output String, which stores the ouput
String output = "";
//The font declaration
PFont font;
void setup() {
//Increase the size of the frame
size(400, 400);
lastTime = millis();
stepSize = endNum - startNum;
//Initialize the font
font = loadFont("ACaslonPro-Regular-48.vlw");
textFont(font);
//Set the size to be 12
textSize(12);
}
void draw() {
//Redraw the background
background(0);
//Because we are redrawing the background, we also have to redraw the text every frame
//Also, make the text box bigger
text(output, 15, 20, width - 15, height - 20);
if (millis() - lastTime > 1000) {
String result = "";
for (float j = startNum; j <= endNum; j += stepSize) {
result = result + j + " ";
}
//Assign the output to be the result
output = result;
lastTime = millis();
stepSize /= 2;
}
}

danielbede

Re: Number Visualisation

1 year ago

awesome I can play with the rest now. Thanks so much.

Just one last question though, Is it possible to have the text to adjust automatically to the size of the box so that it always fits the numbers in????

Thanks!

calsign

Re: Number Visualisation

1 year ago

I'm assuming that you want to scale the text size based on the length of the text...
Doing something like that is more complicated than it may seem.

I don't exactly have time to write it, but here's the general idea:

You would need to find the width of the text, using textWidth()...
Then set the text size to be the ratio between the text width and the size of one character at on particular size...

Sorry if that's confusing...
I've written it before, going to have to try to find it...

danielbede

Re: Number Visualisation

1 year ago

the width of the character? how do i find that out?

danielbede

Re: Number Visualisation

1 year ago

kk i'll give it a try. thanks cal sign.

If you find it too that would also be sweet. :)

danielbede

Re: Number Visualisation

1 year ago

ok I got the text width to display in the console by creating :

float C = textWidth(output);

println( C );

do i need to put another instance of text size after this? does It needs to have an original text size to begin with?

danielbede

Re: Number Visualisation

1 year ago

I need the first font size to be a constant so i can work off it. do you know?

Chrisir

Re: Number Visualisation

1 year ago

Maybe

text(output,15,20);

is enough - thus the text is shown

but without a box.

danielbede

Re: Number Visualisation

1 year ago

the text eventually gets bigger than the screen, I need it to gradually get smaller.

I've tried textSize = (textSize/2); but it said it doesn't recognise text size

and also float N = pow(1.5,output); but it said output is a float but I thought it was a string..

either of these should at least make the text each smaller, what am i doing wrong??

Thanks guys

calsign

Re: Number Visualisation

1 year ago

The first problem that you're having has to do with the fact that you aren't properly using functions...

For example, it's

textSize(variables)

, not

textSize = variables

. For the second part, can you show us more of your code?

danielbede

Re: Number Visualisation

1 year ago

sorry its a bit messy

final float startNum = 1;

final float endNum = 2;

int lastTime;

float stepSize;

//Added the output String, which stores the ouput

String output = "";

//The font declaration

PFont font;

void setup() {

//Increase the size of the frame

size(1024, 720);

lastTime = millis();

stepSize = endNum - startNum;

//Initialize the font

font = loadFont("ACaslonPro-Regular-48.vlw");

textFont(font);

//Set the size to be 12

textSize(12);

}

void draw() {

//Redraw the background

background(76);

//Because we are redrawing the background, we also have to redraw the text every frame

//Also, make the text box bigger

text(output, 15, 20, width - 15, height - 20);

if (millis() - lastTime > 1000) {

String result = "";

for (float j = startNum; j <= endNum; j += stepSize) {

result = result + j + " ";

}

//Assign the output to be the result

output = result;

float C = textWidth(output);

// float N = pow(1.5,output);

//textSize(300/N)

// textSize(textSize/2);

// float D = textAscent(output)+textDescent(output);

lastTime = millis();

stepSize /= 2;

println( C );

}

Even if the font size just gets smaller by half of the previous until it gets to like 0.5 font, the majority of the text would stay on the page.

danielbede

Re: Number Visualisation

1 year ago

what variable can i put in font size that makes the size decrease by half each entry?

danielbede

Re: Number Visualisation

1 year ago

I think I got it..

final float startNum = 1;

final float endNum = 2;

int lastTime;

float stepSize;

//Added the output String, which stores the ouput

String output = "";

float J = 500;

//The font declaration

PFont font;

void setup() {

//Increase the size of the frame

size(1600, 800);

lastTime = millis();

stepSize = endNum - startNum;

//Initialize the font

font = loadFont("ACaslonPro-Regular-48.vlw");

textFont(font);

//Set the size to be 12

textSize(J);

}

void draw() {

//Redraw the background

background(76);

//Because we are redrawing the background, we also have to redraw the text every frame

//Also, make the text box bigger

text(output, 15, 20, width - 15, height - 20);

if (millis() - lastTime > 1000) {

String result = "";

for (float j = startNum; j <= endNum; j += stepSize) {

result = result + j + " ";

}

//Assign the output to be the result

output = result;

float C = textWidth(output);

// float N = pow(1.5,output);

textSize(J/2);

//if (C >50000){

J = J*.8;

//textSize(textSize/2);

//}

//textSize(C/2);

// float D = textAscent(output)+textDescent(output);

lastTime = millis();

stepSize /= 2;

println( C );

}

Thanks for your help guys

PhiLho

Re: Number Visualisation

1 year ago

Good sketch. Perhaps you can get a better result with a font not converted to vlw (which is bitmap):
font = createFont("Tahoma", 48); // Use a font of your system

Top Reply

Response title

Attachments

New to this Portal?