Plotly x轴悬停文本问题

时间:2017-07-14 11:12:09

标签: javascript plotly scatter-plot mousehover

当使用带有Plotly的散点图时,当我有多个具有相同x轴值的标记时,我无法获得悬停文本。

有人可以帮我解决这个问题吗?

或者这是一个错误的错误?

检查最接近该线的标记。

代码在这里https://jsfiddle.net/qjdt92h2/

var trace1 = {
  x: [13.5, 12, 13, 14,13],
  y: [15, 17, 13.6, 17,18],
  text: ['4.17 below the mean', '4.17 below the mean', '0.17 below the mean', '0.17 below the mean', '0.83 above the mean', '7.83 above the mean'],
  mode: 'markers',
  name: 'Grade / Mean grade',
  marker:{
  color: 'rgb(255, 99, 132)'
  }


};

var trace2 = {
  x: [0, 20],
  y: [0, 20],
  mode: 'lines',
  name: 'Guide line',
   marker:{
  color: '#023587'
  }
};


var data = [ trace1, trace2];

var layout = {
  title:'Line and Scatter Plot'
};

Plotly.newPlot('myDiv', data, layout);

1 个答案:

答案 0 :(得分:1)

您可能正在寻找hovermode,在您的情况下应该设置为closest

var trace1 = {
  x: [13.5, 12, 13, 14, 13],
  y: [15, 17, 13.6, 17, 18],
  text: ['4.17 below the mean', '4.17 below the mean', '0.17 below the mean', '0.17 below the mean', '0.83 above the mean', '7.83 above the mean'],
  mode: 'markers',
  name: 'Grade / Mean grade',
  marker: {color: 'rgb(255, 99, 132)'}
 };

var trace2 = {
  x: [0, 20],
  y: [0, 20],
  mode: 'lines',
  name: 'Guide line',
  marker:{color: '#023587'}
};


var data = [trace1, trace2];
var layout = {
  title:'Line and Scatter Plot',
  hovermode: 'closest'
};

Plotly.newPlot('myDiv', data, layout);
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<div id="myDiv"></div>