单击单线图时获取所有系列值

时间:2013-12-17 09:52:27

标签: jquery html highcharts

 <div id="container" style="width:100%; height:400px;"></div>
 <div id="container_dialogue" style="width:100%; height:400px;"></div>

    var chart1;
 function test(name, e){
alert(name);

$( "#container_dialogue").empty();
$( "#container_dialogue").dialog({height: 500,modal: true});

$( "#container_dialogue").append("<div id='dialogue_inner'></div><div            id='dialogue_inner1'></div>");
 $("#dialogue_inner1").append(name);

 /**
  on Clicking any chart based on this property or 'e' i need to identify       the              corresponsing series and to display in dialogue box.
     As of now i hard coded the values and displays a single chart only 

   **/
  $('#dialogue_inner').highcharts({

    title: {
        text: 'Energy Consumption'
    },
    yAxis: {
        title: {
            text: 'Energy'
        }
    },
    series: [{
        name: name,
        data: [1,0,4,5,6,9,3] //hardcoded values
    }]
});

 }


  $(function () { 
  chart1 = new Highcharts.Chart({
chart: {
        renderTo: 'container',
        type: 'line'
    },

title: {
        text: 'Energy Consumption'
    },
    yAxis: {
        title: {
            text: 'Energy'
        }
    },
    plotOptions: {
            line: {
                   events:{
                          click: function(e){
                    var name = this.name;

                    alert(this.name);
                                 test(name, e);
                          }    
                   }
            }
    },
    series: [{
        name: 'A',
        data: [2,3,8,1,9,6,4,8]
    }, {
        name: 'B',
        data: [5,6,3,8,4,1,6,0]
    },{
        name: 'C',
        data: [1,5,4,3,7,7,2,6]
    },{
        name: 'D',
        data: [9,10,2,4,5,8,3,8]
    }]
    });    

   });

on根据此属性或“e”单击任何折线图我需要识别相应的系列并在对话框中显示该特定图表

1 个答案:

答案 0 :(得分:1)

您可以使用series click然后打印所有点

http://jsfiddle.net/6gYLX/3/

 click: function() {
                    console.log(this);
                        var series = this.data;

                    $.each(series,function(i,point){
                        console.log(point.y);
                    });
                }