Highcharts line not plotting

我已經使用了一個例子，可以使用php和mysql成功讀取數據並繪製它（時基vs變量），所有工作都正常。我採取了這一點，並將其用作模板，並使用不使用時基的不同數據庫，但該圖不是呈現。該圖旨在顯示來自SQL查詢的數據，該查詢將變量的出現頻率與x軸上的變量以及Y軸上出現的頻率進行比較。Highcharts line not plotting

該圖表按預期方式彈出x軸和y軸值。它看起來很正確;除了情節不見了。爲了幫助我解決問題，我在屏幕上列出了數據，雖然不是很漂亮 - 這證明數據庫被正確調用，並且沒有明顯的SQL錯誤並且正在返回數據。

db_code`

<?php 

$con = mysql_connect("localhost","root","hal9000"); 

if (!$con) { 
    die('Could not connect: ' . mysql_error()); 
} 

mysql_select_db("sqm", $con); 

$result = mysql_query("SELECT magnitude, COUNT(*) AS xxx FROM data WHERE magnitude > 1 GROUP by magnitude"); 

while($row = mysql_fetch_array($result)) { 
    echo $row['magnitude'] . "\t" . $row['xxx']. "\n"; 
} 

mysql_close($con); 
?> `

main_page代碼

<script type="text/javascript"> 
     var chart; 
      $(document).ready(function() { 
       var options = { 
        chart: { 
         renderTo: 'common_LHS', 
         defaultSeriesType: 'line', 
         marginRight: 130, 
         marginBottom: 25 
        }, 
        title: { 
         text: 'Magnitude', 
         x: -20 //center 
        }, 
        subtitle: { 
         text: '', 
         x: -20 
        }, 
        plotOptions: { 
         series: { 
          marker: { 
           enabled: true, 
           symbol: 'circle', 
           radius: 0 
          } 
         } 
        }, 
        xAxis: { 
         type: 'linear', 
         tickWidth: 0, 
         gridLineWidth: 1, 
         labels: { 
          align: 'center', 
          x: -3, 
          y: 20 
         } 
        }, 
        yAxis: { 
         title: { 
          text: 'Frequency of occurrence' 
         }, 
         plotLines: [{ 
          value: 0, 
          width: 1, 
          color: '#808080' 
         }] 
        }, 
        legend: { 
         layout: 'vertical', 
         align: 'right', 
         verticalAlign: 'top', 
         x: -10, 
         y: 100, 
         borderWidth: 0 
        }, 
        tooltip: { 
         crosshairs: [{ 
          width: 2, 
          color: 'red' 
         }, { 
          width: 2, 
          color: 'red' 
         }], 
        }, 

        series: [{ 
         name: 'Occurrence', 
        }] 
       } 

       jQuery.get('data.php', null, function(tsv) { 
        var lines = []; 
        traffic = []; 
        try { 
         // split the data return into lines and parse them 
         tsv = tsv.split(/\n/g); 
         jQuery.each(tsv, function(i, line) { 
          line = line.split(/\t/); 
          traffic.push ([ 
           parseFloat(line[0]),  //need to parseFloat to convert data to float from string 
           parseFloat(line[1]) 
          ]); 
         }); 
        } catch (e) { } 
        options.series[0].data = traffic; 
        chart = new Highcharts.Chart(options); 
       }); 
      });

的數據看起來如我所料從線路不使其在Highcharts幾乎完成了在LibreCalc圖表時，除了。

欣賞任何建議。不幸的是，由於我是這個論壇的新手，我無法提交圖像，但很樂意將它們發送給某人，如果有幫助的話。

期待它是簡單的東西，通常是:)

來源

2015-08-31 Neil Walker

'traffic'是否包含項目？試着在你的'options.series [0]'定義中設置'data：[]'，在其中設置'name：'Occurance''。 – wergeld

您的數據是否正確排序？我的意思是，'traffic'是按照[line] [0]升序排列的？ – Kabulan0lak

數據是通過MySQL排序的，有1557個獨特的點來繪製，但是我的日期時間圖工作有18000，所以這不是很努力。我對此很陌生，非常感謝您的意見。我假設你的意思是系列：[] 如果是這樣，它沒有任何區別。 –

我認爲這個問題是來自你建立你traffic陣列的方式。它可能沒有很好的排序。嘗試通過第一個元素對它進行排序，使用類似：

function Comparator(a,b){ 
    if (a[0] < b[0]) return -1; 
    if (a[0] > b[0]) return 1; 
    return 0; 
} 

traffic.sort(Comparator); 

options.series[0].data = traffic;

它是否給你一個不同的結果？另外，在呈現圖表時，瀏覽器控制檯是否記錄了一些內容？

來源

2015-08-31 14:49:08 Kabulan0lak

那麼我說這將是簡單的，它是。

我加了10，以確保它是十進制的，它沒有任何區別。我將其更改爲16，並希望這些值能夠改變，但它確實讀取了數據，儘管它仍未繪製數據。

然後我在y軸上添加了.replace（'，'，''），它工作。

parseFloat（線[1]，10），
parseFloat（線[1] .replace（ ''， ''），10）

好像它不喜歡逗號在數據值的！

來源

2015-09-02 09:41:03

Highcharts line not plotting

回答

相關問題