Hi Eric, Unfortunately I didn't find any demos specifically about this online. But...
I have a basic Java servlet reading live data from a data base and responding with JSON data. The book on Java on AJAX I'm using is available here: (it's an pretty good book, not the best, but precisely what I wanted) http://oreilly.com/catalog/9780596101879/ There are some free examples you can download here: http://examples.oreilly.com/9780596101879/ Once you get the Java responding to your requests with timeline event JSON data (I won't go into that bit here - off topic) Use the following code to refresh the Timeline... function refreshTimeline() { // get all your query data here using document.getElementById("some_id"); var url = "/webapp_path/servlet_name?param1=" + param1 + '¶m2=' + param2 + .... if (window.XMLHttpRequest) { changeSelReq = new XMLHttpRequest(); } else if (window.ActiveXObject) { changeSelReq = new ActiveXObject("Microsoft.XMLHTTP"); } changeSelReq.open("Get", url, true); changeSelReq.onreadystatechange = refreshTimelineCallback; changeSelReq.send(null); } function refreshTimelineCallback() { if (changeSelReq.readyState==4) { if (changeSelReq.status == 200) { // alert ( changeSelReq.responseText ); var events = eval('(' + changeSelReq.responseText + ')'); recreateTimeline(events); } } } function recreateTimeline(events) { var theme = Timeline.ClassicTheme.create(); theme.autoWidth = true; theme.event.mouseWheel = "Zoom"; // Set your theme start and end dates here var eventSource = new Timeline.DefaultEventSource(0); var bandInfos = [ Timeline.createBandInfo({ width: 420, timeZone: 11, intervalUnit: Timeline.DateTime.DAY, intervalPixels: 50, eventSource: eventSource, date: new Date(), layout: 'original', // original, overview, detailed zoomIndex: 0, zoomSteps: new Array( {pixelsPerInterval: 50, unit: Timeline.DateTime.DAY}, {pixelsPerInterval: 400, unit: Timeline.DateTime.MONTH}, {pixelsPerInterval: 200, unit: Timeline.DateTime.MONTH}, {pixelsPerInterval: 100, unit: Timeline.DateTime.MONTH} ), theme: theme }), Timeline.createBandInfo({ width: 60, timeZone: 11, intervalUnit: Timeline.DateTime.MONTH, intervalPixels: 300, eventSource: eventSource, layout: 'overview', theme: theme }), Timeline.createBandInfo({ width: 60, timeZone: 11, intervalUnit: Timeline.DateTime.YEAR, intervalPixels: 600, eventSource: eventSource, layout: 'overview', theme: theme }) ]; } bandInfos[1].syncWith = 0; bandInfos[1].highlight = true; bandInfos[2].syncWith = 0; bandInfos[3].highlight = true; tl = Timeline.create(document.getElementById("TIMELINE"), bandInfos, Timeline.HORIZONAL); eventSource.loadJSON(events, ''); // Load your events directly to the eventSource, NOT the Timeline. tl.finishedEventLoading(); } This recreates the timeline each time I get new data. You can do all sorts of things based on the live data this way. I'm also doing this with Timeplot but you need to use XML with that, no JSON support yet. Hopefully the dynamic start/end date setting on the theme will work for you. Let me know how it goes. Cheers, Scott On Fri, Jan 23, 2009 at 11:09 AM, Eric Pugh <[email protected] > wrote: > Scott, > Looks like you are doing exactly what I want! I am doing a lot of extra > hoops cause I don't load the json just once. I am including my JSON data > via this method: > > > <link href="people-exhibit-json.xq?id=jefferson-thomas" > type="application/json" rel="exhibit/data" /> > > However, you seem to be suggesting a better way of doing this? Is there an > example of using the req.responseText method in any of the simile Examples? > I didn't find it on my first pass through... I did find this post that > looked related... > > > http://groups.google.com/group/simile-widgets/browse_thread/thread/881cda360855420f > > > Eric > > > > On Jan 22, 2009, at 5:09 PM, Scott Thomson wrote: > > Hi Eric, > > I might not be understanding yoiur question clearly but I update my > timeline with dynamic json data. > > Have you tried reading your json into a memory object > > var my_json = eval('(' + req.responseText + ')'); // this is turning ajax > response JSON text data into a JSON object > > and then: > > var min_start = calcMinStart(my_json); > var max_end = calcMaxEnd(my_json); > > : > theme.timeline_start = min_start; > theme.timeline_start = max_end; > : > > // then just load your JSON directly to the event source > eventSource.loadJSON(my_json, ''); > > On Fri, Jan 23, 2009 at 1:07 AM, Eric Pugh < > [email protected]> wrote: > >> >> Hi all, >> >> I've been using the custom timeline constructor to set the start and >> end time of the timeline in Exhibit (I am using trunk of the timeline >> project): >> >> theme.timeline_start = new Date(Date.UTC(1725, 0, 1)); >> theme.timeline_stop = new Date(Date.UTC(2015, 0, 1)); >> >> Is there anyway to instead make the start and stop based on my JSON >> data source? >> >> Eric >> >> ----------------------------------------------------- >> Eric Pugh | Principal | OpenSource Connections, LLC | 434.466.1467 | >> http://www.opensourceconnections.com >> Free/Busy: http://tinyurl.com/eric-cal >> >> >> >> >> >> >> > > > -- > Scott Thomson > 0401 726 889 > > > > > -----------------------------------------------------** > *Eric Pugh **| *Principal | OpenSource Connections, LLC | 434.466.1467 | > http://www.opensourceconnections.com > Free/Busy: http://tinyurl.com/eric-cal > > > > > > > > -- Scott Thomson 0401 726 889 --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "SIMILE Widgets" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/simile-widgets?hl=en -~----------~----~----~----~------~----~------~--~---
