多个并行任务，且时间重叠怎么处理比较好？

[624515059]

当前用户 某一时间段有多个任务、 任务存在并行时间上存在重叠（比如12月，任务A:12月5日-12.15 任务B:12.10 - 12.12）目前展示的效果是层级覆盖，可能就看不到任务B。

如何优化比较好呢，存在时间重叠多行展示？

[w1301625107]

1.复制一行数据，让重叠的那条再下面那行显示。 2.让重叠的行的高度只有行高的一半，这样两条数据各占一半行高，鼠标移动上去再让对应的数据完整显示

[624515059]

1.复制一行数据，让重叠的那条再下面那行显示。 2.让重叠的行的高度只有行高的一半，这样两条数据各占一半行高，鼠标移动上去再让对应的数据完整显示

谢谢。可能存在多个重叠的数据。 可不可以这么理解，把数据进行处理，达到复制一行的效果

// 原数据
const res = [
  {
    name:'张三', //非必须
    gtArray:[ //默认的需要渲染的数组
      {
        name:'任务A', //非必须
        start:'2020-01-1 0:0:0',
        end:'2020-01-15 0:0:0'
      },
      {
        name:'任务B', //非必须
        start:'2020-01-5 0:0:0',
        end:'2020-01-10 0:0:0'
      },
      {
        name:'任务C', //非必须
        start:'2020-01-8 0:0:0',
        end:'2020-01-9 0:0:0'
      },
    ]，
  },
  {
     name:'王五'，
    // ...
   },
]

// 处理后的数据
const res = [
  {
    name:'张三', //非必须
    gtArray:[ //默认的需要渲染的数组
      {
        name:'任务A', //非必须
        start:'2020-01-1 0:0:0',
        end:'2020-01-15 0:0:0'
      },
    ]，
  },
  {
    gtArray:[ //默认的需要渲染的数组
      {
        name:'任务B', //非必须
        start:'2020-01-5 0:0:0',
        end:'2020-01-10 0:0:0'
      },
    ]，
  },
  {
    gtArray:[ //默认的需要渲染的数组
      {
        name:'任务C', //非必须
        start:'2020-01-8 0:0:0',
        end:'2020-01-9 0:0:0'
      },
    ]，
  },
  {
      name:'王五',
      // ...
   }
]

[w1301625107]

不是，是这个意思

{
    name:'张三a', //非必须
    gtArray:[ //默认的需要渲染的数组
      {
        name:'任务A', //非必须
        start:'2020-01-1 0:0:0',
        end:'2020-01-15 0:0:0'
      },
    ]，
  },
{
    name:'张三b', //非必须
    gtArray:[ //默认的需要渲染的数组
      {
        name:'任务B', //非必须
        start:'2020-01-1 0:0:0',
        end:'2020-01-15 0:0:0'
      },
    ]，
  },

但是如果重复数据不是很多的情况，我还是建议方案二, 多一个字段放位置，数据也得处理一下

{
    name:'张三', //非必须
    gtArray:[ //默认的需要渲染的数组
      {
        name:'任务A', //非必须
        start:'2020-01-1 0:0:0',
        end:'2020-01-15 0:0:0',
        position:'top'
      },
      {
        name:'任务B', //非必须
        start:'2020-01-5 0:0:0',
        end:'2020-01-10 0:0:0',
        position:'center'
      },
      {
        name:'任务C', //非必须
        start:'2020-01-8 0:0:0',
        end:'2020-01-9 0:0:0',
        position:'bottom'
      },
    ]，
  },

再或者，ui设计可以改动吗，让数据快变成半透明的，这样就比较容易看出来叠加在一起的部分，因为叠加的部分颜色会变深

[624515059]

再或者，ui设计可以改动吗，让数据快变成半透明的，这样就比较容易看出来叠加在一起的部分，因为叠加的部分颜色会变深

谢谢兄弟。提供的思路。 UI方面随便改。内部用来统计 人和部门 一个时间范围内所承接的需求~ 倾向于半透明方案。不过如果以部门的维度来看，可能部门每个人完成的需求时间上重复概率增大，不知鼠标经过查看详情效果如何。等开发时我尝试下上述方案。

[w1301625107]

加油