2017-07-14 87 views
0

當與Plotly一起使用Scatter圖時,我無法獲得懸停文本,當我有多個標記具有相同的x軸值時。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

您可能正在尋找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>

+0

太謝謝你了。這正是我所期待的。 – Ankit