Correct syntax for highchart API yAxis label style in coffeescript?

Question

Javascript/Coffeescript newb here. I have recently been fiddling with a highcharts dual meter api in coffeescript. I'm trying to change change the style of my labels (i.e. color, font-size). I've looked at examples in the highchart website (Highchart API Reference) by translating javascript to coffeescript can be a bit finicky. The syntax below appears to be incorrect and I was just wondering what's the correct syntax for styling labels.

Coffeescript:

@chart = undefined labels = {0: '0s', 5: '0.5s', 10: '1s', 15: '10s', 20: '20s'}

.

yAxis: [{
      min: 0
      max: 20
      minorTickPosition: 'outside'
      tickPosition: 'outside'
      minorTickLength: 13
      tickLength: 15

      labels: 
        enabled: true
        formatter: -> labels[@value]`
        style:
          'font-size': '20px'
          'color': '#00ff00'`

Answer 1

I haven't used HighCharts, but I can help with Coffeescript syntax.

The CSS object from the docs you linked to would look like this in Coffee:

style =
  color: '#6D869F'
  fontWeight: 'bold'

The yAxis array you posted shouldn't have that first curly bracket and needs the last square brack. It should look like this:

yAxis: [
  min: 0
  max: 20
  minorTickPosition: 'outside'
  tickPosition: 'outside'
  minorTickLength: 13
  tickLength: 15
  labels: 
    enabled: true
    formatter: -> labels[@value]
    style:
      'font-size': '20px'
      'color': '#00ff00'
]

That will give you an array with an object inside.

If you need an array with multiple objects you can use this:

yAxis: [
      {
      min: 0
      max: 20
      minorTickPosition: 'outside'
      tickPosition: 'outside'
      minorTickLength: 13
      tickLength: 15
      labels: 
        enabled: true
        formatter: -> labels[@value]
        style:
          'font-size': '20px'
          'color': '#00ff00'
     }
     {
      min: 0
      max: 20
      minorTickPosition: 'outside'
      tickPosition: 'outside'
      minorTickLength: 13
      tickLength: 15
      labels: 
        enabled: true
        formatter: -> labels[@value]
        style:
          'font-size': '20px'
          'color': '#00ff00'
     }
    ]