Диаграмма. js разные оси у в зависимости от графика из опций выбора - PullRequest
0 голосов
/ 14 января 2020

Я пытаюсь отобразить другую ось y на основе нового набора json данных, которые передаются из опций выбора при их нажатии.

Это мой код:

var chartOptions = {
    scales: {
        xAxes: [{
            ticks: {
                display: true,
                autoSkip: true,
                maxTicksLimit: 25
            }
        }],
        yAxes: [{
            ticks: {
                beginAtZero: false,
                // Return an empty string to draw the tick line but hide the tick label
                // Return `null` or `undefined` to hide the tick line entirely
                userCallback: function (value, index, values) {


                    if (KpiName === "sales_growth_ytd") 
                    {
                        return value + '%';
                    }
                    else {

                        value = value.toString();
                        value = value.split(/(?=(?:...)*$)/);
                        // console.log($scope.selects);

                        for(var i = 0; i < $scope.selects.length; i++)
                        {

                              if($scope.selects[i].country_name === "Eire")
                            {
                                console.log($scope.selects[i].country_name);
                                return '€' + value;
                            }
                        }

                        for(var i = 0; i < $scope.selects.length; i++)
                        {

                            if($scope.selects[i].country_name === "UK")
                            {
                                console.log($scope.selects[i].country_name);
                                return '£' + value;
                            }
                        }
                    }
                }
            }
        }]
    },
    responsive: true,
    options: {
        legend: {
            labels: {
                // This more specific font property overrides the global property
                fontSize: 15,
                fontStyle: 'bold',
            },
            animation: {
                duration: 1 // general animation time
            },
            hover: {
                animationDuration: 0 // duration of animations when hovering an item
            },
            responsiveAnimationDuration: 0, // animation duration after a resize
            elements: {
                line: {
                    tension: 0 // disables bezier curves
                }
            },
        }
    }
};

В зависимости от страны, в которой осуществляется выбор, например, Великобритания или EIRE, я хотел бы отобразить значение со знаком £ или € ось Y.

Как бы я это сделал?

Спасибо

1 Ответ

0 голосов
/ 14 января 2020

userCallback работает для каждого тика. В вашем коде вы возвращаете значение, когда название страны в $scope.selects любого значения совпадает с 'Eire' или 'UK' .. Это то, что вы хотите?

Я не знаю достаточно о ваших данных, но если country_name зависит от набора данных, а не от каждой точки данных, вы можете создать переменную префикса валюты вне userCallback и добавить ее в значения тиков:

// Load dataset
// set currency prefix based on the data
...
userCallback: function (value, index, values) {
    if (KpiName === "sales_growth_ytd") 
    {
        return value + '%';
    }
    else {
        return currency_prefix + value;
    }
}
...