Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
Start communicating ideas and diagramming data in a more interactive way. In this course, author Barton Poulson shows how to read, map, and illustrate data with Processing, an open-source drawing and development environment. On top of a solid introduction to Processing itself, this course investigates methods for obtaining and preparing data, designing for data visualization, and building an interactive experience out of a design. When your visualization is complete, explore the options for sharing your work, whether uploading it to specialized websites, embedding the visualizations in your own web pages, or even creating a desktop or Android app for your work.
In the last movie I showed you how to use the mouse to perform certain interactions with the sketch, by hovering and/or clicking on an object to get it to trigger some change in the attributes of that object. In this movie, I simply want to show you how to do the same thing with the keyboard. This one is almost identical to the previous one, so I'm actually using the last sketch as the starting point for this one, and I'm just going to make a few small changes. First I'm going to change that we're down to, we're on 03 instead. Then what I'm going to do is everything else stays the same, down to here, and what I'm going to do is change the hovering to click l key.
It's a lowercase l, not a 1. And then it's going to be clicking that key that produces the differences. Then I'm going to do the same thing here; it's going to be click the r key. Great! I can remove that aAnd then all I need to do for this circle, we're going to nest an if statement. First one I'm going to is I'm going to put here Detect if any key is pressed.
So that's going to be the first condition: Was there a key pressed? The way we do that is if (keyPressed). That's all you have to do on this one is because it just assumes if keyPressed is true, the true is assumed. And I'm just going to bump the rest of these things up because now they are nested in, and I find that the indenting makes it a lot easier to keep track of things.
And then I'm going to put the curly bracket that corresponds to the keyPressed. You see how when I typed it the curly bracket to the right of the keyPressed lit up? That's how you can keep track of what goes with it. So the first thing is whether any key was pressed, and then we're going to see whether it's the l key. And all we have to do is we take out this big statement right here. I'm going to delete all of that and the only thing we need is to know whether the key is equal to--please notice I have to do two equals; there's a difference. A single equals is an assignment indicator. So for instance, right beneath it says lf = palette(4); that can be read as it gets; the left fill gets or is gets to be this.
This one I'm asking to whether key is equivalent to, or whether it matches exactly--you have to use two equal signs for that. And then I'm going to look for a single character l. That's a char variable. It's a single character. So I have to put it in single quotes, 'l'. That's a lowercase l. Then what I do down here is a similar thing. All I want for this one is to know whether the key is equivalent to the lowercase r, and that's in quotes also.
And I can save that. I hit Ctrl+R to run on a PC or Command+R to run on a Mac. Now you see that hovering has no effect, and neither does clicking, because I've removed all of that code. However, if I type the l, you see that the left one changes. If I type an r, the right one changes, and if I type any other key, they both go back to what they were before. So if l, I'm doing the Spacebar, r space else r, and you can see that now I'm using the keyboard to change the appearance of these objects, and that is another major form of interaction in the sketches that we'll be using in Processing.
There are currently no FAQs about Interactive Data Visualization with Processing.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.