Playing with text() and pixels

 Two excellent examples using text, the first takes a picture and a text on top, and makes the letters bigger where the picture is brigther, a fine start for more experiments:

http://www.learningprocessing.com/exercises/chapter-17/exercise-17-7/

The second example is using textWidth:

x += textWidth(message.charAt(i));


So you can get the pixelNumber where your letter starts. In this way you can use letters of different sizes in the same bit of text.

Input textfield, sliders, buttons etc

Well for these fancy objects, which are not easy to program from scratch, you can use this library:

http://www.sojamo.de/libraries/controlP5/

Example code:

http://www.openprocessing.org/visuals/?visualID=20726

as usual download the library, unzip, and pu this folder in the folder libraries inside the Processing folder with your sketches. In this folder there are lots of examples, buttons sliders....

Searching......

Just a few downloads to wonder about all the data floating around....

http://www.contrechoc.com/crosslab/dataBaseStuff.zip

with and extra example adding to the last post ( database_patterns_6.pde )

with examples searching the NYT, Google and Twitter

for the nyt API you need your own key, and insert it into this line:
TimesEngine.init(this,"get your own API key"); // http://developer.nytimes.com/
this line of code becomes something like:

TimesEngine.init(this,"87238269346827638476283764827638476287364872638576"); //fake key!

as indicated in the script, you can get your key here: http://developer.nytimes.com/

also, the right libraries are added (JSON). You have to put these libraries in the folder libraries inside the Processing folder containing your sketches.

And then a few links:


http://searchenginewatch.com/article/2066257/What-People-Search-For-Most-Popular-Keywords

Or search for: youtube professor Hans Rosling.....
http://www.youtube.com/watch?v=YpKbO6O3O3M&feature=relmfu

http://lowfrequency.org/interactivity/wiki/index.php?title=Google_API_In_Processing

The google Image API is also not too difficult and can be exciting for designers:
http://lowfrequency.org/interactivity/wiki/index.php?title=GoogleJSONSearchDrawImage
You need the JSON library, but when you have the nyt examples (above) running, this library is included.

This link gives an example with 1 image, but displaying 4 images can be done like this:

in the declarations, instead of one image take an array

PImage myImg[] = new PImage[4];


in setup() load for images:

for(int i=0; i<4 ; i++){ myResult = getFirstSearchResult("bullet cluster",i); PImage getImage = new PImage(); getImage = loadImage(myResult); println( "------------>"+ str(i) + " " + myResult );
myImg[i] = getImage;
}


this to add in the draw:


for(int i=0; i<2 ; i++) for(int j=0; j<2 ; j++){ iCounter++; image(myImg[iCounter], i*width/2, j*height/2, width/2, height/2); }

and this works with a minor change in the function:

String getFirstSearchResult(String query, int imageNumber)
{


this leaves one line in this function to get more than result one:


URL url = new URL(baseURL + "?start="+str(imageNumber)+"&rsz=large&v=1.0&q=" + query);


You can find this script in this download:

http://www.contrechoc.com/crosslab/dataBaseStuff.zip

four images of the search for "bullet cluster"




















All about the Google API's can be found here:
http://code.google.com/apis/maps/index.html

A few Processing Examples

Here you can find some simple examples: http://www.contrechoc.com/crosslab/databaseSamples.zip
have fun!

Basically these examples build from simple text on a screen, color changing, to text and image, interactively displayed (on mouseDrag and mousePressed);