String formatiert Datum als X-Achse im gestapelten Bereich Diagramm

Question

Ich beziehe mich unten Code zum Erstellen von gestapelten Bereich Diagramm. HTML:

<style> 

#chart svg { 
    height: 400px; 
} 

</style> 
<div id="chart"> 
    <svg></svg> 
</div> 

Javascript:

nv.addGraph(function() { 
    var chart = nv.models.stackedAreaChart() 
       .x(function(d) { return d[0] }) 
       .y(function(d) { return d[1] }) 
       .clipEdge(true) 
       .useInteractiveGuideline(true) 
       ; 

    chart.xAxis 
     .showMaxMin(false) 
     .tickFormat(function(d) { return d3.time.format('%x')(new Date(d)) }); 

    chart.yAxis 
     .tickFormat(d3.format(',.2f')); 

    d3.select('#chart svg') 
    .datum(data) 
     .transition().duration(500).call(chart); 

    nv.utils.windowResize(chart.update); 

    return chart; 
}); 

JSON Daten

[ 
     { 
      "key" : "Test" , 
      "values" : [ 
      [ 1025409600000 , 23.041422681023] , 
      [ 1028088000000 , 19.854291255832] 
      ] 
     }, 
    ] 

Aber ich möchte Datum im String-Format setzen und nicht in Millisekunden.

[ 
     { 
      "key" : "Test" , 
      "values" : [ 
      [ "2016-11-25", 23.041422681023] , 
      [ "2016-11-26", 19.854291255832] 
      ] 
     }, 
] 

Wie kann ich biete dieses json-Format als Eingabe in Flächendiagramm. Wenn ich es anwende, wie sein Javascript Fehler der ungültigen Zahl wirft. Irgendeine Hilfe ?

Answer 1

Hier sind die Lösungen, die Sie verwenden können, um Ihr Problem

1. umrechnen Array von Datumszeichenfolge zu Millisekunden zu lösen, bevor er

2. Pass-Daten Diagramm, wie es aber eine Parsing-Funktion für x-Achsen schreiben wird Werte

   var chart = nv.models.stackedAreaChart() .x (function (d) {return ((new Date (d [0])). getTime())})

Hinweis: chart.xAxis.tickFormat() dient zum Generieren von Etiketten basierend auf Werten, die zum Zeichnen des Diagramms verwendet werden.