用曲线创建一条垂直线来显示平均值

时间:2016-11-23 09:04:02

标签: javascript plotly

所以我正在尝试创建一个水平条形图,其水平线显示平均值。

到目前为止,我尝试了以下内容:

首先添加了我的barChart系列(它来自以下数组):

      "series": [
    {
      "value": 100, "label": "F1"
    },
    {
      "value": 25, "label": "F2"
    },
    {
      "value": 30, "label": "Jedi Jeremiah 555"
    },
    {
      "value": 40, "label": "F4"
    },
    {
      "value": 55, "label": "F5"
    },
    {
      "value": 60, "label": "F6"
    },
    {
      "value": 71, "label": "F7"
    },
    {
      "value": 15, "label": "F8"
    },
    {
      "value": 88, "label": "F9"
    },
    {
      "value": 90, "label": "F10"
    }
  ]

转换为以下对象的数组:

{name: 'F1', orientation: "h", x: [100], y: ["F1"]}

然后我添加以下系列:

{
    name: 'average organization',
    type: 'scatter',
    x: [60],
    orientation: 'h'
}

这将创建以下图表:

enter image description here

正如你所看到的,只有一个蓝点表示平均值,而不是我要找的结果。

我知道有形状,但我希望将它作为图表的一部分,以便您可以选择或取消选择它。

有谁知道你怎么做到这一点?

1 个答案:

答案 0 :(得分:3)

如果您提供jsFiddle或codePen或其他示例直接执行它会有所帮助:-) 我认为问题在于,您希望有一条垂直线,但是使用orientation: 'h'orientation: 'v'设置为最后一个"平均组织" -object。

我在jsFiddle中复制了你的例子并添加了所需的行为: https://jsfiddle.net/vepycde0/

希望它有所帮助: - )

修改:隐藏" 0"在yAxis上使用y: [""],如jsFiddle所示:https://jsfiddle.net/vepycde0/1/