Javascript c3.js散点图轴未缩放以调整点半径

我创建了一个c3散点图，根据数据生成不同大小的点。如果图形最左侧或最右侧附近的点相对较大，则该点不会包含在图形中，部分点会被截断。如果我添加了静态填充，图形就不能针对不同的情况进行适当的缩放，有时填充太多或太少。有没有办法通过动态生成填充来包含图形中的点

代码：

函数getChart（gridData）{
变量颜色=['#b2182b'、'#d6604d'、'#f4a582'、'#fddbc7'、'#f7f7f7'、'#d1e5f0'、'#92c5de'、'4393c3'、'#4392c3'、'2166ac'；
var列=[]；
var mySize={}；
var mySizeArray=[]；
var myXs={}；
var myNames=[]；
var-myPointColors；
MyPointColor={}；
变量点大小；
var newData=extractPointsFromGrid（gridData）；
pointSize=函数（sizeVal，sizeVal）{
var发生率=sizeVal；
var最小发生率=d3.MIN（大小）；
var MAX_关联度=d3.MAX（大小）；
变量qtl3=d3.平均值（大小）；
//无检查超复数运算表达式JS
var s=（（发生率-最小发生率）*（50-10））/（最大发生率-最小发生率）+3；
返回（s+数学层（qtl3）>3）？s+数学层（qtl3）：3；
};
var bubbleSizes=函数（大小）{
变量_size=typeof size==“对象”？大小：[]；
var len=（typeof _size=='object'）？size.length:0；
var SizeArray=u.pull（_size，'iCumulative'）；
var reacsArray=u.pull（_大小，'reac'）；
var newSizes=[]；
_大小。forEach（函数（大小）{
var newSize=点大小（Math.abs（size.iCumulative），SizeArray）；
push（{'reac'：size.reac，'size'：newSize}）；
});
window.size=新闻大小；
返回消息；
};
var myNameIndex=[]；
var mypointsize=[]；
var i=0；
var myColors=bubbleColors.reverse（）；
var myPts=气泡大小（newData）；
var dynamicadding=adddynamicadding（myPts，newData）；
newData.forEach（函数（d）{
var name=d.reac；
var myRor=[d.reac]；
var myPs=[d.reac+“_主要嫌疑犯”]；
推镜（d.ROR）；
myPs.push（d.PS）；
myNames.push（d.reac）；
myNameIndex[i]=d.reac；
myPointColors[d.reac]=myColors[i]；
列。推送（myRor）；
列。推送（myPs）；
myXs[myRor[0]]=myPs[0]；
mySize[d.reac]=d.iCumulative；
myNameIndex[d.reac]=d.PS；
mypointsize.push={'reac'：d.reac，'size'：d.iCumulative}；
i++；
});
var图表=c3.0({
bindto:“#RX信号图气泡”，
尺寸：{
身高：200
},
数据：{
xs:myXs，
列：列，
键入：“散布”，
颜色：MyPointColor
},
轴线：{
x:{
标签：“主要可疑案件”，
勾选：{
拟合：假
},
//填充：{top:200，left:0，right:0，bottom:0}
},
y:{
标签：“ROR”，
勾选：{
fit:false，
格式：函数（d）{
返回值（d<0）？“”：d；
}
},
//填充：{顶部：5，左侧：5，右侧：100，底部：5}
}
},
要点：{
r：功能（d）{
pointSize=389; where（myPts，{reac:d.id}）[0]；
返回pointSize.size；
},
重点：{
扩展：{
启用：false，
r：功能（d）{
返回d.r；
}
}
}
},
工具提示：{
格式：{
标题：职能（d）{
返回false；
},
名称：函数（名称）{
返回名称；
},
值：函数（值、比率、id、大小、x）{
var numFormat=d3.format（'，'）；
var decFormat=d3.format（'.'）；
var pctgFormat=d3.format（'.4p'）；
返回“主要可疑案例”+numFormat（myNameIndex[id]）+“”++“ROR”+numFormat（value）+“”；
}
}
}
});
var getPaddingChange=函数（图表）{
变量变化={
排名：0，
左:0,，
右:0,，
底部：0
};
var m=chart.internal.main.node（）.parentNode.getBoundingClientRect（）；
//图表区域通过此变换移动-因此我们需要按此量调整点坐标
var t=d3.transform（chart.internal.main.attr（“transform”））.translate；
//循环通过每个点
chart.internal.main.selectAll（'.'+c3.chart.internal.fn.CLASS.circle）。每个（函数（）{
var c=this.getBBox（）；
//左剪辑
如果（c.x<-t[0]）
change.left=Math.max（change.left，-（c.x+t[0]）；
//右剪辑
如果（（c.x+c.width）>（m.width-t[0]））
change.right=Math.max（change.right，（c.x+c.width）-（m.width-t[0]）；
//顶部剪辑
如果（c.y<-t[1]）
change.top=Math.max（change.top，-（c.y+t[1]）；
//底部剪辑
如果（（c.y+c.height）>（m.height-t[1]））
change.bottom=Math.max（change.bottom，（c.y+c.height）-（m.height-t[1]）；
})
回报变化；
}
var变更=getPaddingChange（图表）；
chart.internal.config.padding_top=chart.internal.getCurrentPaddingTop（）+change.top；
chart.internal.config.padding\u bottom=chart.internal.getCurr
function getChart(gridData) {

    var colors = ['#b2182b', '#d6604d', '#f4a582', '#fddbc7', '#f7f7f7', '#d1e5f0', '#92c5de', '#4393c3', '#4392c3', '#2166ac'];
    var columns = [];
    var mySize = {};
    var mySizeArray = [];
    var myXs = {};
    var myNames = [];
    var myPointColors;
    myPointColors = {};
    var pointSize;
    var newData = extractPointsFromGrid(gridData);

    pointSize = function (sizeVal, sizes) {
        var Incidence = sizeVal;
        var MIN_incidence = d3.min(sizes);
        var MAX_incidence = d3.max(sizes);
        var qtl3 = d3.mean(sizes);

        //noinspection OverlyComplexArithmeticExpressionJS
        var s = ((Incidence - MIN_incidence) * (50 - 10)) / (MAX_incidence - MIN_incidence) + 3;

        return (s + Math.floor(qtl3) > 3) ? s + Math.floor(qtl3) : 3;
    };

    var bubbleSizes = function (sizes) {
        var _sizes = typeof sizes === 'object' ? sizes : [];
        var len = (typeof _sizes === 'object') ? sizes.length : 0;

        var sizesArray = _.pluck(_sizes, 'iCumulative');

        var reacsArray = _.pluck(_sizes, 'reac');
        var newSizes = [];
        _sizes.forEach(function (size) {

            var newSize = pointSize(Math.abs(size.iCumulative), sizesArray);
            newSizes.push({'reac': size.reac, 'size': newSize});
        });
        window.sizes = newSizes;
        return newSizes;
    };

    var myNameIndex = [];
    var myPointSizes = [];
    var i = 0;

    var myColors = bubbleColors.reverse();
    var myPts = bubbleSizes(newData);
    var dynamicPadding = addDynamicPadding(myPts, newData);

    newData.forEach(function (d) {
        var name = d.reac;
        var myRor = [d.reac];
        var myPs = [d.reac + "_Primary Suspect"];

        myRor.push(d.ROR);
        myPs.push(d.PS);
        myNames.push(d.reac);
        myNameIndex[i] = d.reac;
        myPointColors[d.reac] = myColors[i];

        columns.push(myRor);
        columns.push(myPs);
        myXs[myRor[0]] = myPs[0];
        mySize[d.reac] = d.iCumulative;
        myNameIndex[d.reac] = d.PS;
        myPointSizes.push = {'reac': d.reac, 'size': d.iCumulative};

        i++;
    });

    var chart = c3.generate({
        bindto: '#rxsignal-chart-bubble',
        size: {
            height: 200
        },
        data: {
            xs: myXs,
            columns: columns,
            type: 'scatter',
            colors: myPointColors
        },
        axis: {
            x: {
                label: 'Primary Suspect Cases',
                tick: {
                    fit: false
                },
                // padding: {top: 200, left: 0, right: 0, bottom: 0}
            },
            y: {
                label: 'ROR',
                tick: {
                    fit: false,
                    format: function (d) {
                        return (d < 0) ? '' : d;
                    }
                },
                // padding: {top: 5, left: 5, right: 100, bottom: 5}
            }
        },
        point: {
            r: function (d) {
                pointSize = _.where(myPts, {reac: d.id})[0];
                return pointSize.size;
            },
            focus: {
                expand: {
                    enabled: false,
                    r: function (d) {
                        return d.r;
                    }
                }

            }
        },
        tooltip: {

            format: {
                title: function (d) {

                    return false;

                },
                name: function (name) {
                    return name;
                },
                value: function (value, ratio, id, size, x) {

                    var numFormat = d3.format(',');
                    var decFormat = d3.format('.');
                    var pctgFormat = d3.format('.4p');

                    return '<tr colspan="2"><td>Primary Suspect Cases</td><td>' + numFormat(myNameIndex[id]) + '</td></tr>' + '<tr><td>ROR</td><td>' + numFormat(value) + '</td></tr>';

                }
            }
        }
    });

    var getPaddingChange = function (chart) {
        var change = {
            top: 0,
            left: 0,
            right: 0,
            bottom: 0
        };

        var m = chart.internal.main.node().parentNode.getBoundingClientRect();
        // the chart area is shifted by this transform - so we need to adjust the point coordinates by this amount
        var t = d3.transform(chart.internal.main.attr("transform")).translate;
        // loop through each point
        chart.internal.main.selectAll('.' + c3.chart.internal.fn.CLASS.circle).each(function () {
            var c = this.getBBox();

            // left clipping
            if (c.x < -t[0])
                change.left = Math.max(change.left, -(c.x + t[0]));
            // right clipping
            if ((c.x + c.width) > (m.width - t[0]))
                change.right = Math.max(change.right, (c.x + c.width) - (m.width - t[0]));
            // top clipping
            if (c.y < -t[1])
                change.top = Math.max(change.top, -(c.y + t[1]));
            // bottom clipping
            if ((c.y + c.height) > (m.height - t[1]))
                change.bottom = Math.max(change.bottom, (c.y + c.height) - (m.height - t[1]));
        })

        return change;
    }

    var change = getPaddingChange(chart);

    chart.internal.config.padding_top = chart.internal.getCurrentPaddingTop() + change.top;
    chart.internal.config.padding_bottom = chart.internal.getCurrentPaddingBottom() + change.bottom;
    chart.internal.config.padding_left = chart.internal.getCurrentPaddingLeft() + change.left;
    chart.internal.config.padding_right = chart.internal.getCurrentPaddingRight() + change.right;
    // force a redraw
    chart.flush();

    // remove clip path
    chart.internal.main.select('.' + c3.chart.internal.fn.CLASS.chart).attr('clip-path', null);

}

var getPaddingChange = function (chart) {
    var change = {
        top: 0,
        left: 0,
        right: 0,
        bottom: 0
    };

    var m = chart.internal.main.node().parentNode.getBoundingClientRect();
    // the chart area is shifted by this transform - so we need to adjust the point coordinates by this amount
    var t = d3.transform(chart.internal.main.attr("transform")).translate;
    // loop through each point
    chart.internal.main.selectAll('.' + c3.chart.internal.fn.CLASS.circle).each(function () {
        var c = this.getBBox();

        // left clipping
        if (c.x < -t[0])
            change.left = Math.max(change.left, -(c.x + t[0]));
        // right clipping
        if ((c.x + c.width) > (m.width - t[0]))
            change.right = Math.max(change.right, (c.x + c.width) - (m.width - t[0]));
        // top clipping
        if (c.y < -t[1])
            change.top = Math.max(change.top, -(c.y + t[1]));
        // bottom clipping
        if ((c.y + c.height) > (m.height - t[1]))
            change.bottom = Math.max(change.bottom, (c.y + c.height) - (m.height - t[1]));
    })

    return change;
}

var change = getPaddingChange(chart);

chart.internal.config.padding_top = chart.internal.getCurrentPaddingTop() + change.top;
chart.internal.config.padding_bottom = chart.internal.getCurrentPaddingBottom() + change.bottom;
chart.internal.config.padding_left = chart.internal.getCurrentPaddingLeft() + change.left;
chart.internal.config.padding_right = chart.internal.getCurrentPaddingRight() + change.right;
// force a redraw
chart.flush();

// remove clip path
chart.internal.main.select('.' + c3.chart.internal.fn.CLASS.chart).attr('clip-path', null);