在echarts的自定义系列中添加小间距

问题描述

我在尝试以自定义系列eChart的方式获得自己的酒吧时遇到了一些困难，请不要重叠，请参见下面的屏幕截图。

我要在此处添加的数据之间都有几秒钟到一分钟的间隔，例如，由于时间的流逝，在第一行上实际上有2x的橙色条重叠：

开始-12:05 结束-12:15

和

开始-12:15 结束-12:45

它与剪辑有关，不幸的是，使它起作用的各种尝试并未取得成果。

下面是在x轴上呈现商品的示例：

const index = api.value(0);
const start = api.coord([api.value(7),index]);
const end = api.coord([api.value(6),index]);

const coordsys = params.coordSys;
this.cartesianXBounds[0] = coordsys.x;
this.cartesianXBounds[1] = coordsys.x + coordsys.width;
this.cartesianYBounds[0] = coordsys.y;
this.cartesianYBounds[1] = coordsys.y + coordsys.height;

const barlength = end[0] = start[0];

const barheight = api.size([0,1])[1] * 0.6;

const x = start[0];
const y = start[1] - barheight;

const rectnormal = this.clipRectByRect(params,{
  x,y,width: barlength,height: barheight
});

解决方法

如果添加间隙，它将影响条形，并从实际位置移动到位置+间隙。屏幕截图不包含轴（如果正确的话），并且在实际图表上您具有相同的轴，然后只是在它们之间添加透明的微栏。

您还可以查看official example：在＃35行上的BaseTime（条长）中，递增随机值以实现间隙。而且，如果您尝试消除随机间隙，则条形仍然不会重叠，请以此为参考先检查数据，然后检查绘图功能。

P.S。如果start - 12:05 end - 12:15和start - 12:15 end - 12:45在同一时间轴上，那是错误的。第二个栏应从12:16开始或第一个栏应在12:14结束，否则您将在1秒钟内重叠。