如何在plotly.js中设置模式栏?

时间:2019-05-09 01:06:27

标签: plotly.js

当我使用plotly.js时,模式栏太大,以至于它覆盖了绘图。我发现原因是它与forna.js(https://github.com/ViennaRNA/fornac)冲突。我不确定如何解决。 原始代码是

var graphDiv = document.getElementById('seq');

	   Plotly.newPlot(graphDiv, [{
		  mode: 'markers',
		  marker: {
		    size: 20
		  },
		  y: [1, 2, 1],
		  hoverinfo: 'none'
		}])
		.then(gd => {
		  gd.on('plotly_hover', d => console.log(d))
		})
#seq {
    flex-grow: 1;
flex-direction: column;
} 
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link type="text/css" href="JS/FornaContainer/fornac.css" rel="stylesheet">
 

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
 
<script src="https://cdn.plot.ly/plotly-1.5.0.min.js"></script>
<script type='text/javascript' src="JS/FornaContainer/fornac.js"></script>

<div id="seq"> </div>

结果图为modebar covers the plot

0 个答案:

没有答案