How to set backgroundcolor in PlotlyJS barpolar chart?

Question

I've created a PlotlyJS barpolar chart, however, the chart background, where the bars end (the range is somewhat larger than the values in this example) seems to be stuck on white, see image. (nevermind the transparent black rounded square in the back - that's just the div in which the graph is rendered).

My question: how can I manipulate this color? I found paper_bgcolor and plot_bgcolor, but they don't seem to do anything (except for making the square in the background transparent, that is).

My layout code is as follows:

var layout = {
paper_bgcolor: 'rgba(0,0,0,0)',
plot_bgcolor: 'rgba(0,0,0,0)', 
bgcolor: 'rgba(0,0,0,0)',
showLegend: false,
"polar": {
    "hole": 0.0,
    "bargap": 0, 
    "radialaxis": {
        "visible": false,
        "type": 'linear',
        range: [0, 100],
        gridcolor: 'rgba(0,0,0,0)'
    },
    "angularaxis": {
        visible: false,
        "type": 'category',
        "direction": 'counterclockwise',
        gridcolor: 'rgba(0,0,0,0)'
    }
},
margin: {
    l: 0,
    r: 0,
    b: 0,
    t: 0,
    pad: 4
},
};

Answer 1

You need to set the bgcolor property in the layout.polar object. Also note that the showlegend property should be lowercased.

var layout = {
  showlegend: false,
  polar: {
    bgcolor: 'rgba(0,0,0,0)',
    hole: 0.0,
    bargap: 0,
    radialaxis: {
      visible: false,
      type: 'linear',
      range: [0, 100],
      gridcolor: 'rgba(0,0,0,0)'
    },
    angularaxis: {
      visible: false,
      type: 'category',
      direction: 'counterclockwise',
      gridcolor: 'rgba(0,0,0,0)'
    }
  },
  margin: {
    l: 0,
    r: 0,
    b: 0,
    t: 0,
    pad: 4,
  }
};