カスタムホバーテキスト、単数形/複数形（plotly.js）

Question

散布図を作成しています。

私のX軸は日付を表し、Y軸は与えられた応答の数を表します。

マウスホバリング、私はどちらかの表示したい：

• 1応答 OR
• N応答

私はカスタムホバリングとは何かであると仮定することができますが、トレースまたはY軸のhoverinfoプロパティでそれを行う方法を確認してください。

Answer 1

トレースにtext属性を使用する必要があります。

https://jsfiddle.net/abalter/n54k9zzj/

var data = 
[ 
    {x: "2015-05-01", y: 5}, 
    {x: "2015-05-02", y: 10}, 
    {x: "2015-05-03", y: 0}, 
    {x: "2015-05-04", y: 1} 
]; 

var x = []; 
var y = []; 
var text = []; 
data.forEach(function(item, index) 
{ 
    x.push(item.x); 
    y.push(item.y); 
    if (item.y == 0) 
    { 
    text.push("No responses"); 
    } 
    else if (item.y == 1) 
    { 
    text.push("1 reponse"); 
    } 
    else 
    { 
    text.push(item.y + " responses"); 
    } 
}); 

var trace = 
{ 
    x: x, 
    y: y, 
    text: text, 
    hoverinfo: "text", 
    mode: "markers", 
    name: "Responses" 
} 

var yaxis = 
{ 
    title: "Responses" 
} 

var xaxis = 
{ 
    type: "date" 
} 

var layout = 
{ 
    xaxis: xaxis, 
    yaxis: yaxis 
} 

Plotly.plot 
(
    "graph", 
    [trace], 
    layout 
);