雷达图

Echarts 效果图

image.png

Echarts 绘制雷达图

闲话不多说,直接到观众老爷们最喜欢的上代码环节

js代码

 // 指定图表的配置项和数据
var describeday = '2020-12-08';
var score_chosenday = ['0.1', '0.3', '1.2', '1.7', '1.4'];
option = {
    title: {
        text: '',
    },
    grid: {
        x: 2,
        y: 4,
        x2: 5,
        y2: 2,
        borderWidth: 1,
    },
    tooltip: {},
    legend: {
        data: [describeday, '同期'],
    },
    radar: {
        // shape: 'circle',
        name: {
            textStyle: {
                color: '#fff',
                backgroundColor: '#999',
                borderRadius: 3,
                padding: [3, 5],
            },
        },
        indicator: [
            { name: '利率债二级', max: 2, min: -2 },
            { name: '国债期货', max: 2, min: -2 },
            { name: '资金面', max: 2, min: -2 },
            { name: '信用及地方债一级', max: 2, min: -2 },
            { name: '信用债二级', max: 2, min: -2 },
        ],
        // center: ['25%', '40%'],
        radius: 200,//调整雷达图大小
    },
    series: [
        {
            type: 'radar',
            // areaStyle: {normal: {}},
            data: [
                {
                    value: score_chosenday,
                    name: describeday,
                },
                {
                    value: [1, 2, 0, 1, 0],
                    name: '同期',
                    lineStyle: {
                        type: 'dashed',
                    },
                },
            ],
        },
    ],
};