douxuqiao6394 2015-05-29 17:32
浏览 153
已采纳

Highcharts无法显示数据

I am trying to create a simple program that takes weather data from my database that I have setup, and display it on a webpage. The way I have it setup right now is that you have to enter a value in the text box in order to get the data to pull.

My HTML Code:

    <!DOCTYPE html>
    <html>
        <head>
            <title>Database</title>
        </head>
        <body>
            Name: <input type="text" id="name">
            <input type="submit" id="name-submit" value="Grab">
            <div id="name-data"></div>
            <div id="container" style="min-width: 310px; height: 400px; 
             margin: 0 auto"></div>
            <script src="http://code.jquery.com/jquery-1.8.0.min.js">
            </script>
            <script src="js/global.js"></script>
            <script src="http://code.highcharts.com/highcharts.js"></script>
            <script src="http://code.highcharts.com/modules/exporting.js">                </script>
        </body>
    </html>

My PHP Code:

<?php
if(isset($_POST['name']) === true && empty($_POST['name']) === false) {
     mysql_connect("localhost", "root", "Logilube163");
     mysql_select_db("Weather_Test_Simple_Schema__Rev1");
     $query = mysql_query("SELECT * FROM Location");
         while($row = mysql_fetch_array($query)){
             $time = strtotime($row['time']) * 1000;
             $tempF = $row['temp_f'];   
             ![enter image description here][1]$data []= [(int)$time, (int)$tempF];
         }
     echo json_encode($data);
  }
?>

The code is able to query my database, and put the data into the data array $data.

The array of data is then encoded using the json_encode(); function and is transferred to the javascript file where it is successfully being read out and placed in a on the html page.

My JS code:

$('input#name-submit').on('click', function(){
var name = $('input#name').val();
   if($.trim(name)!=''){
       $.post('/ajaxdb/ajax/name.php',{name: name}, function(data){
           $('div#name-data').text(data); // Outputs the data before the graph

           $('#container').highcharts({
           chart: {
                zoomType: 'x'
           },

           xAxis: {
           type: 'datetime',
           minRange:   24 * 3600000 
       },

           title : {
               text : 'Weather Data'
           },

           series : [{
               data: data // <-- This data is not being read in by the graph
               //[[1432813308000,78],[1432813904000,77],[1432813968000,77],[1432814016000,77],[1432815600000,78],[1432832464000,66],[1432843057000,65],[1432843731000,65]]
               //The above data is read in by the graph and plots just fine.
          }]
      });
    });
  }
});

My output result looks like this: enter image description here

The problem is that this same data that is read out in the javascript, and is not being able to be placed in the highcharts graph. Instead, the chart gets created with the correct axis but without any data points. However, when I enter the data points being created by the tag, the data gets plotted just fine.

  • 写回答

1条回答 默认 最新

  • dongti8535 2015-06-17 18:13
    关注

    To answer my own question, I found that I needed the code:

    header("Content-type: text/json");
    

    At the top of my .php file.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥20 powerbuilder datawindow控件导出Excel数据,可不可以不自动覆盖原数据,而是在后面新插入入数据。
  • ¥100 无轴承永磁同步电机控制
  • ¥15 eps里添加本地倾斜模型
  • ¥15 telegram 问题
  • ¥15 nrf52810-c三个a 程序
  • ¥15 lego-loam跑出来的roll误差很大
  • ¥50 求一个半透明没有锯齿的圆角窗体的实现例子
  • ¥15 STM32cubeMX里的FreeRTOS无法释放内存
  • ¥15 CATIA有些零件打开直接单机确定终止
  • ¥15 请问有会的吗,用MATLAB做