How do I build a radar chart?

Hi Retool community!

Reading the docs (https://docs.retool.com/docs/plotly-charts-beta) it seems like I should be able to build any chart that is available of plotly inside retool by using the 'data' and 'layout' sections of a chart. I'm trying to build a radar chart (Radar charts in JavaScript) but the chart still looks like a regular bar chart. This is my 'data':

{
  type: 'scatterpolar',
  r: [39, 28, 8, 7, 28, 39],
  theta: ['A','B','C', 'D', 'E', 'A'],
  fill: 'toself'
}

And this is my 'layout':

{
polar: {
radialaxis: {
visible: true,
range: [0, 50]
}
},
showlegend: false
}

(Basically a copy paste from the plotly docs example.) The output is:

Many thanks,
Fina

@FinaSS

Hey there :wave: If you wrap the data object in an array do you see the below:

Hi Lauren,

Thanks so much for your help! That worked out perfectly!
So if I wanted to use real data from a sql query, I'd have to replace the r and theta values with the result set, is that right? E.g.

[{
  type: 'scatterpolar',
  r: {{myquery.column1}},
  theta:{{myquery.column2}},
  fill: 'toself'
}]

Many thanks,
Fina

@FinaSS

Sounds exactly correct :slightly_smiling_face:

1 Like