小编Sea*_*ean的帖子

我正在尝试使用 charts.js 绘制时间序列图表。目前我的输出看起来像这样，这是非常错误的：

我有两个问题想解决：

1. 如何将缺失的数据值绘制为零，以便在定义的时间段内获得一个漂亮的平滑折线图？
2. 如何整理图表的格式以使其正确显示？

我传递到图表中的数据如下：

{2019-08-10T06:27: 12, 2019-08-10T06:26: 10, 2019-08-10T06:25: 8, 2019-08-10T06:24: 2, 2019-08-10T06:28: 1}

我将键作为标签，将值作为数据。

我的图表脚本如下：

<script type="text/javascript">
var ctx = document.getElementById('chartFive').getContext('2d');
var chart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: timeLabels,
        datasets: [{
            label: '# of Messages',
            data: timeData,
            backgroundColor: chartSingleColor,
            borderColor: chartBorderSingleColor,
            borderWidth: 1
        }]
    },
    options: {
        title: {
            display: true,
            text: 'Messages Received'
    },
    legend: {
        display: false
    },
    scales: {
        xAxes: [{
            type: 'time',
            time: {
                displayFormats: {
                    minute: 'HH:mm' …

我正在使用 Material-UI 并构建一个时间线。我的代码如下：

<Timeline align="right" className={classes.monthlyContainer}>
    <TimelineItem >
        <TimelineSeparator className={classes.timelineSeparator}>
            <TimelineDot className={classes.timelineDot} />
            <TimelineConnector className={classes.timelineConnector} />
        </TimelineSeparator>
        {(data.map(url =>
            <TimelineContent className={classes.memsImageContainer}>
                <img
                    className={classes.memsImage}
                    src={url}
                    alt="MEMs"
                />
            </TimelineContent>
        ))}
    </TimelineItem>
</Timeline>

当我渲染网页时，Material-UI 时间线不断创建一个.MuiTimelineItem-missingOppositeContent:before元素，该元素将我的时间线布局向左移动。

当我检查元素时，这就是我所看到的：

<li class="MuiTimelineItem-root MuiTimelineItem-alignRightMuiTimelineItem-missingOppositeContent">
    <div class="MuiTimelineSeparator-root makeStyles-timelineSeparator-4">
        <span class="MuiTimelineDot-root makeStyles-timelineDot-5 MuiTimelineDot-defaultGrey">
        </span>
        <span class="MuiTimelineConnector-root makeStyles-timelineConnector-6">
        </span>
    </div>
</li>

当我检查样式时，这就是我所拥有的：

.MuiTimelineItem-missingOppositeContent:before {
    flex: 1;
    content: "";
    padding: 6px 16px;
    padding-left: 0px;
    padding-right: 0px;

我在这里的代码和盒子中重新创建了它

我怎样才能删除这个元素？