1

タイムラインの作り方をウェブで探していました。私はこれが好きだと思いました：http ：//www.simile-widgets.org/timeline/

だから私はここで見つけることができる彼らのチュートリアルに従うようにしています：http ：//simile.mit.edu/wiki/How_to_Create_Timelines

私はチュートリアルに従っているので、コードは同じですが、ここにあります： 

<script>
   var tl;
function onLoad() {
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("my-timeline"), bandInfos);
Timeline.loadXML("test.xml", function(xml, url) { eventSource.loadXML(xml, url); });

}

var resizeTimerID = null;
function onResize() {
if (resizeTimerID == null) {
    resizeTimerID = window.setTimeout(function() {
        resizeTimerID = null;
        tl.layout();
    }, 500);
}
}

</script>
<body onload="onLoad();" onresize="onResize();">
<div id="my-timeline" style="height: 150px; border: 1px solid #aaa"></div>
</body>

そしてtest.xml

 <?xml version="1.0" encoding="ISO-8859-1"?>
 <?xml-stylesheet type="text/css" href="/TBDBsite/media/timeline.css"?>
 <data>
<event 
    start="May 28 2006 09:00:00 GMT"
    end="Jun 15 2006 09:00:00 GMT"
    isDuration="true"
    title="Writing Timeline documentation"
    image="http://simile.mit.edu/images/csail-logo.gif"
    >
    A few days to write some documentation for <a href="http://simile.mit.edu/timeline/">Timeline</a>.
    </event>

<event 
    start="Jun 16 2006 00:00:00 GMT"
    end="Jun 26 2006 00:00:00 GMT"
    title="Friend's wedding"
    >
    I'm not sure precisely when my friend's wedding is.
    </event>

<event 
    start="Aug 02 2006 00:00:00 GMT"
    title="Trip to Beijing"
    link="http://travel.yahoo.com/"
    >
    Woohoo!
    </event>
 </data>

LOAD XMLに問題があり、テンプレートと同じ場所にXMLサンプルファイルを保存しますが、ページを更新すると次のエラーが発生します。

test.xmlからデータxmlを読み込め
ませんでしたが見つかりません

誰かが理由を知っているか、これを解決するかを知りたいです。私のアイデアは、データをXMLファイルに保存することでしたが、おそらくそれが最善の解決策ではありません。
誰かがタイムラインを作るためのより良いアイデアを持っているなら、私も感謝します。

ありがとう！

4

2 に答える 2

3

応答はかなり遅いですが、エラーはxml宣言を含むデータファイルに起因します。タイムラインウィジェットは、で始まるxmlのみを除きます

<data>
于 2012-04-13T00:07:28.400 に答える
0

xmlの完全なURLパスを試しましたか？「http://localhost/text.xml」..または相対パス「./test.xml」のようなもの

于 2010-08-31T09:55:12.047 に答える