I'm trying to build a polar chart where you can dinamically add axes from a dataset server side (I've slimmed up the code to the bare minimum)

This is what I've tried to do so far:

function loadToRadar(chart){


    // if type of chart == 'undefined', we initialize a new chart

    if ( typeof radarChart == 'undefined'){
         radarChart = initializeRadarChart(chart, this);
            return
        }

    // add new xAxis category
    let newCategories = chart.xAxis[0].categories;
    newCategories.push(newColumnCat);
    chart.xAxis[0].setCategories(newCategories);
                  
    // add new yAxis
    chart.addAxis(
         {
             min : newMin,
             max : newMax,
             showLastLabel : true,
             gridLineInterpolation: 'polygon',
        }, 
          false // is X axis?
   );

    // add new point to series
    chart.series[0].addPoint([newMean]) // access the original series and addpoint

}

var chart;
function initializeRadarChart(chart, column){
    console.log('initializeRadarChart called');
    chart = Highcharts.chart('radar-chart', {
        chart: {
            parallelCoordinates: true,
            parallelAxes: {
                gridLineWidth: 1
            },
            polar: true
        },

        xAxis: {
        categories: [
            column.columnCat
        ],
        tickmarkPlacement :'on',
        labels: {
            style: {
            color: 'black'
            }
        }
        },

        yAxis: [
            {
                min : this.min,
                max : this.max,
                showLastLabel : true,
                gridLineInterpolation: 'polygon',
            }, 
        ],

        series: [
        {
                name :'firstSeries',
                data : 5 //random num
            },
        ]
        });
    return chart;
    }

This is the output image:

As you can see points of the series are loaded for the correct category but they display only in the original line.

Added a sample jsfiddle