使用amstockcharts的数据库数据

时间:2013-05-27 08:33:03

标签: php javascript amcharts

我正在尝试使用数据库数据绘制带有 amstockcharts 的图表。但是我此刻一直在失败。这是我的代码:

<script type="text/javascript">
  <?php
     $conn = new PDO ("pgsql:host=localhost port=5432 dbname=dbase", "id", "pass");

     $sql = "SELECT id, time, speed, fuel_level FROM data WHERE id = 294 AND
     time BETWEEN '2013-05-11' AND '2013-05-12' LIMIT 100;"; 
     $date = array();
     $fuel = array();
     $speed = array();
     $counter = 0;
     $query = $conn->query($sql);
     while($result = $query->fetch(PDO::FETCH_ASSOC))
     {
       array_push($date, $result['time']);
       array_push($fuel, $result['fuel']);
       array_push($speed, $result['speed']);
     }
     $jsDate = json_encode($date);
     $jsFuel = json_encode($fuel);
     $jsSpeed = json_encode($speed);
     $conn = null;
     echo "var date = ".$jsDate.";\n";
     echo "var fuel = ".$jsFuel.";\n";
     echo "var speed = ".$jsSpeed.";\n";
  ?>
  var dataObject = [];
  var object;
  for(var i=0; i<100; i++)
  {
     object = { date:date[i], fuel:fuel[i], speed:speed[i] };
     dataObject.push(object);
  }
  AmCharts.ready(function()
  {
     var chart = new AmCharts.AmStockChart();
     chart.pathToImages = "amcharts/images/";

     var dataSet = new AmCharts.DataSet();
     dataSet.dataProvider = dataObject;
     dataSet.fieldMappings = [{fromField:"speed", toField:"speed"}];   
     dataSet.categoryField = "date";
     dataSet.color = "#7f8da9";
     dataSet.title = "Test";
     chart.dataSets = [dataSet];
     chart.mainDataSet = dataSet;

     var stockPanel = new AmCharts.StockPanel();
     stockPanel.title = "Chart";
     chart.panels = [stockPanel];

     var legend = new AmCharts.StockLegend();
     stockPanel.stockLegend = legend;   

     var panelsSettings = new AmCharts.PanelsSettings();
     panelsSettings.startDuration = 1;
     chart.panelsSettings = panelsSettings;   

     var graph = new AmCharts.StockGraph();
     graph.valueField = "speed";
     graph.type = "column";
     graph.title = "speed";
     graph.fillAlphas = 1;
     stockPanel.addStockGraph(graph);

     var categoryAxesSettings = new AmCharts.CategoryAxesSettings();
     categoryAxesSettings.dashLength = 5;
     chart.categoryAxesSettings = categoryAxesSettings;

     var valueAxesSettings = new AmCharts.ValueAxesSettings();
     valueAxesSettings .dashLength = 5;
     chart.valueAxesSettings  = valueAxesSettings;

     var chartScrollbarSettings = new AmCharts.ChartScrollbarSettings();
     chartScrollbarSettings.graph = graph;
     chartScrollbarSettings.graphType = "line";
     chart.chartScrollbarSettings = chartScrollbarSettings;

     var chartCursorSettings = new AmCharts.ChartCursorSettings();
     chartCursorSettings.valueBalloonsEnabled = true;
     chart.chartCursorSettings = chartCursorSettings;
     chart.write('chartDiv');
   });
 </script>

在将数据推送到 dataObject 变量之前,一切似乎都很好,因为图表会显示,但不会绘制图形,也不会显示轴。

1 个答案:

答案 0 :(得分:0)

替换:

echo "var date = ".$jsDate.";\n";

使用:

echo “date: (new Date('" .str_replace('-','/',$jsDate). "')),\n";

它可以帮助你。