Как установить дополнительные параметры для Chart.js BarCharts, используя React-Chartkick - PullRequest
Новая
       27

Как установить дополнительные параметры для Chart.js BarCharts, используя React-Chartkick

0 голосов
/ 05 июня 2019

Я пытаюсь отобразить диаграмму, используя React-Chartkick и Chart.js, и я хочу настроить цвета полос.В настоящее время я могу установить все столбцы одинакового цвета, передавая опору следующим образом: <BarChart colours={["#fff"]} />.

Используя LineCharts в React-Chartkick, вы можете устанавливать цвета линий, передавая массивцветов через эту опору.Однако BarCharts, похоже, принимает только первый цвет.Это ограничение React-Chartkick, или я делаю что-то не так?

Я пробовал передавать опции (как описано здесь: https://www.chartjs.org/docs/latest/charts/bar.html#styling) через опору library, так какЯ настроил цвета осей и меток, но это не влияет на столбцы.

Вот мой текущий код: 

    state = {
        chartLibraryOptions: {
            borderColor: "#e34402", // does nothing here
            backgroundColor: "#e34402", // nor this
            scales: {
                yAxes: [
                    {
                        ticks: { fontColor: "#fff", autoSkip: false }
                    }
                ],
                xAxes: [
                    {
                        ticks: { fontColor: "#fff" }
                    }
                ]
            }
        }
    };

    render() {
        return (
            <BarChart
                data={this.state.chartData}
                library={this.state.chartLibraryOptions}
                colors={["#e34402", "#e3b502"]} // All bars are the first colour
            />
        );
    }

Я ожидаю, что смогуизменить цвета каждой полосы, но после всего этого я не уверен, возможно ли это через Chartkick?

...