custom x-axis label formatting/rendering on charts

  • 2
  • Question
  • Updated 4 years ago
  • Answered
we really need the ability to control the 'step' interval and the formatting of the labels of the x-axis when using dates.  When using the 'week' granularity, the # isn't very helpful, and when using dates across a large timeframe, the labels wrap around instead of increasing the step size.  
Photo of Edward Taupier

Edward Taupier

  • 180 Points 100 badge 2x thumb
  • frustrated

Posted 4 years ago

  • 2
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
This will answer part of your question. 

The step interval, and some formatting of the lables in the x-axis can be controlled with a before render snippett.   Here is how. 

1. Create a In-line snippett that uses the hi-charts API to manipulate options.   Here is the snippet I created and named "chartFix" : 

var chartObj = arguments[0],
$ = skuid.$;

$.extend(true, chartObj.xAxis[0],{
labels: {
step: 2,
rotation: 300
}
});
2. In your chart,  go to the advanced tab and look for "Before Render Snippet"   add the name of your snippet here: 





This will simplify your lables and provide some more pleasing visual orientation. 



 
You have also asked to be able to control the date format for the charts.   This is not currently possible, but is on our to-do list.