javascript - echarts里面的雷达图怎样获取点到的是哪个点上-PHP中文网问答

javascript - echarts里面的雷达图怎样获取点到的是哪个点上

天蓬老师 2017-04-11 13:15:25

[JavaScript讨论组]

570

天蓬老师

欢迎选择我的课程，让我们一起见证您的进步~~

全部回复(1)

ringa_lee2017-04-11 13:17:25 1楼

<!doctype html>
<html lang="us">
<head>

<meta charset="utf-8">
<title></title>
<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>

</head>
<body>

<p id="main" style="width: 600px;height:400px;"></p>

</body>
</html>
<script>

//配置图表路径
require.config({
    paths:{ 
        echarts:'http://echarts.baidu.com/build/dist'
    }
});
//加载图表js文件
require(
   [
       'echarts',
       'echarts/chart/radar',  //要什么图表类型配置什么类型
   ],
function (ec){
    //基于准备好的dom，初始化echarts图表
    var myChart= ec.init(document.getElementById('main'));
    var option = {
        polar: [{
            indicator: [
                { text: '销售', max: 6500},
                { text: '管理', max: 16000},
                { text: '信息技术', max: 30000},
                { text: '客服', max: 38000},
                { text: '研发', max: 52000},
                { text: '市场', max: 25000}
            ]
        }], 
        series: [{
            name: "",
            type: "radar",
            data: [{
                value: [4300, 10000, 28000, 35000, 50000, 19000],
                name: "预算分配"
            }],
            itemStyle: {
                normal: {
                    color: "#1DBB37"
                }
            }
            },{
            name: "",
            type: "radar",
            data: [{
                value: [5000, 14000, 28000, 31000, 42000, 21000],
                name: "实际开销"
            }],
            itemStyle: {
                normal: {
                    color: "rgb(51, 153, 254)"
                }
            }
            }
        ], 
    };     

    var ecConfig = require('echarts/config');
    myChart.on(ecConfig.EVENT.CLICK,function(param){
        //点击后执行操作
        alert(param.name)
    });
    myChart.setOption(option);

});
</script>
</script>

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>