Sample timeline configurations
[edit]
Timeline configurations
Here are some of the sample timeline configurations, just so you don't have to look into the source code of each of the examples to see the variable names.
MIT Nobel Prize Example - link
This example uses ex:start, ex:marker, ex:bubbleWidth, ex:bubbleHeight, and a custom lens. If no custom lens is specified, it the popup bubble will show the default lens.
<div ex:role="exhibit-view"
ex:viewClass="Exhibit.TimelineView"
ex:start=".nobel-year"
ex:marker=".discipline"
ex:bubbleWidth="150"
ex:bubbleHeight="150">
<div ex:role="exhibit-lens" class="nobelist-timeline-lens">
<img ex:src-content=".imageURL" />
<div><span ex:content=".label"></span></div>
<div>
<span ex:content=".discipline" class="discipline"></span>,
<span ex:content=".nobel-year" class="year"></span>
</div>
</div>
</div>
US Presidents Example - link
This example uses ex:label, ex:proxy, ex:start, ex:end, ex:marker, ex:bubbleWidth, and ex:bubbleHeight.
<div ex:role="exhibit-view"
ex:viewClass="Exhibit.TimelineView"
ex:label="Terms"
ex:proxy=".presidency"
ex:start=".inDate"
ex:end=".outDate"
ex:marker=".party"
ex:bubbleWidth="320"
ex:bubbleHeight="200">
</div>
Breakfast Cereal Example - link
This example uses ex:start, ex:marker,ex:topBandIntervalPixels, ex:bottomBandIntervalPixels, ex:bubbleWidth, ex:bubbleHeight, ex:densityFactor.
<div ex:role="exhibit-view"
ex:viewClass="Exhibit.TimelineView"
ex:start=".decade"
ex:marker=".brand"
ex:topBandIntervalPixels="250"
ex:bottomBandIntervalPixels="400"
ex:bubbleWidth="400"
ex:bubbleHeight="250"
ex:densityFactor="1">
</div>

