我正在使用一个基于Sinatra的框架Dashing进行项目。我的项目的一部分是使用RickShaw Graph创建一个图形。我的问题是我无法在X轴上显示月份名称和日期。我正在使用coffeescript渲染这些值。这是图形的代码:
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')
time = new Rickshaw.Fixtures.Time()
days = time.unit("day")
x_axis = new Rickshaw.Graph.Axis.Time(
graph: @graph
timeUnit: days
)
y_axis = new Rickshaw.Graph.Axis.Y(graph: @graph, tickFormat: Rickshaw.Fixtures.Number.formatKMBT)
@graph.render()
根据我对Rickshaw Graph API的了解,这里:
https://github.com/shutterstock/rickshaw/blob/master/src/js/Rickshaw.Fixtures.Time.js
它说您可以指定单位名称。因此,在本例中,出于测试原因,我使用了“ day”,但这似乎不起作用。
任何帮助都会很棒。
最佳答案
您可以指定timeFixture
来驱动应如何标记x轴上的刻度线。
var xAxis = new Rickshaw.Graph.Axis.Time( {
graph: graph,
timeFixture: new Rickshaw.Fixtures.Time.Local()
} );
固定装置负责显示的时间范围,并触发日期/时间格式的适当详细程度,例如从几年放大到几小时。
您还可以创建自己的“时间装置”并将其设置在此处,看看Rickshaw.Fixtures.Time或Rickshaw.Fixtures.Time.Local
或者,指定您总是要显示的固定间距(也称为“单位”):
var timeFixture = new Rickshaw.Fixtures.Time();
var unitHour = timeFixture.unit('hour');
var xAxis = new Rickshaw.Graph.Axis.Time( {
graph: graph,
timeUnit: unitHour,
timeFixture: timeFixture
} );
关于javascript - 无法在Coffeescript的人力车图上显示月份名称,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/21765960/