Skip to content

Radar Chart

This component displays a Radar Chart.

Property

NoItemInput ValueDefault ValueAction PropertyTypeAction Default ValueDescription
1IDStringAuto-generatedidstringAuto-generatedThe [id] property cannot be set by actions.
2WidthString390widthstring390Component width
3HeightString460heightstring460Component height
4XStringxstringX coordinate position
5YStringystringY coordinate position
6LockBooleanOFFlockbooleanfalseWhen ON, the component stays fixed even when the screen is scrolled.
When OFF, the component moves along with the screen scroll.
Added in v4.1.0.
7VisibilityBooleanONvisibilitybooleantrueDisplay state
8ValueTable format
[Details 1]
[Details 1]valuearray of object[Details 1]Chart data
9ScaleTable format
[Details 2]
[Details 2]scaleobject[Details 2]Scale and tick settings
10SeriesTable format
[Details 3]
[Details 3]seriesarray of object[Details 3]Series drawing settings
11LegendTable format
[Details 4]
[Details 4]legendobject[Details 4]Legend settings

Example 1 Value (value)

[
{"month":"02","company A":20,"company B":52,"company C":72,"company D":34},
{"month":"03","company A":5,"company B":33,"company C":90,"company D":55},
{"month":"04","company A":55,"company B":30,"company C":81,"company D":66},
{"month":"05","company A":30,"company B":11,"company C":62,"company D":22},
{"month":"06","company A":27,"company B":14,"company C":68,"company D":70},
{"month":"07","company A":32,"company B":31,"company C":64,"company D":50},
{"month":"08","company A":50,"company B":22,"company C":30,"company D":80},
{"month":"09","company A":12,"company B":19,"company C":65,"company D":48},
{"month":"10","company A":10,"company B":24,"company C":50,"company D":66},
{"month":"11","company A":17,"company B":40,"company C":78,"company D":55}
]

Example 2 Scale (scale)

Sets the scale and tick.

ValueMax Ticks
month10

Example 3 Series (series)

Set the drawing settings for the series.

IDValueColorPoint ColorFillAlpha
Acompany A#81C4E8#81C4E8#81C4E80.3
Bcompany B#74A2E7#74A2E7#74A2E70.3
Ccompany C#5E83BA#5E83BA#5E83BA0.3

Example 4 Legend (legend)

Sets legend information.

SeriesHorizontal AlignVertical Align
A,B,Crighttop
  • The options for Horizontal Align are left | center | right (default).
  • The options for Vertical Align are top (default) | bottom.

Event

None