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.