这就是我到目前为止所拥有的......
Plotly.plot('graph', [{
type: 'bar',
y: [1,0,0],
x: [1,2,1],
orientation: 'h',
base: [0,2,5]
}, {
type: 'bar',
y: [1,1,1],
x: [2,1,2],
orientation: 'h',
base: [0,3,5]
}])<head>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<div id="graph"></div>
</body>如何在水平轴上使用日期而不是数值？
最佳答案
时间线终于创建了! Codepen.io 链接:https://codepen.io/elv1s42/pen/bKVEJb
与大家分享，以备不时之需:
var layout = {
height: 300,
yaxis: {
showgrid: false,
zeroline: false,
showline: false,
showticklabels: false
}
};
Plotly.plot('graph', [{
x: ['2017-11-04 22:23:00', '2017-11-04 22:24:00'],
y: [1, 1],
type: 'scatter',
opacity: 0.5,
line: { color: 'red', width: 20 },
mode: 'lines',
name: 'First event'
},{
x: ['2017-11-04 22:24:00', '2017-11-04 22:24:30'],
y: [1, 1],
type: 'scatter',
opacity: 0.5,
line: { color: 'green', width: 20 },
mode: 'lines',
name: 'Second event'
},{
x: ['2017-11-04 22:25:00', '2017-11-04 22:26:00'],
y: [1, 1],
type: 'scatter',
opacity: 0.5,
line: { color: 'yellow', width: 20 },
mode: 'lines',
name: 'Third event'
}], layout) <head>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<div id="graph"></div>
</body>关于javascript - Plotly:创建水平时间线，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44133677/