2014-10-30 88 views
1

即时通讯有一些问题,添加系列yAxis与不同的ID在highcharts。HighCharts。添加系列yAxis与编号

我已经做出了表率:

$(function() { 

     $('#graf').highcharts({ 
      chart: { 
       zoomType: 'xy' 
      }, 
      title: { 
       text: '' 
      }, 
      subtitle: { 
       text: '' 
      }, 
      xAxis: [{type: 'datetime', 
        title: { 
         text: 'Date' 
        }}], 
      yAxis: [], 
        series : [] 
        , 
      tooltip: { 
       shared: true 
      }, 
      legend: { 
       enabled: true, 
       align: 'left', 
       backgroundColor: '#FFFFFF', 
       borderColor: 'grey', 
       borderWidth: 1, 
       layout: 'vertical', 
       verticalAlign: 'top', 
       y: 0, 
       shadow: true 
      } 
     }); 


var chart = $('#graf').highcharts(); 
$('#add').click(function() { 
    chart.addAxis({ // Secondary yAxis 
     id: "asd", 
     title: { 
      text: 'Rainfall' 
     }, 
     lineWidth: 2, 
     lineColor: '#08F', 
     opposite: true 
    });  
    chart.addAxis({ // Secondary yAxis 
     id: "abc", 
     title: { 
      text: 'Rainfall' 
     }, 
     lineWidth: 2, 
     lineColor: '#08F', 
     opposite: true 
    });  
    chart.addSeries({ 
     name: 'Rainfall', 
     type: 'column', 
     color: '#08F', 
     yAxis: "asd", 
     data: [ [Date.UTC(1970, 9, 27), 0 ], 
      [Date.UTC(1970, 10, 10), 0.6 ], 
      [Date.UTC(1970, 10, 18), 0.7 ], 
      [Date.UTC(1970, 11, 2), 0.8 ], 
      [Date.UTC(1970, 11, 9), 0.6 ]] 
    }); 
    $(this).attr('disabled', true); 
    $('#remove').attr('disabled', false); 
}); 
}); 

的jsfiddle:http://jsfiddle.net/5f6b6mu9/

我有Y轴ID为 “ASD” 和 “ABC”。 当试图添加一系列的“asd”yAxis它不起作用。 Uncaught TypeError:无法读取未定义的属性“长度”。

这里是什么在我的网页怎么回事上限: http://i61.tinypic.com/8yx7cw.jpg

如果我改变这两个y轴ID相同的ID,它的工作,但那不是重点。

有什么建议吗?谢谢

回答

1

这很简单。

添加系列后立即添加yAxis对应的系列。

chart.addAxis({ // Secondary yAxis 
      id: "asd", 
      title: { 
       text: 'Rainfall' 
      }, 
      lineWidth: 2, 
      lineColor: '#08F', 
      opposite: true 
     },false); 
     chart.addSeries({ 
      name: 'Rainfall', 
      type: 'column', 
      color: '#08F', 
      yAxis: "asd", 
      data: [ [Date.UTC(1970, 9, 27), 0 ], 
       [Date.UTC(1970, 10, 10), 0.6 ], 
       [Date.UTC(1970, 10, 18), 0.7 ], 
       [Date.UTC(1970, 11, 2), 0.8 ], 
       [Date.UTC(1970, 11, 9), 0.6 ]] 
     }); 

     chart.addAxis({ // Secondary yAxis 
      id: "abc", 
      title: { 
       text: 'Rainfall' 
      }, 
      lineWidth: 2, 
      lineColor: '#08F', 
      opposite: true 
     },false); 

这里,我已经更新了fiddle

+0

我不能这样做,因为我的系列与XMLHttpRequest的动态加载。无论如何,我这样做是固定的: 而不是创建图表,然后添加yAxis与chart.addaxis,我直接加载Yaxis图表: ..... xAxis:[{type:'datetime', 标题:{ 文字: '日期' }}], Y轴:我在这里的动态加载的AXIS, 系列:[] ..... 这工作,因为我可以在一开始获得轴.. otherway它不起作用。不管怎样,谢谢你!对不起我的英语不好。 – Fabricio 2014-10-30 21:08:23