在chartjs中混合Bar和Scatter时如何显示值

问题描述 投票:0回答:0

我想创建一个这样的图表:(https://i.stack.imgur.com/8qI5z.jpg) 但我无法在每个散点图旁边和每个条形图上方显示值。 我的代码:

    //   setup
    const data = {
        labels: ['A', 'B', 'C'],
        datasets: [{
            type: 'scatter',
            label: 'Count',
            data: [
                { x: 0, y: 30 },
                { x: 0, y: 50 },
                { x: 0, y: 40 }
            ],
            backgroundColor: 'blue'
        },

        {
            label: 'SumA',
            data: [50, 70, 60],
            backgroundColor: 'orange',
            border: 0
        },
        {
            label: 'SumB',
            data: [20, 40, 30],
            backgroundColor: 'yellow',
            border: 0
        },
        {
            label: 'SumC',
            data: [20, 40, 30],
            backgroundColor: 'green',
            border: 0
        }
        ]
    };

    //config
    const config1 = {
        type: 'bar',
        data,
        options: {
            scales: {
                x: {
                    beginAtZero: true
                },
                y: {
                    beginAtZero: true
                }
            }
        },
        plugins: {
            datalabels: {
                anchor: 'end',
                align: 'end',
                formatter: function(value, context) {
                    return value;
                }
            }
        }
    };

    // render init block
    const mychart = new Chart(document.getElementById('myChart'), config1);

我想在每个散点图旁边和每个条形图上方显示值。 我想在每个散点图旁边和每个条形图上方显示值

html chart.js
© www.soinside.com 2019 - 2024. All rights reserved.