React-vis-timeline - невозможно инициализировать данные элементов - PullRequest
Новая
       27

React-vis-timeline - невозможно инициализировать данные элементов

0 голосов
/ 13 июля 2020

У меня проблема с инициализацией временной шкалы vis. Временная шкала видна, но без данных. Я пробовал передавать элементы в разных форматах, но это похоже на прикрепленное изображение. Что с этим не так? Мой компонент реакции: 

import 'vis-timeline/styles/vis-timeline-graph2d.min.css';
import Timeline from 'react-vis-timeline'

const items = [{
    id: 1,
    start: new Date(2025, 7, 15),
    end: new Date(2025, 8, 2),
    content: 'Test 1',
},
{
    id: 2,
    start: new Date(2025, 7, 17),
    end: new Date(2025, 8, 3),
    content: 'Test 2',
}
];

const options = {
    width: '100%',
    height: '450px',
};

class Timeline2D extends React.Component {

    render() {
        return <Timeline options={options} initialItems={items} />;
    }
}

export default Timeline2D;

Результат

1 Ответ

0 голосов
/ 14 июля 2020

Чтобы исправить эту проблему, мне нужно установить группы. См. Правильный пример: 

import React from 'react';
import 'vis-timeline/styles/vis-timeline-graph2d.min.css';
import Timeline from 'react-vis-timeline'

const items = [{
    id: 1,
    group: 1,
    start: '2014-04-20',
    end: '2014-04-26',
    content: 'Test 1',
},
{
    id: 2,
    group: 2,
    start: '2014-04-22',
    end: '2014-04-29',
    content: 'Test 2',
}
];

const groups = [{
    id: 1,
    content: 'Group 1',
},
{
    id: 2,
    content: 'Group 2',
}
];

const options = {
    width: '100%',
    height: '450px',
};

class Timeline2D extends React.Component {

    render() {
        return <Timeline options={options} initialItems={items} initialGroups={groups}/>;
    }
}

export default Timeline2D;
...