2014-03-26 44 views
0

您好我的jquery手机+ phonegap应用程序我使用蜘蛛图显示我的销售,但我很难找到适合我的手机屏幕。尝试下面Highcharts无法适应手机屏幕尺寸

<table > 
    <tr id="chartRow"> 
     <td style="width:50%;"> 
      <div id="container"></div> 
     </td> 
     <td style="width:50%;"> 

     </td> 
    </tr> 
</table> 

的javascript:

<script type="text/javascript"> 
$(function() { 

    $('#container').highcharts({ 

     chart: { 
      reflow: false, 
      polar: true, 
      renderTo: 'container', 

      type: 'line' 
     }, 

     title: { 
      text: '', 
      x: -80 
     }, 

     pane: { 
      size: '50%' 
     }, 

     xAxis: { 
      categories: ['Aligt', 'Reach', 'ment', 'Acqa', 
        'Adv', 'Gover'], 
      tickmarkPlacement: 'on', 
      lineWidth: 0 
     }, 

     yAxis: { 
      gridLineInterpolation: 'polygon', 
      lineWidth: 0, 
      min: 0 
     }, 

     tooltip: { 
      shared: true, 
      pointFormat: '<span style="color:{series.color}">{series.name}: <b>{point.y:,.0f}</b><br/>' 
     }, 

     legend: { 
      layout: 'vertical', 
       align: 'right', 
       verticalAlign: 'top', 
       x: -10, 
       y: 100, 
       borderWidth: 0 
     }, 

     series: [{ 
      name: 'Max Score', 
      data: [25,25,25,25,25,25], 
      pointPlacement: 'on' 
     }, { 
      name: 'Organization Score', 
      data: [30,20,15,25,10,0], 
      pointPlacement: 'on' 
     }] 

    }); 

    $(window).resize(function() { 
    height = chart.height 
    width = $("#chartRow").width()/2 
    chart.setSize(width, height, doAnimation = true); 
}); 


}); 

</script> 

试图调整窗口,但不ITZ有人working..can请让我知道我能做到这一点。

+0

我不认为'size'是'pane'的成员。 – wergeld

回答

1

从该代码取得​​。你有你在哪里设置高度/宽度的语法错误:

$(window).resize(function() { 
    height = chart.height 
    width = $("#chartRow").width()/2 
    chart.setSize(width, height, doAnimation = true); 
}); 

您需要;heightwidth设置后。

更重要的是 - 你永远不会告诉它chart是什么。要做到这一点,你需要设置了var:

var chart = $("#container").highcharts(); 

现在不调整大小,但不知道预期的结果如果是正确地重新调整大小我不能告诉。