0

Javascript/Coffeescript newb はこちら。私は最近、コーヒースクリプトでハイチャートのデュアルメーターAPIをいじっています。ラベルのスタイル (つまり、色、フォント サイズ) を変更しようとしています。javascript を coffeescript に変換することで、highchart の Web サイト ( Highchart API Reference ) の例を見てきましたが、少し面倒な場合があります。以下の構文は間違っているようです。ラベルのスタイルを設定するための正しい構文は何かと思っていました。

コーヒースクリプト:

@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'`
4

1 に答える 1

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'
     }
    ]
于 2014-05-15T21:18:59.090 に答える