Echarts 折线统计图 在线上添加点击事件

Question

Echarts 折线图 点击

Answer 1

<script type="text/javascript" src="js/jquery.js" ></script>
<script type="text/javascript" src="js/esl.js"></script>
<script type="text/javascript" src="js/echarts-plain-map.js"></script>
<script type="text/javascript">
    var xList=eval(["2010.9.11","2012.11.14","2013.3.25","2013.4.14","2013.5.2","2013.6.26","2013.7.8","2013.8.27","2013.11.9","2013.12.20"]);
var yList=eval(["36","84","232","22.5","-239","365","-239","-50","81","373"]);
    </script>
    <script type="text/javascript">

        // 路径配置

        require.config({
            paths:{ 
                'echarts' : 'js/echarts',
                'echarts/chart/bar' : 'js/echarts'
            }
        });
option_line = {
title : {
text: '',
subtext: ''
},
tooltip : {
trigger: 'axis'
},
legend: {
data:['synthesize'],
},
toolbox: {
show : true,
feature : {
 : {show: true},
dataZoom : {show: true},
dataView : {show: true},
magicType : {show: true, type: ['line', 'bar']},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : false,
xAxis : [
{
type : 'category',
boundaryGap : false,
data : xList
}
],
yAxis : [
{
type : 'value',
axisLabel : {
formatter: '{value} '
},
splitArea : {show : true}
}
],
dataZoom : {
show : true,
realtime : true,
//x: 0,
y: 460,
//width: 400,
height: 20,
//backgroundColor: 'rgba(221,160,221,0.5)',
//dataBackgroundColor: 'rgba(138,43,226,0.5)',
//fillerColor: 'rgba(38,143,26,0.6)',
//handleColor: 'rgba(128,43,16,0.8)',
//xAxisIndex:[],
//yAxisIndex:[],
start : 0,
end : 100
},
series : [
{
name:'synthesize',
type:'line',
itemStyle: {
normal: {
lineStyle: {
color:'',
shadowColor : 'rgba(0,0,0,0.3)',
shadowBlur: 5,
shadowOffsetX: 3,
shadowOffsetY: 3
}
}
},
data:yList
}
]
};//end option

require(
[
'echarts',
'echarts/chart/line',
'echarts/chart/bar'
],
function (ec) {
myChart_line_main = ec.init(document.getElementById('main'));
myChart_line_main.setOption(option_line); var ecConfig = require('echarts/config');//alert(ecConfig);
var zrEvent = require('zrender/tool/event');
myChart_line_main.on(ecConfig.EVENT.CLICK,function (param){
var temp="";
for(var i in param){

temp += i+":"+eval("param."+i)+"\n"; 
}alert(temp);
});
} );    </script>这段代码在X.html中其他用到的js文件都存到 js/   文件夹下   js文件夹与X.html在同一目录下。zrender.js   echarts.js  ....