无法在Coffeescript的人力车图表上显示月份名称 [英] Not able to display Month names on Rickshaw Graph on Coffeescript
问题描述
我正在使用一个名为Dashing的基于Sinatra的框架的项目。我的项目的一部分是使用RickShaw Graph创建一个图形。我的问题是,我不能在X轴上显示月份名称和日期。我使用coffeescript来渲染这些值。下面是图形的代码:
I am working on a project using Sinatra based framework called Dashing. Part of my project is to create a graph using RickShaw Graph. My problem is that I am not able to display month names and dates on the X-Axis. I am using coffeescript to render these values. Here is the code for the graph:
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 :
From what I understood from the Rickshaw Graph API available here:
https://github.com/shutterstock/rickshaw/blob/master/src/js/Rickshaw.Fixtures.Time.js
它说你可以指定单位名称。所以对于这个实例我使用天只是为了测试的原因,但这似乎并不工作。
任何帮助将是伟大的。
it says that you can specify the unit name. So for this instance I used "day" just for testing reasons, but this doesnt seem to be working. Any help would be great.
推荐答案
您可以指定 timeFixture
x轴应该被标记。
You can specify a timeFixture
which drives how the ticks on the x-axis should be labelled.
var xAxis = new Rickshaw.Graph.Axis.Time( {
graph: graph,
timeFixture: new Rickshaw.Fixtures.Time.Local()
} );
灯具照顾显示的时间范围,并触发日期/时间格式,例如
The fixture takes care of the time range being displayed and triggers the appropriate level of detail fo the date/time formatting, e.g. zooming in from years to hours.
您还可以创建自己的时间夹具并将其设置在那里,查看Rickshaw.Fixtures.Time或Rickshaw.Fixtures .Time.Local
You could also create your own 'time fixture' and set it there, take a look at Rickshaw.Fixtures.Time or Rickshaw.Fixtures.Time.Local
或者,指定您始终想要显示的固定间距aka单位:
Alternatively, specify the fixed spacing aka 'unit's you always want to display:
var timeFixture = new Rickshaw.Fixtures.Time();
var unitHour = timeFixture.unit('hour');
var xAxis = new Rickshaw.Graph.Axis.Time( {
graph: graph,
timeUnit: unitHour,
timeFixture: timeFixture
} );
这篇关于无法在Coffeescript的人力车图表上显示月份名称的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!