0

このグラフのフォント サイズと境界線の色を変更したいと考えています。したがって、方法がわかりません。これらのオプションを別の場所に配置しようとしましたが、何も機能しないようです。angular-chart オプションと Chart.js オプションの間のバインディングのロジックを取得できません。それらを操作する一般的な方法はありますか?

ディレクティブは次のとおりです。

                <canvas class="chart chart-line" chart-y-axes="axes" chart-data="data" chart-labels="labels"
                        chart-series="series" chart-options="options" chart-legend="true" chart-colours="colours"></canvas>

スコープの定義は次のとおりです。

$scope.labels = ["January", "February", "March", "April", "May", "June", "July"];
        $scope.series = ['Series A', 'Series B'];
        $scope.axes = ["y-axis-1", "y-axis-2"];
        $scope.data = [
            [65, 59, 80, 81, 56, 55, 40],
            [28, 48, 40, 19, 86, 27, 90]
        ];
        $scope.colours = [{
            fillColor: 'rgba(151,187,205,0.2)',
            strokeColor: 'rgba(151,187,205,1)',
            pointColor: 'rgba(151,187,205,1)',
            pointStrokeColor: '#fff',
            pointHighlightFill: '#fff',
            pointHighlightStroke: 'rgba(151,187,205,0.8)'
        }]
        $scope.options = {
            datasetFill: false,
            showLines: true,
            elements:
            {
                line:
                {
                    fill: false,
                    tension: 0.0001
                },
                point:
                {
                    radius: 0
                }
            },
            scales:
            {
                yAxes: [
                    {
                        type:"linear",
                        id:$scope.axes[0],
                        gridLines:
                        {
                            display: false
                        }
                    },
                    {
                        type:"linear",
                        id:$scope.axes[1],
                        position: "right",
                        gridLines:
                        {
                            display: false
                        },
                        scaleLabel:
                        {
                            display: true
                        }
                    }]
            },
        };

色を変えるchart-colorsだけではうまくいきません。

4

2 に答える 2

1

オプションを見ると、chart.js 2.0 を使用しているため、最新の angular-chart.js を使用する必要があります。

属性が chart-colors になり、chart.js 2.0 で color プロパティが変更されたことに注意してください。

于 2016-05-08T22:08:22.093 に答える