Bubble chart with CanvasJS not showing proportions

Question

I'm trying to make a bubble chart to compare the magnitude of two variables, but the bubbles are not proportional to the input values. I have tried to do it in many ways and the result is always the same. The function receives the input values (5838 and 3816) well. How can I correct it?

This is my code:

function createBubbleChart(container, data) {
    var totalMujeres = data.total_mujeres;
    var totalBenef = data.benef_total;

    var womenSize = 40 * (totalMujeres / totalBenef);
    var beneficiarySize = 40;

    var chart = new CanvasJS.Chart(container, {
        theme: "light2",
        animationEnabled: true,
        animationDuration: 500,
        axisY: {
            lineThickness: 0, 
            gridThickness: 0, 
            tickLength: 0,    
        },
        data: [{
            type: "bubble",
            indexLabel: "{label} {y}",
            yValueFormat: "#,##0.00",
            axisX: { minimum: 0, maximum: 3 },
            axisY: { minimum: 0, maximum: 1 },
            dataPoints: [
                { label: "Total Beneficiarios", y: 0.5, x: 1, z: beneficiarySize },
                { label: "Total Mujeres", y: 0.4, x: 2, z: womenSize },
            ],
        }],
    });

    chart.render();
}

And this is what my graph looks like:

Answer 1

z value sets the size of the bubble which is used for visualizing the difference in value between the dataPoints. The size of the bubble depends on the difference in the z value of dataPoints and has a max limit(which depends on multiple factors like minimum z value, maximum z value, etc.) on the size after which it won’t increase any further. You can control the size of the bubble by increasing or decreasing the z value as per your requirement.