Background
we could have a vertical scrollable div being the timeline
lots of sub divs being the representation of the each geographical location
A scale variable defining the ratio pixel/year
Foreground (events and so on)
Then using the CSS absolute (not my favourite...) we can position our elements absolutely in relation to a parent div, the timeline div, or different bands like so:
<html>
<body>
<div style="position: relative; left: 60px; height: 260px; border-style: solid; width: 300px; overflow: scroll">
<!-- bands -->
<div style="width: 30%; height: 100%; border-style: dashed; background-color: turquoise; float: left">Judah</div>
<div style="width: 30%; height: 100%; border-style: dashed; background-color: gold; float: left">Egypt</div>
<div style="width: 30%; height: 100%; border-style: dashed; background-color: brown; float: left">Assyria</div>
<!-- events -->
<div style="border-color: blue; top: 10px; border-style: dotted; position: absolute; left: 150px; width: 30px">event1</div>
<div style="border-color: red; top: 150px; border-style: dotted; position: absolute; left: 70px; width: 30px">event2</div>
<div style="border-color: yellow; top: 250px; border-style: dotted; position: absolute; left: 70px; width: 30px">event3</div>
<div style="border-color: green; top: 220px; border-style: dotted; position: absolute; left: 120px; width: 30px">event4</div>
<!-- length of time -->
<div style="width: 10px; height: 100px; position: absolute; top: 40px; border-style: dashed; background-color: pink; left: 10px">/</div>
</div>
</body>
</html>
Either create a file with the above or paste in: http://www.w3schools.com/Css/tryit.asp?filename=trycss_position_relative
Basically the band height would have to change to something like 99999px to ensure it's long enough. Then using that tutorial video, making the whole thing scrollable, adding mousescroll and mouse events, we can get a decent timeline...
The tricky thing is drawing the line through the timeline... The things I've seen to draw lines, but using this: http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm relative to the divs mentioned above, i think we can something rather nice...
Any ideas welcome... (attached screenshot)
Chris
Sounds good. I think we should be able to achieve this in Javascript with AJAX calls back to the (local or remote) server. The zoom may not be so gradual, but it could be gradual in the sense that it redraws the dating scale, and then with ajax reload the correct events/durations to plot...
I found this one: (eg.) http://www.simile-widgets.org/timeline/ It's horizontal though, but then I thought we were basing it on the one in MS Word document.
I'll have a scout for a vertical one online... (it could be we can use the same thing).
Chris2009/10/26 Tyndale STEP Project <TyndaleSTEP@gmail.com>
Chris, what kind of widget you do have? I don't know of a ready-made one.
I'm envisioning a vertical timeline with different vertical stripes
eg for the kings, the left 1/5 would be Egypt then another stripe
would be Judah, then then Israel Assyria, and then the rest of the worldThe timeline would look continuous, but is in some ways split into:
1) Patriarchs (ending at the Exodus)
2) Conquest (Exodus to start of reign of David)
3) Kingdoms (David to Exile)
4) Exile & Intertestamental
5) Gospels
6) Acts & Early church history.The reasons for the divisions is that different periods need to zoom
into different levels of detail,
and because there are some uncertainties in dating at key points
1) The Patriarchs can have different dating depending on versions
(Hebrew, Greek & Samaritan) and also depending on how literally the
text is read (though I don't think we can produce a different time
line based on something like historical vagueness!).
2) The Exodus can be different by about 200 years and the Judges and
Saul's reign have many uncertainties can be jiggled to agree with the
Exodus and the relatively fixed date at the start of David's reign.
5) Many dates in Jesus' life depend on the date of his birth and death.People could see a different timeline depending on these different factors.
What would be absolutely ideal is a single timeline which we can
seamlessly zoom into,
but if we can't do this, I'd be happy with a single timeline with
hotspots which open up these 6 higher-res timelines
and for a couple of areas I'd like to zoom in further still - eg at
the return from Exile & the crucifixionThe reason for the order of the vertical stripes is so that Israel
can be seen on something of a journey.
I've attached a pic which shows the kind of thing I'm thinking of.
The Bible characters would be bold and stand out, but the separate
nations would also have kings of their own.If we follow this kind of plan, the display should perhaps be based
on graphical images with hotspots
- ie it doesn't need to be generated by the data
If we have something which is data-generated, we should probably aim
for something much conventional like a simple vertical timelineWhat do you think - is the geographical + historical timeline achievable?
David IB
--
Posted By Tyndale STEP Project to Tyndale STEP - Programming on 10/26/2009 08:39:00 AM
--
Posted By Tyndale STEP Project to Tyndale STEP - Programming on 10/26/2009 11:49:00 AM
No comments:
Post a Comment