Last time we explored the Watson User Modeling service and all the personality data that it generates for you. In this post we are going to wire that all up in our app and also explore an additional method on the User Modeling service that takes all that data and creates a cool interactive chart like the one at right.
The visualize service is very simple. All it does is take the exact JSON response that was returned from our call to the profile service. There are also some additional parameters that can be passed on the request URL such as width, height and a profile image URL. The method returns the full source for displaying the interactive SVG chart you see on the right.
So how do we get to there? Well the first thing I did was refactor my ModelUser method – which originally was making the call to the Profile service and then deserializing the JSON response – into two separate methods:
GetModelUserJsonResponse now just makes the call to the Profile service and returns the JSON response. Now I can hang on to that JSON in my app for if and when I need it to call the Visualize service. ModelUser now just takes the JSON response and deserializes it into my UserModelingResponse.RootObject class.
To display the User Modeling data in my app, I didn’t do anything special, just some nested ListViews with increasing left margins to display some indent and visualize the nesting of each set of child data. Admittedly, it’s not very pretty, but it works for the sake of this demo.
Once you scroll all the way down to the bottom of this data, there is a “Visualize Modeling Data” which will let us – duh – view the visualization of the modeling data.
As I mentioned earlier the Watson User Modeling service’s Visualize method just takes in the JSON response from the Profile method – verbatim. You don’t need to do a thing to it. Here is my method for calling out to the service:
As you can see I’ve added width, height, and profileImageUrl parameters which get appended as querystring values to the service URL. I am using the LinqToTwitter library for retrieving a user’s tweets, and I am also able to grab their profile image URL from there as well.
All I need to do is return the HTML that the service generates for me. The visualize page in my app is just a full-screen WebView that I load up with that HTML. If you would like to see a sample of what the service returns, you can check out this GIST.
And if you haven’t already signup for your free IBM Bluemix account.