特定の日付のplotly js画像マーカー

私はこの例を使用しています：https://plot.ly/javascript/images/#add-multiple-images特定の日付に画像マーカーを表示しようとしています。 xrefを "x"に設定すると、画像は "1991-01-15"のようなx値に対して表示されません。特定の日付のplotly js画像マーカー

x軸が元の例のように日付でない場合、画像が表示されます。

Plotly.plot('graph', [{ 
 
    x: ['1991-01-01', '1991-02-01', '1991-03-01'], 
 
    y: [1, 2, 3] 
 
}], { 
 
    images: [ 
 
    { 
 
    "source": "https://images.plot.ly/language-icons/api-home/js-logo.png", 
 
    "xref": "paper", 
 
    "yref": "paper", 
 
    "x": 0, 
 
    "y": 1, 
 
    "sizex": 0.2, 
 
    "sizey": 0.2, 
 
    "xanchor": "right", 
 
    "yanchor": "bottom" 
 
    }, 
 
    { 
 
    "source": "https://images.plot.ly/language-icons/api-home/js-logo.png", 
 
    "xref": "x", 
 
    "yref": "y", 
 
    "x": '1991-01-01', 
 
    "y": 2, 
 
    "sizex": 0.5, 
 
    "sizey": 0.5, 
 
    "xanchor": "center", 
 
    "yanchor": "middle" 
 
    }, 
 
] 
 
})

<head> 
 
    <script src="https://cdn.plot.ly/plotly-latest.min.js"></script> 
 
</head> 
 
<body> 
 
    <div id="graph"></div> 
 
</body>

出典

2017-06-30 nsathyendra

x軸は時間ベースであるとき、どうやら "SIZEX" パラメータは、ミリ秒単位の値をとります。したがって、コードスニペットのsizexの値が0.5になると、非常に小さな画像がレンダリングされます。

sizexパラメータを2日（2 * 24 * 60 * 60 * 1000ミリ秒）に変更したので、画像が表示されるようになりました。

Plotly.plot('graph', [{ 
 
    x: ['1991-01-01', '1991-02-01', '1991-03-01'], 
 
    y: [1, 2, 3] 
 
}], { 
 
    images: [ 
 
    { 
 
    "source": "https://images.plot.ly/language-icons/api-home/python-logo.png", 
 
    "xref": "paper", 
 
    "yref": "paper", 
 
    "x": 0, 
 
    "y": 1, 
 
    "sizex": 0.2, 
 
    "sizey": 0.2, 
 
    "xanchor": "right", 
 
    "yanchor": "bottom" 
 
    }, 
 
    { 
 
    "source": "https://images.plot.ly/language-icons/api-home/js-logo.png", 
 
    "xref": "x", 
 
    "yref": "y", 
 
    "x": '1991-01-01', 
 
    "y": 2, 
 
    "sizex": 2*24*60*60*1000, 
 
    "sizey": 1, 
 
    "xanchor": "center", 
 
    "yanchor": "middle" 
 
    }, 
 
] 
 
})

<head> 
 
    <script src="https://cdn.plot.ly/plotly-latest.min.js"></script> 
 
</head> 
 
<body> 
 
    <div id="graph"></div> 
 
</body>

出典

2017-06-30 17:50:25 nsathyendra

特定の日付のplotly js画像マーカー

答えて

関連する問題