Javascript 如何制作不规则缩放的x轴，并使用Highcharts/Highstock绘制到x轴的两侧

我想用Highcharts/Highstock制作一个如下所示的图形（抱歉，图形不好；）：

我已经知道了如何做列和行。我无法发现（或不可能发现）的是：

• 如何在x轴的两侧都有列和线？ 编辑：我想手动和静态设置刻度点之间的距离
• 如何拥有一个x轴，它不仅是不规则的，而且只显示一些带有描述的点

编辑：这里是我现在想到的：唯一缺少的是给列指定一个单独的宽度（不是它们像

x:2-4

），并根据它们的值动态地给它们着色

---

提前非常感谢

您可以使用定位器

---

序数为假：

不是直截了当的回答，但有一些建议：

• 要使列具有特定的宽度，您需要使每列处于不同的系列中
• 对于每一列，您可以使用

  数据：[{x:x，y:y，color:specific\u color}]

  设置特定的颜色。因此，要根据值设置特定的颜色，请通过添加属性

  color

  对数据进行预处理

---

要根据列的值设置列的格式，可以使用一个小助手函数，根据输入值返回具有特定颜色的点对象

function scatterDot(x, y, color){
  return {
    "x": x
  , "y": y
  , "color": color
  , "marker": { "fillColor": color, "states": { "hover": { "fillColor": color } } }
  };
}

对于动态绘图仪标注栏，您还可以使用格式化程序功能来显示它，具体取决于它是否在特定范围内，从而使标记位置灵活，而不是预设。我对设置数据标签做了类似的操作

dataLabels: {
  enabled: true,
  formatter: function() {
    if (this.percentage >= 0) {
      return this.key +"<br />"+ this.y+" ("+Math.round(this.percentage)+"%)";
    } else {
      return '';
    }
  }
}

数据标签：{
启用：对，
格式化程序：函数（）{
如果（此百分比>=0）{
返回this.key+“
”+this.y+”（“+Math.round（this.percentage）+“%”）；
}否则{
返回“”；
}
}
}

好的。这里是我想到的：是否有可能以某种方式给出条形图的水平范围？您可以使用plotBand（基于您的概念图像和上面的信息），但我无法设置plotBand的高度，可以吗？确实，这样您就可以使用渲染器了