Chart.js Радар цвет фона - PullRequest
Новая
       19

Chart.js Радар цвет фона

0 голосов
/ 13 ноября 2018

Кто-нибудь знал, возможно ли изменить фоновую область радара, как изображение, я постер? enter image description here

Ответы [ 2 ]

0 голосов
/ 19 ноября 2018

У меня была та же проблема, похоже, документация не подходит для этих случаев, я основал свое решение на следующих примерах:

Мой options объект выглядит так: 

options: {
    ...
    chartArea: { backgroundColor: 'red' },
    ...
}

Я использовал функцию ловушки beforeDraw, чтобы нарисовать цвет фона позади графика, и он выглядит следующим образом: 

Chart.pluginService.register({
    beforeDraw: chart => {
        const { ctx, scale, config } = chart
        const { xCenter, yCenter, drawingArea: radius } = scale

        ctx.save()
        ctx.arc(xCenter, yCenter, radius, 0, Math.PI * 2)
        ctx.fillStyle = config.options.chartArea.backgroundColor
        ctx.fill()
        ctx.restore()
    }
});

В функции beforeDraw вы можете поймать options объект с вашими пользовательскими атрибутами.

Вы можете проверить полный список крючков здесь

0 голосов
/ 13 ноября 2018

Я предполагаю, что вы используете этот модуль из библиотеки chart.js

https://www.chartjs.org/docs/latest/charts/radar.html

В документации сказано, что вы можете изменить цвет, указав его в свойствах наборов данных. 

data: {
    labels: ['Running', 'Swimming', 'Eating', 'Cycling'],
    datasets: [{
        data: [20, 10, 4, 2],
        backgroundColor: 'red'
    }]
}

Надеюсь, это поможет.

...