Правильный синтаксис для стиля метки yAxis API старшей диаграммы в coffeescript?

Question

Javascript/Coffeescript newb здесь. Недавно я возился с двухметровым API-интерфейсом highcharts в coffeescript. Я пытаюсь изменить стиль ярлыков (например, цвет, размер шрифта). Я посмотрел примеры на веб-сайте highchart ( Highchart API Reference), переводя javascript в coffeescript, может быть немного привередливым. Синтаксис ниже, кажется, является неправильным, и мне просто интересно, каков правильный синтаксис для стилевых меток.

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

Я не использовал HighCharts, но могу помочь с синтаксисом Coffeescript.

CSS-объект из документов, на которые вы ссылаетесь, будет выглядеть следующим образом в Coffee:

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

Массив yAxis, который вы разместили, не должен иметь эту первую фигурную скобку и нуждается в последней квадратной скобке. Это должно выглядеть так:

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'
]

Это даст вам массив с объектом внутри.

Если вам нужен массив с несколькими объектами, вы можете использовать это:

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'
     }
    ]