0

我正在使用 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 值？

4

1 回答 1

0

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

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

于 2014-02-25T16:29:01.253 回答