NVD3：シリーズのマルチチャートの間違ったフォーマット

Question

NVD3マルチチャートモデルを使用してチャートを作成しています。私は4シリーズ、左側のyAxisに関連付けられた3つのバー、右側のyAxisに関連付けられた1つのラインを持っています。

3つのバーは、単にフロート値を持ちます。ここでは、ラインにはパーセンスがあります。 すべて正常に動作しますが、ツールチップに何かがあります。日付が正しく書式設定されていない（まったくフォーマットされていません）。

私は底に同じ日付の書式を設定することができますか？

1458428400 -> 20-03-16 

おかげ

Answer 1

それは、それはバグです判明した場合には他の誰が、私はプル要求やったあなたが使用できるパッチが必要になります。

https://github.com/novus/nvd3/issues/1406

を

Answer 2

次の操作を行うことができます：

1. は素敵な日にエポックを変換する関数を定義します。このような何か：

   function epochToNiceDate(epoch) { 
       var date = new Date(0); 
       date.setUTCSeconds(epoch); 
       var day = date.getDate(); 
       var month = date.getMonth() + 1; 
       var year = date.getFullYear(); 
       return day + "-" + month + "-" + year; 
   } 
   

2. はあなたのチャートをごツールチップのコンテンツジェネレータ関数を渡します（useInteractiveGuidelineが有効あなたが持っていると仮定）。 NVD3のソースコードを参照し、デフォルトのコンテンツジェネレータをコピー/ペーストして、必要に応じて変更することができます。のは、一例として、次のいずれかを使用してみましょう：

   chart.interactiveLayer.tooltip.contentGenerator(function (d) { 
       var tooltipTitle = epochToNiceDate(d.value); 
       var tooltip = ""; 
   
       tooltip += "<table>"; 
       tooltip += "<thead>"; 
       tooltip += "<tr><td colspan='3'><strong class='x-value'>" + tooltipTitle + "</strong></td></tr>"; 
       tooltip += "</thead>"; 
       tooltip += "<tbody>" 
   
       for(var i in d.series) { 
        var currentSeries = d.series[i]; 
        var color = currentSeries.color; 
        var key = currentSeries.key; 
        var value = currentSeries.value; 
   
        tooltip += "<tr>"; 
        tooltip += " <td class='legend-color-guide'>"; 
        tooltip += "  <div style='background-color: " + color + ";'></div>"; 
        tooltip += " </td>"; 
        tooltip += " <td class='key'>" + key + "</td>"; 
        tooltip += " <td class='value'>" + value + "</td>"; 
        tooltip += "</tr>"; 
       } 
   
       tooltip += "</tbody>"; 
       tooltip += "</table>"; 
   
       return tooltip; 
   }); 
   

あなたがここにアクションでそれを見ることができます：https://jsfiddle.net/Luc93/qf4u5439/

幸運を！