PHP 배열에서 Jqplot으로 값을 플롯하는 방법은 무엇입니까?

Question

저는 PHP, 자바 스크립트 및 Jqplot을 처음 사용합니다. 나는 PHP에서 웹 사이트가 하는 array1 출력

Array ([0] => 0.0024 [1] => 0.0024 [2] => 0.0024 [3] => 0.0024 [4] => 0.00098765432098765 [5] => 0.00098765432098765 [6] => 0.00098765432098765 [7] => 0.001953125 [8] => 0.001953125 [9] => 1 [10] => 1 [11] => 1 [12] => 0.2 [13] => 0.2 [14] => 0.2 [15] => 0.2 [16] => 0.25 [17] => 2) 

배열이 개 출력

Array ([0] => 2013-01-13 14:13:05 [1] => 2013-01-13 14:14:56 [2] => 2013-01-13 14:15:05 [3] => 2013-01-13 14:15:13 [4] => 2013-01-13 14:16:48 [5] => 2013-01-13 14:17:20 [6] => 2013-01-13 14:17:56 [7] => 2013-01-13 14:25:06 [8] => 2013-01-13 14:27:28 [9] => 2013-01-13 14:29:41 [10] => 2013-01-13 14:30:36 [11] => 2013-01-13 14:30:53 [12] => 2013-01-13 14:35:37 [13] => 2013-01-13 14:39:52 [14] => 2013-01-13 14:48:30 [15] => 2013-01-13 14:49:40 [16] => 2013-01-13 14:51:23 [17] => 2013-01-13 14:55:05) 

방법 jqplot에서이 데이터를 플롯 말할 수 만드는 중이라서?

나는 어떤 도움에 감사 할 것입니다. 감사합니다

Answer 1

나는 array1을 y 축으로, array2를 x 축으로하고 싶다고 가정합니다. PHP 루프에서 javascript 행을 출력하기 만하면됩니다.

<script type="text/javascript"> 
    var lines = []; 

<? for ($i=0; $i<count($array1); $i++) { ?> 
    lines[<?=$i?>] = ['<?=$array2[$i]?>', <?=$array1[$i]?>]; 
<? } ?> 

    // The array 'lines' will be plotted into 'chart1' when the document loads 
    $(document).ready(function(){ 
     var plot1 = $.jqplot ('chart1', [ lines ]); 
    }); 

</script> 

<!-- This is the div where the graph will be displayed --> 
<div id="chart1" style="height:300px; width:500px;"></div> 

플롯 위의 lines 배열은, 당신은 당신이 원하는 무엇을 얻어야한다.

Answer 2

내가 당신의 문제와 같은 예를 가지고, 당신은 주어진 라인 (1) 배열과 같은 배열을 만들 필요가 당신은 당신의 결과를 얻을 수

<script class="code" type="text/javascript"> 

$(document).ready(function(){ 
    var line1=[['2008-06-30 8:00AM',4], ['2008-7-14 8:00AM',6.5], ['2008-7-28 8:00AM',5.7], ['2008-8-11 8:00AM',9], ['2008-8-25 8:00AM',8.2]]; 
    var plot2 = $.jqplot('chart2', [line1], { 
     title:'Customized Date Axis', 
     axes:{ 
     xaxis:{ 
      renderer:$.jqplot.DateAxisRenderer, 
      tickOptions:{formatString:'%b %#d, %#I %p'}, 
      min:'June 16, 2008 8:00AM', 
      tickInterval:'2 weeks' 
     } 
     }, 
     series:[{lineWidth:4, markerOptions:{style:'square'}}] 
    }); 
}); 
</script> 

을 당신이 어떤 문제를 찾을 수 있다면 당신은 또한 확인하실 수 있습니다 링크를 http://www.jqplot.com/tests/date-axes.php

Answer 3

에서 예제 코드는 여기에 내가 시도 한 내용을 간단한 예입니다 :

는 MySQL의 테이블 attendence라고 나는 일부 데이터 배열을 만들 거 야 있습니다.

다음

<div id="content"> 
    <h2>Charts</h2> 
     <div id="chart1b" style="height:300px; width:500px;"></div> 
     <br> 
     <div id="chart1" style="height:300px; width:500px;"></div> 
     <br> 
     <div id="chart2" style="height:300px; width:500px;"></div> 
    </div> 

내 자바 스크립트 코드입니다 :

<script type="text/javascript"> 
$(document).ready(function(){ 
var line1 = <?php echo json_encode($results); ?>; 
var plot1b = $.jqplot('chart1b', [line1], { 
    title: 'Employee vs. Attendence', 
     series:[{renderer:$.jqplot.BarRenderer}], 
    axesDefaults: { 
    tickRenderer: $.jqplot.CanvasAxisTickRenderer , 
    tickOptions: { 
     fontFamily: 'Georgia', 
     fontSize: '10pt', 
     angle: -30 
     } 
    }, 
    axes: { 
    yaxis: { 
     autoscale:true 
     }, 
    xaxis: { 
    renderer: $.jqplot.CategoryAxisRenderer 
    } 
    } 
    }); 
}); 
    </script>   
    <!-- End code --> 

    <!-- Chart Two code --> 
    <script type="text/javascript"> 
$(document).ready(function(){ 
    var data = <?php echo json_encode($results); ?>; 
    var plot1 = jQuery.jqplot ('chart1', [data], 
    { 
    seriesDefaults: { 
    // Make this a pie chart. 
    renderer: jQuery.jqplot.PieRenderer, 
    rendererOptions: { 
    // Put data labels on the pie slices. 
     // By default, labels show the percentage of the slice. 
    showDataLabels: true 
    } 
     }, 
    legend: { show:true, location: 'e' } 
      }); 
    }); 
</script> 
    <!-- End code --> 

    <!-- Chart three code --> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
     var line1 = <?php echo str_replace('"','',json_encode($attendence)); ?>; 
     var plot3 = $.jqplot('chart2', [line1], { 
     title: 'Bar Chart with Point Labels', 
     seriesDefaults: {renderer: $.jqplot.BarRenderer}, 
     series:[ 
      {pointLabels:{ 
       show: true, 
       labels:<?php echo json_encode($empNames); ?> 
      }}], 
      axes: { 
      xaxis:{renderer:$.jqplot.CategoryAxisRenderer}, 
      yaxis:{padMax:1.3}} 
      }); 
     }); 
    </script> 
    <!-- End code --> 

은 그것을 즐기십시오 :)

이