如何修复 Chart.js 气泡内部填充问题

Question

How to fix this? chart.js 3.5.0

with small radius there are no padding

如何删除聊天内部情节填充？它显示当我有大泡泡半径时。

我尝试在 chart.js 文档和堆栈溢出中搜索，但没有找到解决方案 不幸的是，关于气泡图的 Chart JS 文档也严重缺乏。

     options: {
                    animation: false,
                    onClick: (e, i) => {
                        if (i.length) {
                            const bubbleSelected = i[0];
                            wordsTopic = `Topic${bubbleSelected.datasetIndex + 1}`
                            aBarCh.changeCanvas({data:groupDataByTopics(JSONDATA),topic:wordsTopic})
                        } else {
                            wordsTopic = `Default`
                            aBarCh.changeCanvas({data:groupDataByTopics(JSONDATA),topic:wordsTopic})
                        }
                    },
                    onHover: (e, i) => {
                        if (i.length) {
                            const bubbleSelected = i[0];
                            if(wordsTopic !== `Topic${bubbleSelected.datasetIndex + 1}`){
                                aBarCh.changeCanvas({data:groupDataByTopics(JSONDATA),topic:`Topic${bubbleSelected.datasetIndex + 1}`})
                            }
                        } else {
                            aBarCh.changeCanvas({data:groupDataByTopics(JSONDATA),topic:wordsTopic})
                        }
                    },
                    aspectRatio: 1,
                    layout: {
                        padding: 0
                    },
                    layout: {
                        padding: 0
                    },
                    plugins: {
                        legend: {
                            display: false,
                        },
                        title: {
                            display: false,
                        },
                    },
                    scales: {
                        x: {
                            min: -0.25,
                            max: 0.25,
                            suggestedMin:-0.25,
                            suggestedMax:0.25,
                            ticks: {
                                color: '#fff',
                                padding: 0,
                            },
                            grid: {
                                borderColor: 'rgba(255, 255, 255, 0.2)',
                                color: function (context) {
                                    if (context.tick.value !== 0) {
                                        return 'transparent';
                                    }
                                    return 'rgba(78, 99, 102, 1)';
                                },
                            }
                        },
                        y: {
                            min: -0.25,
                            max: 0.25,
                            suggestedMin:-0.25,
                            suggestedMax:0.25,
                            ticks: {
                                color: '#fff',
                                padding: 0
                            },
                            grid: {
                                borderColor: 'rgba(255, 255, 255, 0.2)',
                                color: function (context) {
                                    if (context.tick.value !== 0) {
                                        return 'transparent';
                                    }
                                    return 'rgba(78, 99, 102, 1)';
                                },
                            }
                        }
                    }
                },

Answer 1

您找到解决方案了吗？我遇到了同样的问题，将此配置添加到图表的选项中解决了我的问题：

layout: {
  autoPadding: false,
},