首页
开源项目
问答
动弹 博客 翻译 资讯
专题
活动 招聘 众包 码云代码托管
3
回答
 Echarts 雷达 单击事件如何获取值
科大讯飞通用文字识别100000次/天免费使用。立即申请   

@Kener-林峰 你好，想跟你请教个问题：Echarts 雷达 单击事件如何获取值

附上本地代码：

<script type="text/javascript">
// 路径配置
       require.config({
paths:{ 
echarts:'./javascript/echarts/Echarts/www/js/echarts',
'echarts/chart/bar' : './javascript/echarts/Echarts/www/js/echarts-map',
'echarts/chart/line': './javascript/echarts/Echarts/www/js/echarts-map',
'echarts/chart/map' : './javascript/echarts/Echarts/www/js/echarts-map'
}
});

    // 使用
       require(
           [
               'echarts',
'echarts/chart/bar',
               'echarts/chart/pie',// 按需加载
'echarts/chart/radar'
           ],
       function (ec) {
            // 基于准备好的dom，初始化echarts图表
               var myChart2 = ec.init(document.getElementById('main2'));
var option2 = {
  tooltip: {
  trigger: "axis"
  },
  legend: {
                          orient: "vertical",
                          x: "right",
                          y: "bottom",

                          data: ["", ""],
                          selectedMode: false
                      },
  toolbox: {
  feature: {
  mark: {
  show: true
  },
  dataView: {
  show: true,
  readOnly: false
  },
  restore: {
  show: true
  },
  saveAsImage: {
  show: true
  }
  }
  },
   polar: [
  {
  indicator: [
  {
  text: "DOWNLOAD",
  max: 100
  },
  {
  text: "DELETE",
  max: 100
  },
  {
  text: "RENAME",
  max: 100
  }
  ]
  }
  ], 
  calculable: true,
  series: [
  {
  name: "",
  type: "radar",
  data: [
  {
  value: [60, 100, 80],
  name: "bds"
  }
  ],
  itemStyle: {
  normal: {
  color: "#1DBB37"
  }
  }
  },
  {
  name: "",
  type: "radar",
  data: [
  {
  value: [60, 54, 35],
  name: "bds"
  }
  ],
  itemStyle: {
  normal: {
  color: "rgb(51, 153, 254)"
  }
  }
  }
  ], 
};  


         
                var ecConfig = require('echarts/config');
                myChart2.on(ecConfig.EVENT.CLICK,function(param){
  //点击后这里怎么写
    });
                   myChart2.setOption(option2);

});
 </script>

ECharts
举报
飞舞的枫叶3841
发帖于3年前 3回/1K+阅
飞舞的枫叶3841
共有3个答案 最后回答: 1年前
按票数排序 显示最新答案 
myChart2.on(ecConfig.EVENT.CLICK,function(param){
    //点击后这里怎么写
    alert(param.seriesName+":"+param.value[param.special]);
});



<!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>
	<div id="main" style="width: 600px;height:400px;"></div>
</body>
</html>
<script src="jquery.js"></script>
<script>
	require.config({
		paths:{ 
			echarts:'http://echarts.baidu.com/build/dist'
		}
	});

	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){
			//点击后这里怎么写
			console.log(param)
			alert(param.name)
		});
		myChart.setOption(option);

}); 
</script>

 

顶部