3

I'm trying out the Dashing framework for a dashboard project and I'm trying to use rickshaw.js to draw graph for the dashboard. I've customised the labels so they have exactly what I want, but unfortunately the text seems to be stacked together. I've been trying to use tickTransformation like what I found here, but it doesn't seem to work. Here's what I currently have (note this is coffeescript, not javascript.

@graph = new Rickshaw.Graph(
element: @node
width: width
height: height
renderer: @get("graphtype")
series: [
  {
  color: "#fff",
  data: [{x:0, y:0}]
  }
]
  )
x_axis = new Rickshaw.Graph.Axis.X(
  graph: @graph
  tickFormat: Rickshaw.Fixtures.Number.myXFormat
  tickTransform: (svg) ->
    svg.style("text-anchor", "start")
    .attr("transform", "rotate(-90)")
)
y_axis = new Rickshaw.Graph.Axis.Y(
  graph: @graph
  tickFormat: Rickshaw.Fixtures.Number.myYFormat
  tickTransform: (svg) ->
    svg.style("text-anchor", "start")
      .attr("transform", "rotate(-90)")
@graph.render()

It just ends up looking like this:

enter image description here

Taylan Aydinli
  • 4,333
  • 15
  • 39
  • 33

1 Answers1

0

I think you wanted to use tickTransformation instead of tickTransform.

musically_ut
  • 34,028
  • 8
  • 94
  • 106