TimelineJs3卡在Loading，报错是timeline初始化传入的json个objects

Question

我正在构建我的 TimeLine.js 并将 json 传递到新的对象实例化中，问题是时间轴将 dataObject.json 作为 Url 而不是json 对象。有谁知道问题所在或解决方法吗？！

<!-- 1 -->

https://timeline.knightlab.com/docs/instantiate-a-timeline.html

<link title="timeline-styles" rel="stylesheet" href="//cdn.knightlab.com/libs/timeline3/latest/css/timeline.css">

<!-- 2 -->
<script src="//cdn.knightlab.com/libs/timeline3/latest/js/timeline.js">     </script>

var dataObject ={  
   'title':{  
      'text':{  
         'headline':'Nr Processo: 007969031',
         'text':'',

      },
      'events':[  
         {  
            "startDate":{  
               "year":"1900",
               "month":"1",
               "day":"1"
            },
            "endDate":{  
               "year":"1900",
               "month":"1",
               "day":"1"
            },
            "text":{  
               "headline":"3358254",
               "text":""
            },
            "media":{  
               "media":"<iframe id=\"iframe871\" width=\"100%\"  scrolling=\"no\" onload=\"javascript:DCP_resizeIframe();\"  frameborder=\"0\" src=\"/Acidentes/ProcessoTimeLine.aspx?EpisodioId=1\" ></iframe>",
               "credit":"",
               "caption":""
            }
         }
      ]
   }
}; 

var options ={  
   width:'100%',
   height:'1500',
   timenav_position:'top',
   language:'en',
   start_at_end:false,
   start_at_slide:0,
   initial_zoom:0
}; 

 window.timeline = new TL.Timeline('Timeline','dataObject.json',options);

Answer 1

TimelineJS 支持 JSON 输入。请参阅下面的 link。

https://timeline.knightlab.com/docs/instantiate-a-timeline.html 在 创建您自己的 JSON
获取详细文档 https://timeline.knightlab.com/docs/json-format.html

也采样 JSON https://github.com/NUKnightLab/TimelineJS3/blob/master/website/templates/examples/houston/timeline3.json

由于您的 JSON 格式不正确，即使作为对象传递也无法正常工作。

查看工作中的 JSFiddle： http://jsfiddle.net/7k3uzp2x/

或全部在一个代码中：

<html>
    <head>
        <link title="timeline-styles" rel="stylesheet" href="//cdn.knightlab.com/libs/timeline3/latest/css/timeline.css">
        <script src="//cdn.knightlab.com/libs/timeline3/latest/js/timeline.js">     </script>
    </head>
<body>
    <div id="Timeline"></div>
    <script>
        var dataObject =        {  
            "title":{  
                "text":{  
                    "headline":"Nr Processo: 007969031",
                    "text":""
                }
            },
            "events":[  
                {  
                    "start_date":{  
                        "year":"1900",
                        "month":"1",
                        "day":"1"
                    },
                    "end_date":{  
                        "year":"1900",
                        "month":"1",
                        "day":"1"
                    },
                    "text":{  
                        "headline":"3358254",
                        "text":""
                    },
                    "media":{  
                        "url":"<iframe id=\"iframe871\" width=\"100%\"  scrolling=\"no\" onload=\"javascript:DCP_resizeIframe();\"  frameborder=\"0\" src=\"/Acidentes/ProcessoTimeLine.aspx?EpisodioId=1\" ></iframe>",
                        "credit":"",
                        "caption":""
                    }
                }
            ]
        }; 

        var options ={  
           width:'100%',
           height:'1500',
           timenav_position:'top',
           language:'en',
           start_at_end:false,
           start_at_slide:0,
           initial_zoom:0
        }; 

         window.timeline = new TL.Timeline('Timeline',dataObject,options);
    </script>
</div>
</body>
</html>

TimelineJs3卡在Loading，报错是timeline初始化传入的json个objects

TimelineJs3 stuck at Loading, the error is the json objects passed in the initialization of the timeline

jquery

json

timeline.js