Interactive Data Visualization with Processing
Illustration by Neil Webb

Reading XML data


Interactive Data Visualization with Processing

with Barton Poulson

Start your free trial now, and begin learning software, business and creative skills—anytime, anywhere—with video instruction from recognized industry experts.

Start Your Free Trial Now

Video: Reading XML data

One of the most exciting things you can do with Processing is to be able to access live web data. You can get information from all around the Internet, all around the world, constantly update it, and bring it into your computer and use that for your own data analysis, for your own sketch work, for your own exploration. And the way that you can do this in Processing is using XML, that's Extensible Markup Language, and combining that with an API, an application program interface, that allows your computer to talk with the web servers to get the data.
Expand all | Collapse all
  1. 3m 16s
    1. Welcome
    2. What you should know
      1m 22s
    3. Using the exercise files
  2. 11m 51s
    1. Overview of data visualization
      11m 51s
  3. 11m 53s
    1. Installing Processing
      3m 38s
    2. Overview of Processing
      4m 5s
    3. Exploring libraries
      4m 10s
  4. 1h 1m
    1. Basic setup
      7m 31s
    2. Drawing points
      4m 37s
    3. Drawing lines
      5m 6s
    4. Drawing ellipses and circles
      5m 24s
    5. Drawing arcs
      6m 54s
    6. Drawing rectangles and squares
      4m 58s
    7. Drawing quadrangles
      3m 25s
    8. Drawing triangles
      2m 55s
    9. Drawing polygons
      3m 37s
    10. Drawing simple curves
      4m 54s
    11. Drawing complex curves
      6m 46s
    12. Drawing Bézier curves
      5m 38s
  5. 54m 3s
    1. Introduction to variables
      10m 44s
    2. Understanding variable scope
      6m 53s
    3. Modifying variables
      9m 8s
    4. Creating arrays
      9m 53s
    5. Modifying arrays
      6m 37s
    6. Creating strings
      7m 3s
    7. Modifying strings
      3m 45s
  6. 1h 2m
    1. Incorporating randomness
      7m 59s
    2. Using Perlin noise
      4m 24s
    3. Shuffling with Java
      3m 30s
    4. Specifying line attributes
      8m 2s
    5. Changing placement modes
      5m 45s
    6. Understanding color attributes and functions
      4m 16s
    7. Exploring color spaces
      7m 44s
    8. Using color palettes
      7m 5s
    9. Transforming the grid
      8m 38s
    10. Exploring the attribute matrix
      5m 33s
  7. 52m 7s
    1. Building code blocks
      5m 57s
    2. Writing a while loop
      3m 52s
    3. Using for loops
      5m 35s
    4. Creating conditionals
      14m 50s
    5. Working with easing
      10m 51s
    6. Creating spirals
      11m 2s
  8. 18m 55s
    1. Mouse tracking
      3m 54s
    2. Hovering and clicking
      11m 16s
    3. Understanding keyboard interaction
      3m 45s
  9. 27m 32s
    1. Specifying fonts
      6m 43s
    2. Using images
      5m 51s
    3. Playing a video loop
      6m 20s
    4. Exporting video
      3m 47s
    5. Adding sound
      4m 51s
  10. 20m 49s
    1. Creating functions
      11m 48s
    2. Creating classes and objects
      9m 1s
  11. 31m 10s
    1. Using embedded data
      5m 26s
    2. Working with appended text data
      6m 4s
    3. Working with appended tabular data
      10m 26s
    4. Reading XML data
      9m 14s
  12. 48m 15s
    1. Generating dot plots
      11m 11s
    2. Building scatter plots
      10m 0s
    3. Making line plots
      9m 53s
    4. Creating bar charts
      9m 12s
    5. Checking out examples of maps, hierarchies, and networks
      7m 59s
  13. 20m 57s
    1. Introducing some principles of 2D design
      13m 44s
    2. Understanding color theory
      7m 13s
  14. 24m 46s
    1. Interacting with zooming, rotating, and sliding
      6m 26s
    2. Implementing slicing
      6m 47s
    3. Using rollovers
      5m 58s
    4. Introducing the GUI libraries
      5m 35s
  15. 10m 35s
    1. Sharing via OpenProcessing and other sites
      3m 19s
    2. Saving as a desktop application
      2m 42s
    3. Saving as JavaScript
      1m 47s
    4. Saving as an Android application
      2m 47s
  16. 2m 38s
    1. Where to go from here
      2m 38s

please wait ...
Watch the Online Video Course Interactive Data Visualization with Processing
7h 43m Beginner Sep 25, 2012

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.

Topics include:
  • Exploring the need for creative data visualization
  • Drawing basic lines and shapes
  • Introducing variables, strings, and arrays
  • Modifying drawing attributes such as color
  • Making drawings more dynamic with animation loops and spirals
  • Creating keyboard- and mouse-based interactions
  • Adding images, video, and sound
  • Reading in text or XML data
  • Creating plots and charts
  • Publishing and sharing your work
Developer IT
Barton Poulson

Reading XML data

One of the most exciting things you can do with Processing is to be able to access live web data. You can get information from all around the Internet, all around the world, constantly update it, and bring it into your computer and use that for your own data analysis, for your own sketch work, for your own exploration. And the way that you can do this in Processing is using XML, that's Extensible Markup Language, and combining that with an API, an application program interface, that allows your computer to talk with the web servers to get the data.

Between the two of those, you can get this information into Processing, and that opens up a whole new world, literally, of data for you to work with in your own projects. Now what I'm going to show to you in this one is a very, very simple version here. I want to show you this one web page, a wonderful project that was created in Processing called We Feel Fine. It's at, and this is a project that was created by a couple of researchers, Jonathan Harris and Sep Kamvar, not that we really need to see those guys.

And I just want to show a little bit about the methodology, what this does. We feel fine collects data around the Internet, from a wide variety of places, about phrases that talk about feeling or feel, and it brings them in and depicts them in several different ways. I just wanted to show down here, as we get to this, that the application that we're going to be using was created in Processing. So this is an example of the kind of extraordinary data visualizations that you can create in Processing once you get the data in there together.

Now, the nice thing about this project, if I back up to the front page, is you see here at the bottom of the pink list, they actually have the information on their API, with a beautiful quote from Pablo Picasso: "Bad artists copy and great artists steal." Put that up on your wall and live by that one. And what we have here is information about how the API works. Basically, it's a kind of web address, a kind of URL that starts with this phrase up here, and then you can add onto it attributes for other kinds of information you want, and they give all sorts of examples right here.

Now we've already got a sketch with an edited API call init. We're going to go to that in one second, but I do want you to have just an idea of what We Feel Fine actually looks like. So I'm going to take a second and launch this one. It opens up in a separate window, and it takes a moment to get there. And what we have is an explosion of data from around the web, and these all represent blog posts or other Internet data where people have mentioned feelings. If I come out here and click on one: "the Sheffield house is going to feel the love." Click in a blank space and you can make this poof, out-explode.

And there are several different things you can do. You can check for particular feelings. You can check for feelings for men and women, their age, their weather, their location, the country, city, the date, and also different ways of depicting it, of a montage. There we go, the mobs, and so many others. This is just an amazing collection of way of depicting information and for me, as a social psychologist, it's sort of the jackpot of people's uncensored feelings and reactions.

Anyhow, I want to show you how to get a little bit of data out of this, into Processing, which would serve as a starting point for your own data visualization explorations. So what I'm going to do is I'm going to come back to the sketch for just a moment and show you what we have here. I should put my comment up here. The very first thing we have is that we need to import a library for Processing called ProXML. That's a way of accessing this kind of information. It's available for Processing, but it's not available from within the program.

What you have to do is go to the Processing website. So we are going to go back to the web for a moment. I'm going to go to this tab, Processing, and you go to Reference, to Libraries and then we scoot down just a little bit, and then you go, then right here it says Data and Protocols on the left. And then one we're looking for is down here, near the bottom. It's called proXML. It allows Processing to read and write XML files.

So I'm going to click on that, and from there, it brings me to a web page that also serves as the reference for this library. So if you want to find out about how the bits and pieces of it work, count all children, there's your information right there. I'm going to back up, and at the bottom of this page it says You click on that and download it to your computer, and there it is. And now what you need to do is just take that and drag it over to your libraries folder in Processing.

And once you drag it over there, you need to go quit Processing and restart. Now I've already done this and already installed it, so I'm not going to do that, but that is the procedure that you would use. So I'm going to close this now. And I'll close this page as well. At, but it's linked directly from the Processing page right here. So I can close the both of these.

And then let me explain what's going on in here. So the first we do is we're loading the library. This loads the proxml library, which allows Processing to access this XML information. The second step is we're using the XML InOut class and creating an XML InOut object. By the way, notice the difference in capitalization. Classes have capital letters-- they start with capitals--but objects start with lowercase, and that's one of the ways you can tell the difference between the two of these. Then we have our setup.

We have a window that's 600 x 200, although that's actually irrelevant because the stuff we're going to be looking for is going to show up in the console, the black area at the bottom. Then we have an instantiation of our object. It says xmlInOut = new, and then class name, because you see the capital letters, of XMLInOut, with this referring back to the most recently created object. And then we have what's called the load element method. You see that it says xmlInOut--that's the object--and then the .loadElement for the method.

And then we have this URL, and that's the actual thing that we're going to be using to get the information. In fact, you can see that it says api, right there at the beginning. In terms of api, this is a very brief one, but we're using this to simply show you what is possible. And in fact, if you want to see it, you can copy this code. I'm just going to copy that. And I've managed to quit Firefox already, so I'm going to open that back up. And then I'm going to paste it up here. And a funny thing happens when you hit it and it opens up a blank page, but in Firefox here, if I right-click on the page and go to View Page Source, this is the information that we're going to be pulling into Processing.

And what it is is you see that we have, on the left, it's pulling the feelings and then you see we have the actual feeling that the people have. We have the post date, when they put it up there, and we have the sentence that contains the feeling information. I'm going to close that, close that, and come back here to Processing. Then what we do is we come down and we have an xmlEvent, and that's where it's going to go through the APIs information one line at a time.

That's the element.countChildren. And we're going to get two things printed out of that. The first one is it's going to do what's called getting the children, and it's going to print out the post date: When did the people actually put this information up on the web? The next thing we're going to do is we're going to print the actual sentence that they wrote. You'll see there, at the beginning of the second print line, in quotes, there's a backslash and a t. That is the Tab command, and I am just going to indent this second line element a little bit to make it easier to read.

So this is all ready to go. I'm just going to come up and press Run. I get my empty window. Don't worry about that. It's this one that we're interested in, down here. And you see that when we scroll through, there are the 50 entries that it pulled for us. I'm feeling excited and generous. I feel so grateful. these are wonderful things. And so the point here is is that Processing by using XML and the We Feel Fine API has been able to go onto the web and pull this information from a live Internet data source and bring it into Processing.

This is simply the first step of what really has immense potential for your own work, that you can then take this data and start using it in your own data visualization and your own creative work.

There are currently no FAQs about Interactive Data Visualization with Processing.

Share a link to this course

What are exercise files?

Exercise files are the same files the author uses in the course. Save time by downloading the author's files instead of setting up your own files, and learn by following along with the instructor.

Can I take this course without the exercise files?

Yes! If you decide you would like the exercise files later, you can upgrade to a premium account any time.

Become a member Download sample files See plans and pricing

Please wait... please wait ...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.

Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ .

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

* Estimated file size

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.

Mark all as unwatched Cancel


You have completed Interactive Data Visualization with Processing.

Return to your organization's learning portal to continue training, or close this page.

Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member ?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any page and choose Site preferences from the dropdown menu.

Continue to classic layout Stay on new layout
Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

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.

Learn more, save more. Upgrade today!

Get our Annual Premium Membership at our best savings yet.

Upgrade to our Annual Premium Membership today and get even more value from your subscription:

“In a way, I feel like you are rooting for me. Like you are really invested in my experience, and want me to get as much out of these courses as possible this is the best place to start on your journey to learning new material.”— Nadine H.

Thanks for signing up.

We’ll send you a confirmation email shortly.

Sign up and receive emails about and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from

Sign up and receive emails about and our online training library:

Here’s our privacy policy with more details about how we handle your information.

submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.