Question

我正在尝试在Meteor应用程序上正确使用vis-timeline库，但它无法呈现。

这是我的.html文件

<template name="kk">
<div class="ui huge segment" id="visualization">
</div>

这是我的.js

import { Timeline, DataSet } from 'vis-timeline';

Template.kk.onRendered(() => {
  const container = $('#visualization');
  const items = new DataSet([
    { id: 1, content: 'item 1', start: '2014-04-20' },
    { id: 2, content: 'item 2', start: '2014-04-14' },
    { id: 3, content: 'item 3', start: '2014-04-18' },
    {
      id: 4, content: 'item 4', start: '2014-04-16', end: '2014-04-19',
    },
    { id: 5, content: 'item 5', start: '2014-04-25' },
    {
      id: 6, content: 'item 6', start: '2014-04-27', type: 'point',
    },
  ]);
  const options = {
    width: '100%',
    height: '30px',
    margin: {
      item: 20,
    },
  };
  const tl = new Timeline(container[0], items, options);
  console.log('tl');
  console.log(tl);
});

this是我所得到的。

知道为什么它不能正确渲染吗？

感谢您的帮助

Answer 1

问题解决了。正如Mikkel所说，这是CSS问题。

我将包含导入内容的.js代码粘贴到您身上。

CASE 1
>> [DEFAULT]
>> [MOVED]
CASE 2
>> [DEFAULT]
>> [COPIED]
CASE 3
>> [DEFAULT]
CASE 4
>> [DEFAULT]
CASE 5
>> [COPIED]
CASE 6
>> [MOVED]

感谢您的帮助！

流星上的可见时间线不渲染

1 个答案: