2014-03-26 43 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(); 

現在不調整大小,但不知道預期的結果如果是正確地重新調整大小我不能告訴。