score:1

Accepted answer

It turn out it's a bug, in case anyone else need the patch you can use I've done a pull request:

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

score:2

You could do the following:

  1. Define a function that converts epoch to a nice date. Something like this:

    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. Pass a content generator function for your tooltip to your chart (assuming you have useInteractiveGuideline enabled). You could browse the source code of NVD3 and copy/paste the default content generator and then modify it as you wish. Let's use the following one as an example:

    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;
    });
    

You can see it in action here: https://jsfiddle.net/Luc93/qf4u5439/

Good luck!


Related Query