Rickshaw Graph 上的 X 轴不断重复

Question

我正在使用 Sinatra 开发一个 Dashing 项目，并且我正在仪表板上显示图表。我在 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 值？

Answer 1

我认为您的问题是在函数format 中调用today = new Date()。格式化程序正在获取 Rickshaw/D3 传入的日期，该日期只需要根据您的需要进行格式化。通过调用today = new Date()，您将忽略传入的日期，而是提供您自己/新的日期。

附注：您可以查看D3's date/time formatting 或moment.js 以获得更简单的日期/时间格式，因此您的format 函数可以缩减为1 或2 行代码。