2016-11-23 36 views
0

私は平均を示す水平線を持つ水平棒グラフを作成しようとしています。plotly平均を表示するための垂直線を作成

これまでのところ、私は次のことをしようとしています

まず私の棒グラフシリーズ(それは次の配列から来ている)を追加しました:

次のオブジェクトの配列に変換し
 "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

あなたが探している結果イムではありません平均を示す唯一の青い点がある見ることができるように。

シェイプがありますが、チャートの一部として選択したり、選択を解除したりすることができます。

これを達成する方法を知っている人はいますか?

+0

あなたはちょうどポイントを定義するとポイントがあります。代わりに、各バーのデータを提供する必要があります。 –

答えて

2

あなたは私はあなたが垂直線を持つようにしたいという、問題があると思いますが、最後の「平均的な組織にorientation: 'h'を設定 :-)それを直接実行することjsFiddleまたはcodePenまたは他の例を提供する場合、それが役立つだろう"代わりにorientation: 'v'を使用してオブジェクトを作成します。

私はjsFiddleであなたの例を再現し、所望の動作を追加します。 https://jsfiddle.net/vepycde0/

は、それが編集 :-)

を役に立てば幸い:Y軸の「0」を隠すために見られるようy: [""]を使用そのjsFiddle:https://jsfiddle.net/vepycde0/1/

+0

@fillperweidありがとうございました。凡例から0を取り除く方法はありますか? –

+0

私は唯一の方法は空のy値を与えることです: 'y:[" "]'。あなたのためにjsFiddleを更新しました:jsfiddle.net/vepycde0/1 – flipperweid

関連する問題