2016-07-25 4 views
0

Ich habe einige Diagramme erstellt, um Intra-Day-Daten aus finanziellen Ergebnissen zu plotten. Oft ist dies ein Wert, der alle zehn Minuten generiert wird. Dies variiert, aber es ist ein gutes Beispiel. Daher gibt es große Zeiträume, in denen ich keine Informationen bekomme, zB wenn die Märkte am Wochenende und zwischen 17:00 Uhr abends und 21:00 Uhr morgens geschlossen sind. Ich habe versucht, eine benutzerdefinierte Zeitskala für die X-Achse erstellt, aber am Ende ist das beste Ergebnis, nur eine Ordinalskala zu verwenden. Es funktioniert gut und gibt das Ergebnis, dass ich und die Leute, die das Diagramm lesen wollen, dh keine Lücken im Liniendiagramm und gleichmäßig platzierte Datenpunkte haben. (Es ist die Konvention)benutzerdefinierte Ticks auf einer Ordinalskala d3

Meine Frage ist, woher weiß ich Plot benutzerdefinierte Ticks auf dieser xAxis an der richtigen Stelle, vorausgesetzt, dass ich sie in einem Array namens ticks.major generieren. Das folgende Beispiel zeigt, wie ich die Achse erzeuge und es gibt die richtige Anzahl von Tagen. Aber sie werden alle am Anfang des Graphen gezeichnet. Jede Hilfe dankbar, danke.

var xScale = d3.scale.ordinal() 
    //var xScale = scaleWeekday()...custom timescale no longer used 
     .domain(xDomain) 
     .rangeBands([0,(plotWidth-yLabelOffset)]) 

var xAxis = d3.svg.axis() 
     .scale(xScale) 
     //.tickValues(ticks.major)//used to create tick d3 time scale axis 
     .tickFormat(function (d,i) { 
      return ticks.major[i] 
     }) 
     .tickSize(yOffset/2) 
     .orient("bottom"); 

var xLabel=plot.append("g") 
     .attr("class",media+"xAxis") 
     .attr("transform",function(){ 
      if(yAlign=="right") { 
       return "translate("+(margin.left)+","+(plotHeight+margin.top)+")" 
      } 
      else {return "translate("+(margin.left+yLabelOffset)+","+(plotHeight+margin.top)+")"} 
      }) 
     .call(xAxis); 

es sieht wie folgt aus: enter image description here

Antwort

0

Ich denke, der Fehler, den ich machen werde, ist, dass durch die tick.major Array mit seiner den Tick-Wert für die ersten 12 Tage, die Anwendung, die bacause das ist übergeben werden all das ist im tick.major Array. Da es im tick.majore-Array keine weiteren Daten mehr gibt, enthält es keine Labels für ein weiteres Datum in der Serie. Es ist besser, einen Test im tickFormetter anzuwenden, um zu sehen, ob sich der aktuelle Tag an einem bestimmten Datenpunkt von dem Tag am vorherigen Datenpunkt unterscheidet. Dann gib ein Häkchen zurück. wie dies

.tickFormat(function (d,i) { 
      if(i>0) { 
       var day=d.getDay() 
       var yesterday=data[i-1].date.getDay() 
       console.log(day,yesterday) 
       if(day!=yesterday) { 
        return d 
       } 
      } 
     }) 

Die zurück d ein bisschen Datumsformatierung muss es lesbar machen

Verwandte Themen