Converting JSON data into timeline format

782 views
Skip to first unread message

johntynan

unread,
Jul 15, 2008, 9:25:24 AM7/15/08
to SIMILE Widgets
Hi all,

I am looking to convert some data in one JSON data format into the
format expected by timeline.

You can see the progress of my work here:

http://johntynan.com/scripts/timeline/

Or, you can checkout the current code here:

http://svn.johntynan.com/timeline/trunk

of particular interest at the moment is the function timelineConverter

My end goal is to create a generic parser which will convert from the
new open api at NPR.org into timeline. The folks at NPR have offered
to host the script on their site, I'd like it to be something that can
be open enough and flexibile enough to be useful to the timeline
community as well.

I'm new to JSON, so any advice you might have is most welcome.

Thanks kindly,

John T.

johntynan

unread,
Jul 15, 2008, 6:27:10 PM7/15/08
to SIMILE Widgets
Hi all,

I've been working on this for most of the day and am now able to parse
the data from the remote json feed into a format that appears like it
will make sense to the timeline app (I left in an alert displaying the
data so people can view the newtimeline array).

http://johntynan.com/scripts/timeline/

Additionally, based on a comment I read here:

http://blog.jeromeparadis.com/archive/2007/06/28/SIMILE-Timeline-Manually-Adding-Events.aspx

I've also set up a function called loadNewTimeline and am trying to re-
load the timeline using the newly created JSON data into by way of the
line:

eventSource.addMany(newtimeline)

However, I am receiving the error message:

Error: event1.getStart is not a function
Source File: http://simile.mit.edu/timeline/api/bundle.js
Line: 1057

If anyone could tell me if there is an issue with the format of the
new data, the syntax for my code, or if this is indicative of a deeper
issue with the timeline javascript, that would be much appreciated.

Kind regards,

John T.

johntynan

unread,
Jul 17, 2008, 5:17:25 PM7/17/08
to SIMILE Widgets
Hi all,

I've gone through the example for manually adding events to a timeline
here:

http://blog.jeromeparadis.com/archive/2007/06/28/SIMILE-Timeline-Manually-Adding-Events.aspx

I'm able to run the sample code (with a handful of randomly generated
events) perfectly.

I'm also able to get JSON data from a remote feed and process it into
what I believe to be the correct format (below) using the function
eventSource.add(evt);:

{"_id":"e972253",
"_instant":true,
"_start":"Thu, 17 Jul 2008 16:00:00 -0400",
"_end":"Thu, 17 Jul 2008 16:00:00 -0400",
"_latestStart":"Thu, 17 Jul 2008 16:00:00 -0400",
"_earliestEnd":"Thu, 17 Jul 2008 16:00:00 -0400",
"_text":"'Dark Knight' Director Invests Years In Batman Film",
"_description":"Christopher Nolan brought the Batman franchise back to
life in 2005 with <em>Batman Begins</em>. Now the young director
returns with <em>The Dark Knight</em>. He talks about making the
movie and how he and the late Heath Ledger worked to create the
frighteningly menacing Joker.",
"_image":"http://npr.org/favicon.ico",
"_link":"http://www.npr.org/templates/story/story.php?
storyId=92612530&ft=3&f=1008",
"_icon":"http://npr.org/favicon.ico",
"_color":"green",
"_textColor":null,
"_wikiURL":"JSONcircRef:_textColor",
"_wikiSection":"JSONcircRef:_textColor"}

However, while the script runs without errors, nothing displays on the
timeline.

Any suggestions for how I might resolve or troubleshoot this issue is
much appreciated.

Thanks kindly,

John T.


On Jul 15, 3:27 pm, johntynan <jgty...@gmail.com> wrote:
> Hi all,
>
> I've been working on this for most of the day and am now able to parse
> the data from the remote json feed into a format that appears like it
> will make sense to the timeline app (I left in an alert displaying the
> data so people can view the newtimeline array).
>
> http://johntynan.com/scripts/timeline/
>
> Additionally, based on a comment I read here:
>
> http://blog.jeromeparadis.com/archive/2007/06/28/SIMILE-Timeline-Manu...

johntynan

unread,
Jul 19, 2008, 7:21:01 AM7/19/08
to SIMILE Widgets
I figured out why the entries were not displaying on the timeline.

The date string needs to be turned into a date object:

Date.parse(entries.story[x].storyDate.$text), //start

While far from complete, this is now working:

http://johntynan.com/scripts/timeline/

On Jul 17, 2:17 pm, johntynan <jgty...@gmail.com> wrote:
> Hi all,
>
> I've gone through the example for manually adding events to a timeline
> here:
>
> http://blog.jeromeparadis.com/archive/2007/06/28/SIMILE-Timeline-Manu...

David Huynh

unread,
Jul 21, 2008, 12:35:37 PM7/21/08
to simile-...@googlegroups.com
Hi John,

Thanks for these details!... By the way, don't hesitate to use the wiki
to dump these tips in there... That might be easier for other people to
look through than searching through the mail archive.

David

Reply all
Reply to author
Forward
0 new messages