全国旗舰校区

不同学习城市 同样授课品质

北京

深圳

上海

广州

郑州

大连

武汉

成都

西安

杭州

青岛

重庆

长沙

哈尔滨

南京

太原

沈阳

合肥

贵阳

济南

下一个校区
就在你家门口
+
当前位置:首页  >  技术干货

详解echarts雷达图

发布时间:2023-11-21 23:34:19
发布人:xqq

接下来,需要配置雷达图的数据信息


    
        // 配置雷达图的数据
        var option = {
            title: {
                text: 'echarts雷达图示例'
            },
            tooltip: {},
            legend: {
                data:['预算分配','实际开销']
            },
            radar: {
                // 雷达图坐标系组件
                indicator: [
                    { name: '销售', max: 6500},
                    { name: '管理', max: 16000},
                    { name: '信息技术', max: 30000},
                    { name: '客服', max: 38000},
                    { name: '研发', max: 52000},
                    { name: '市场', max: 25000}
                ]
            },
            series: [{
                name: '预算 vs 开销(Allocated Budget vs Actual Spending)',
                type: 'radar',
                // 数据
                data: [
                    {
                        value: [4300, 10000, 28000, 35000, 50000, 19000],
                        name: '预算分配',
                        // 单个数据项的样式配置
                        itemStyle: {color: '#104E8B'}
                    },
                    {
                        value: [5000, 14000, 28000, 31000, 42000, 21000],
                        name: '实际开销',
                        // 单个数据项的样式配置
                        itemStyle: {color: '#00FF00'}
                    }
                ]
            }]
        };

        // 使用刚指定的配置项和数据显示图表
        myChart.setOption(option);
    

这样我们就成功创建了一个雷达图,可以根据所需的数据进行修改配置,以展现不同效果。

eclipse大小写快捷键

相关文章

详解length()函数

详解length()函数

2023-11-21
Linux时间戳在线转换

Linux时间戳在线转换

2023-11-21
理解和应用cv2.dct

理解和应用cv2.dct

2023-11-21
详解arr.length

详解arr.length

2023-11-21

最新文章

武汉新媒体行业公司排名

武汉新媒体行业公司排名

2023-11-01
武汉新媒体就业现状好吗

武汉新媒体就业现状好吗

2023-11-01
武汉全媒体行业发展现状及趋势

武汉全媒体行业发展现状及趋势

2023-10-31
武汉全媒体现状

武汉全媒体现状

2023-10-31
在线咨询 免费试学 教程领取