Hi, I'm trying to create a simple timeline from ajax calls. Clearly I'm
doing something wrong. Nothing appears in the timeline.
Here is my javascript. As you can see, I am using yui to retrieve the
data from my server. I include some server data below as well. I init
the timeline when the page loads and then try to put data into it when
the user makes a choice about what data to look at.
eventData consists of a list of objects with start, title, and duration
event (see below).
Thanks very much for your help.
Herb
I'm using Firefox 3.6 on Ubuntu 10.04.
Code:
function getTimeline(query, label) {
getTimelineURL = "/getTimeline?query="+query;
//alert("getTimelineURL: "+getTimelineURL)
retDocument = YAHOO.util.Connect.asyncRequest('GET',
getTimelineURL, showTimelineCallback, null);
}
var showTimelineCallback = {
success: drawTimeline,
failure: failDraw
}
var resizeTimerID = null;
function onResize() {
if (resizeTimerID == null) {
resizeTimerID = window.setTimeout(function() {
resizeTimerID = null;
tl.layout();
}, 500);
}
}
function drawTimeline(o) {
var eventData =
YAHOO.lang.JSON.parse(o.responseText)["timeline"]["events"];
//getTimelineURL = "/getTimeline?query="+query;
//alert("getTimelineURL: "+getTimelineURL)
bandInfos = [
Timeline.createBandInfo({
width: "70%",
intervalUnit: Timeline.DateTime.MONTH,
intervalPixels: 100
}),
Timeline.createBandInfo({
width: "30%",
intervalUnit: Timeline.DateTime.YEAR,
intervalPixels: 200
})
];
bandInfos[1].syncWith = 0;
bandInfos[1].highlight = true;
tl = Timeline.create(document.getElementById("clusTimeline"),
bandInfos);
var eventSource = new Timeline.DefaultEventSource();
var theme = Timeline.ClassicTheme.create();
var startDate = "Fri Jan 1 1999 00:00:00 GMT-0600";
var endDate = "Mon Dec 30 2002 00:00:00 GMT-0600"
bandInfos[1].decorators = [
new Timeline.SpanHighlightDecorator({
startDate: startDate,
endDate: endDate,
inFront: false,
color: "#FFC080",
opacity: 30,
startLabel: "Begin",
endLabel: "End",
theme: theme
})
]
eventSource.loadJSON(eventData, document.location.href);
}
A sample of my json data:
|{"timeline": {"events": [{"start": "Wed, 31 Jan 2001 04:07:00 -0800 (PST)",
"durationEvent": false,
"title"||: "Directory"}, {"start": "Mon, 19 Feb 2001 12:05:00 -0800 (PST)",
"durationEvent": false,
"title": "The|| Potential Impact of a Recession on US Gas and Power Markets -\r\n
CERA Multimedia Presentation"},
{"start"||: "Wed, 26 Apr 2000 08:46:00 -0700 (PDT)", "durationEvent": false, "title": "CERA Multimedia Presentation|| Replay Now
Available! April 12, 200 0"}, {"start": "Fri, 17 Dec 1999 07:56:00 -0800 (PST)", "durationEvent"||: false, "title": "CERA CERA
Conference Call--scheduled for Tuesday, December 14, 1999\r\n - Conference|| Call"},|
--
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.
