it's hard to tell without the data.
On Thursday, March 01, 2012 4:46:52 PM, Sandeep wrote:
Following this is my html document. I cannot figure out what is the
problem, as for some reason the timeline is not loading. It had loaded
in the past. This is still a work in progress, and is at a somewhat
early stage. Can someone spot my mistake so I can get back to work?
Thanks
<html>
<head>
<title>Grades</title>
<!--link to external javascript data file-->
<link href="gradetimeline.js" type="application/json" rel="exhibit/
data" />
<!--links to scripts stored on a website-->
<script src="http://api.simile-widgets.org/exhibit/2.2.0/exhibit-
api.js"
type="text/javascript"></script>
<script src="http://api.simile-widgets.org/exhibit/2.2.0/extensions/
time/time-extension.js"
type="text/javascript"></script>
<!--<link rel="stylesheet" type="text/css" href="style.css" />-->
<script>
function clearFilter(filterID)
{
var fct = exhibit.getComponent(filterID);
if (fct.hasRestrictions()) {
fct.clearAllRestrictions();
}
}
function clearAllFilters()
{
clearFilter('grade');
clearFilter('percentile');
clearFilter('gradelevel');
clearFilter('subject');
clearFilter('search')
}
</script>
<!--timeline constructor-->
<script>
function createTimeline() {
var eventSource = new Timeline.DefaultEventSource();
var bandInfos = [
Timeline.createBandInfo({
eventSource: eventSource,
date: "Jun 28 2006 00:00:00 GMT",
width: "70%",
intervalUnit: Timeline.DateTime.MONTH,
intervalPixels: 100
}),
Timeline.createBandInfo({
eventSource: eventSource,
date: "Jun 28 2006 00:00:00 GMT",
width: "30%",
intervalUnit: Timeline.DateTime.YEAR,
intervalPixels: 200
})
];
bandInfos[1].syncWith = 0;
bandInfos[1].highlight = true;
tl = Timeline.create(document.getElementById("timeline"),
bandInfos);
}
</script>
</head>
<body>
<h1>grades</h1>
<!--set up area for the timeline and viewing pane to be displayed-->
<table border=12 width=100%>
<tr>
<!--initialize the viewing area-->
<td ex:role="viewPanel">
<table ex:role="lens">
<tr>
<td>
<table>
<!--"Name of grade":"# of grade"% eg. CMT:100%-->
<tr><td><div style="margin-left:auto; margin-right:auto;"
ex:content=".date"></td></tr>
<tr><td><div ex:content="concat(.label, ': ', .grade,
'%')"></div></
td></tr>
<tr><td><div ex:content="concat('Percentile: ', .percentile,
'%')"></
div></td></tr>
<!--Subject: "Subject" eg. Subject: Math-->
<tr><td><div ex:content="concat('Subject: ',
.subject)"></div></td></
tr>
<!--Grade level: "Grade level (0-12)" eg. Grade level from: 7-->
<tr><td><div ex:content="concat('Grade level: ',
.grade_level)"></
div></td></tr>
</table>
</td>
<td valign="top">
<!--If there are comments, they will be displayed as: Comments&
Notes: "Comments Here"-->
<div ex:if-exists=".comments"><span
ex:content="concat('Comments&
Notes: ', .comments)"></span></div>
</td>
</tr>
</table>
<!--timeine div element-->
<div
ex:role="view"
ex:viewClass="Timeline"
ex:topBandUnit="month"
ex:start=".date"
ex:colorKey=".subject"
ex:iconCoder="grade-icon"
ex:iconKey=".grade"
ex:title=".label"
></div>
<div ex:role="view"
ex:label="view"
ex:orders=".subject, .grade_level, .grade"
ex:possibleOrders=".subject, .grade_level, .grade, .label"
></div>
</td>
<!--set up browsing controls-->
<td width="25%">
Enter your search here:
<div ex:role="facet" ex:facetClass="TextSearch"
id="search"></div>
<div ex:role="facet" ex:facetClass="NumericRange"
ex:expression=".grade" ex:facetLabel="Grade" id="grade"></div>
<div ex:role="facet" ex:facetClass="NumericRange"
ex:expression=".percentile" ex:facetLabel="Percentile"
id="percentile"></div>
<div ex:role="facet" ex:expression=".grade_level"
ex:facetLabel="Grade Level" id="gradelevel"></div>
<div ex:role="facet" ex:expression=".subject"
ex:facetLabel="Subject" id="subject"></div>
<button type="button" onClick="clearAllFilters()">Clear
All
Filters</button>
</td>
</tr>
</table>
<div ex:role="coder" ex:coderClass="Icon" id="grade-icon">
<span ex:icon="red.png">0</span>
<span ex:icon="red.png">1</span>
<span ex:icon="red.png">2</span>
<span ex:icon="red.png">3</span>
<span ex:icon="red.png">4</span>
<span ex:icon="red.png">5</span>
<span ex:icon="red.png">6</span>
<span ex:icon="red.png">7</span>
<span ex:icon="red.png">8</span>
<span ex:icon="red.png">9</span>
<span ex:icon="red.png">10</span>
<span ex:icon="red.png">11</span>
<span ex:icon="red.png">12</span>
<span ex:icon="red.png">13</span>
<span ex:icon="red.png">14</span>
<span ex:icon="red.png">15</span>
<span ex:icon="red.png">16</span>
<span ex:icon="red.png">17</span>
<span ex:icon="red.png">18</span>
<span ex:icon="red.png">19</span>
<span ex:icon="red.png">20</span>
<span ex:icon="red.png">21</span>
<span ex:icon="red.png">22</span>
<span ex:icon="red.png">23</span>
<span ex:icon="red.png">24</span>
<span ex:icon="red.png">25</span>
<span ex:icon="red.png">26</span>
<span ex:icon="red.png">27</span>
<span ex:icon="red.png">28</span>
<span ex:icon="red.png">29</span>
<span ex:icon="red.png">30</span>
<span ex:icon="red.png">31</span>
<span ex:icon="red.png">32</span>
<span ex:icon="red.png">33</span>
<span ex:icon="red.png">34</span>
<span ex:icon="red.png">35</span>
<span ex:icon="red.png">36</span>
<span ex:icon="red.png">37</span>
<span ex:icon="red.png">38</span>
<span ex:icon="red.png">39</span>
<span ex:icon="red.png">40</span>
<span ex:icon="red.png">41</span>
<span ex:icon="red.png">42</span>
<span ex:icon="red.png">43</span>
<span ex:icon="red.png">44</span>
<span ex:icon="red.png">45</span>
<span ex:icon="red.png">46</span>
<span ex:icon="red.png">47</span>
<span ex:icon="red.png">48</span>
<span ex:icon="red.png">49</span>
<span ex:icon="red.png">50</span>
<span ex:icon="red.png">51</span>
<span ex:icon="red.png">52</span>
<span ex:icon="red.png">53</span>
<span ex:icon="red.png">54</span>
<span ex:icon="red.png">55</span>
<span ex:icon="red.png">56</span>
<span ex:icon="red.png">57</span>
<span ex:icon="red.png">58</span>
<span ex:icon="red.png">59</span>
<span ex:icon="red.png">60</span>
<span ex:icon="red.png">61</span>
<span ex:icon="red.png">62</span>
<span ex:icon="red.png">63</span>
<span ex:icon="red.png">64</span>
<span ex:icon="red.png">65</span>
<span ex:icon="red.png">66</span>
<span ex:icon="red.png">67</span>
<span ex:icon="red.png">68</span>
<span ex:icon="red.png">69</span>
<span ex:icon="red.png">70</span>
<span ex:icon="red.png">71</span>
<span ex:icon="red.png">72</span>
<span ex:icon="red.png">73</span>
<span ex:icon="red.png">74</span>
<span ex:icon="yellow.png">75</span>
<span ex:icon="yellow.png">76</span>
<span ex:icon="yellow.png">77</span>
<span ex:icon="yellow.png">78</span>
<span ex:icon="yellow.png">79</span>
<span ex:icon="yellow.png">80</span>
<span ex:icon="yellow.png">81</span>
<span ex:icon="yellow.png">82</span>
<span ex:icon="yellow.png">83</span>
<span ex:icon="yellow.png">84</span>
<span ex:icon="yellow.png">85</span>
<span ex:icon="yellow.png">86</span>
<span ex:icon="yellow.png">87</span>
<span ex:icon="yellow.png">88</span>
<span ex:icon="yellow.png">89</span>
<span ex:icon="green.png">90</span>
<span ex:icon="green.png">91</span>
<span ex:icon="green.png">92</span>
<span ex:icon="green.png">93</span>
<span ex:icon="green.png">94</span>
<span ex:icon="green.png">95</span>
<span ex:icon="green.png">96</span>
<span ex:icon="green.png">97</span>
<span ex:icon="green.png">98</span>
<span ex:icon="green.png">99</span>
<span ex:icon="green.png">100</span>
</div>
</body>
</html>
--
You received this message because you are subscribed to the Google Groups "SIMILE
Widgets" group.
To post to this group, send email to simile-widgets@googlegroups.com.
To unsubscribe from this group, send email to
simile-widgets+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/simile-widgets?hl=en.
