人力車上的X軸不斷重複本身

我正在使用Sinatra進行Dashing項目，並且我正在儀表板上顯示圖形。我在X軸上顯示時間戳時遇到了很多麻煩，現在我有這個工作，我還有一個問題。在我的圖形上，x軸不斷重複一遍又一遍的時間戳。我的意思是它沒有顯示任何以前的時間戳，它只是一遍又一遍地重複當前的時間戳，這不是我想要的。下面是我對圖形代碼：人力車上的X軸不斷重複本身

class Dashing.Graph extends Dashing.Widget 

    @accessor 'points', Dashing.AnimatedValue 

    @accessor 'current', -> 
    return @get('displayedValue') if @get('displayedValue') 
    points = @get('points') 
    if points 
     points[points.length - 1].y 

#ready is triggered when ever the page is loaded. 
    ready: -> 
    container = $(@node).parent() 
    # Gross hacks. Let's fix this. 
    width = (Dashing.widget_base_dimensions[0] * container.data("sizex")) + Dashing.widget_margins[0] * 2 * (container.data("sizex") - 1) 
    height = (Dashing.widget_base_dimensions[1] * container.data("sizey")) 
    @graph = new Rickshaw.Graph(
     element: @node 
     width: width 
     height: height 
     renderer: @get("graphtype") 
     series: [ 
     { 
     color: "#fff", 
     data: [{x:0, y:0}] 
     } 
     ] 
    ) 

    @graph.series[0].data = @get('points') if @get('points') 

    format = (d) -> 
     months = new Array(12) 
     months[0] = "Jan" 
     months[1] = "Feb" 
     months[2] = "Mar" 
     months[3] = "Apr" 
     months[4] = "May" 
     months[5] = "Jun" 
     months[6] = "Jul" 
     months[7] = "Aug" 
     months[8] = "Sep" 
     months[9] = "Oct" 
     months[10] = "Nov" 
     months[11] = "Dec" 
     today = new Date() 
     month = today.getMonth() 
     day = today.getDate() 
     h = today.getHours() 
     m = today.getMinutes() 

     if(m <= 9) 
     d = months[month] + " " + day + " " + h + ":" + 0 + m 
     else 
     d = months[month] + " " + day + " " + h + ":" + m 

    x_axis = new Rickshaw.Graph.Axis.X(graph: @graph,pixelsPerTick: 100, tickFormat: format) 

    y_axis = new Rickshaw.Graph.Axis.Y(graph: @graph, tickFormat: Rickshaw.Fixtures.Number.formatKMBT) 
    @graph.render() 

#onData is responsible for handling data sent from the jobs folder, 
#any send_event methods will trigger this function 
    onData: (data) -> 
    if @graph 
     @graph.series[0].data = data.points 
     @graph.render() 
     node = $(@node) 

     value = parseInt data.points[data.points.length - 1].y 
     cool = parseInt node.data "cool" 
     warm = parseInt node.data "warm" 
     level = switch 
     when value <= cool then 0 
     when value >= warm then 4 
     else 
      bucketSize = (warm - cool)/3 # Total # of colours in middle 
      Math.ceil (value - cool)/bucketSize 

     backgroundClass = "hotness#{level}" 
     lastClass = @get "lastClass" 
     node.toggleClass "#{lastClass} #{backgroundClass}" 
     @set "lastClass", backgroundClass

誰能幫我明白爲什麼我的圖不希望顯示X的任何先前值？

來源

2014-02-24 Joshi

我認爲你的問題是函數format中today = new Date()的調用。格式化程序正在獲取由Rickshaw/D3傳入的日期，該日期只需根據您的需要進行格式化即可。通過調用today = new Date()，您忽略了傳入的日期，而是提供您自己的/新的日期。

附註：你可以看看D3's date/time formatting或moment.js更簡單的日期/時間格式，所以你的format函數可以收縮爲1或2行代碼。

來源

2014-02-25 16:29:01 BjrnSmn

我嘗試了你的建議，它確實有效，但是時間設置爲Jan 01 1970 00:00:00，你知道是否有任何方法可以將此日期更改爲當前日期並仍然有效嗎？我所做的是我創建了我自己的timeUnit，並且做了我想做的事：''''timeFixture.units.push（'localMinute'，秒：60, formatter：（d） - > ＃ d = d3.time.day.offset（new Date（），0） d3.time.format（'％b％d％X'）（d） }）''' – Joshi

JavaScript的'Date'需要時間自1970-01-01以來以毫秒爲單位，Rickshaw/D3自1970-01-01以來一直使用Unix樣式的秒數。按比例縮放1000應解決問題 – BjrnSmn

人力車上的X軸不斷重複本身

回答

相關問題