jquery - 流程图条形宽度

Question

我在报告页面中使用了流程图。该图表的 x 轴包含一些标签，例如服务质量、性能质量等，但这些标签对于其他每个客户都是动态的。我的意思是，对于其他客户，标签可以是 Car、Plane、Truck，并且 x 轴中文本之间的字符差异导致条形宽度的突然变化。据我所知，flot条形图的 barWidth 属性取决于x轴，正如this answer的作者一样说。在时间模式下，我以某种方式理解，但是如果我在x轴上使用文本，则barWidth是如何确定的？

编辑: 生成的代码为 here .

相同的宽度值，即0.1，图表中的两个不同 View :

x 轴文本较长的一个

x 轴文本较短的一个

最糟糕的一个来了:

Answer 1

对链接到生成代码的第三张图像的说明:

x 值为 103、110 和 114(来自 var d_main_quest_bar_20 = [[103, 8.25],[110, 8.75],[114, 7.75],];)。 x 值之间的差异为 7 和 4，这解释了条形组之间的不同距离。您的条形宽度为 0.4，因此每组条形的总宽度约为 1.6。并且您的酒吧组居中。总而言之，这给出了:

start     end     width    description             tickname
--------------------------------------------------------------
102.2 to 103.8     1.6     first group of bars     Tesis
103.8 to 109.2     5.4
109.2 to 110.8     1.6     second group of bars    Program
110.8 to 113.2     2.4
113.2 to 114.8     1.6     third group of bars     Personel

因此，正如我在评论中提到的，条形宽度和位置是根据数据中的数字 x 值计算的，即使您没有显示这些值。 (它与您在问题中暗示的刻度名称的长度无关，这只是巧合。)

如果您想显示距离相等的组并且不关心它们的值，您可以使用类别插件( example )。您必须检查/测试这是否与订单栏插件配合良好，以及在这种情况下如何计算条形宽度。