2amigos/yii2-chartjs-widget

how to set options for line chart?

dd3v opened this issue · 2 comments

dd3v commented

Hello! Not work scales options. What am I doing wrong?

ChartJs::widget([
    'type' => 'line',
     'options' => [
         'height' => 70,
         'width' => 400,
         'scales' => [
             'yAxes' => [
                 'ticks' => [
                     'min' => 0
                 ]
             ],
             'xAxes' => [
                 'ticks' => [
                     'min' => 0
                 ]
             ]
     ]
], 'data' => []
tonydspaniard commented

More information here: http://www.chartjs.org/docs/#line-chart

ChartJs::widget(
    [
        'type' => 'line',
        'data' => [
            'labels' => ["January", "February", "March", "April", "May", "June", "July"],
            'datasets' => [
                [
                    'label' => "My First dataset",
                    'fill' => false,
                    'lineTension' => 0.1,
                    'backgroundColor' => "rgba(75,192,192,0.4)",
                    'borderColor' => "rgba(75,192,192,1)",
                    'borderCapStyle' => 'butt',
                    'borderDash' => [],
                    'data' => [65, 59, 80, 81, 56, 55, 40],
                    // ...
                ]
            ],
        ],
        'clientOptions' => [
            'scales' => [
                'yAxes' => [
                    'ticks' => [
                        'min' => 0
                    ]
                ],
                'xAxes' => [
                    'ticks' => ['min' => 0]
                ]
            ]
        ]
    ]
);
frontend-trends commented 
'clientOptions' => [
    'responsive' => true,
    'scales' => [
         'xAxes' => [[
              'gridLines' => [
                   'display' => false,
                   'color' => '#ffffff'
              ],
              'ticks' => [
                  'fontColor' => "#fff",
              ],
              'scaleLabel' => [
                   'display' => true,
                   'labelString' => 'Teilnahmen',
                   'fontColor' => '#fff',
              ],
         ]],
    ]
]

Regarding to http://www.chartjs.org/docs/latest/, under yAxes is an Array which contains a configuration object, see the snippet below. In Yii2 chart.js wrapper there are therefore two opening square brackets.

options: {
     scales: {
         yAxes: [{
             ticks: {
                 beginAtZero:true
             }
         }]
     }
}
  • 👍3