0

ハイチャートの株価チャートにレンダリングしようとしているデータベースからいくつかのデータを取得しています。データは PHP を使用してデータベースから取得され、$.get(..php/line-data.php)呼び出しでチャートに渡されます。取得されたデータは、チャートにレンダリングされるデータであると想定されます。

以下のようにデータが返ってきておりdata、コンソールにログインして確認しました。次のように表示されます。最初の値は UNIX から Javascript に変換された日付/時刻 (x 軸) で、2 番目の値は値 (y 軸) です。

[[1362639600000, 8],[1362726000000, 20],[1362985200000, 28],[1363071600000, 51],[1363158000000, 64],[1363244400000, 11],[1363330800000, 4],[1363503600000, 4],[1363590000000, 21],[1363676400000, 10],[1363762800000, 31],[1363849200000, 13],[1363935600000, 17],[1364194800000, 10],[1364454000000, 1],[1365058800000, 30],[1365145200000, 10],[1366009200000, 55],[1366182000000, 18],[1366268400000, 22],[1366354800000, 12]]

実験として、このデータを基本的なデモ Fiddle に直接差し込んでみたところ、問題なくレンダリングされたようです。

ここでフィドル。

それで、私は間違って何をしていますか？すべてが正しく設定されているように見えますが、レンダリングされていません。これは私が見るものです：

ここに画像の説明を入力

これが私のコードの関連部分です。はい、mysql_* が非推奨であることはわかっています...変更します。

$.get('../php/line-data.php', function(data) {
    window.chart = new Highcharts.StockChart({
        chart : {
            renderTo : 'total_mentions',
            margin: [20, 10, 10, 10],
            spacingTop: 0,
            spacingBottom: 1,
            spacingLeft: 0,
            spacingRight: 0
        },

        series : [{
            name : 'Total Mentions',
            data: data,
            type:'line',
            lineWidth:1,
            shadow:false,
            states: {
                hover: {
                    lineWidth:1
                }
            },
            id : 'dataseries',
            tooltip : {
                valueDecimals: 4,
                borderColor:'#DA7925',
                borderRadius: 0,
                borderWidth: 1,
                shadow: false
            },
            color:'#DA7925',
            fillOpacity:0.2
        }]
[more options...etc.]

このコードに問題はありません。それは正しいデータを引き出し、私が期待する方法を反映しています。

<?php

    $expAddress = "URL";
    $expUser = "USERNAME";
    $expPwd = "PASSWORD";
    $database = "DB";
    $db = mysql_connect($expAddress, $expUser, $expPwd);
    mysql_select_db($database, $db);

    $ok = mysql_query("
                        SELECT 
                            DATE(created_at) AS create_date,
                            COUNT(id) AS total
                        FROM
                            tweets
                        WHERE 
                            subject LIKE 'word1'
                        OR  
                            subject LIKE 'word2'
                        GROUP BY 
                            DATE(created_at)");

    if (!$ok) {
        echo "<li>Mysql Error: ".mysql_error()."</li>";
    }
    else {
        while($row = mysql_fetch_assoc($ok)){           
            extract($row);
            $date = strtotime($create_date);
            $date *= 1000;
            $data[] = "[$date, $total]";
        }
        $tmp = join($data,',');
        echo "[".$tmp."]";
    }

?>
4

2 に答える 2

2

data (string)に設定する前に、JavaScript オブジェクトに解析しようとしましたseries[i].dataか?

series : [{          
            data: JSON.parse(data)
        }]

あなたがphpから得ているの$.getは、基本的stringには数値の配列のJavaScript配列ではなく、あなたが望むものです。そのように見えるかもしれませんが、 と同じくらい単純"5"!=5ですparseInt("5")==5が、json オブジェクトの場合も同様です。javascript または highcharts が正しく解釈する前に、文字列をそのようなオブジェクトに解析する必要があります。そのように設計されていません。

彼のフィドルを試して、図のデータ型を理解して

var data="[[1362639600000, 8],[1362726000000, 20],[1362985200000, 28],[1363071600000, 51],[1363158000000, 64],[1363244400000, 11],[1363330800000, 4],[1363503600000, 4],[1363590000000, 21],[1363676400000, 10],[1363762800000, 31],[1363849200000, 13],[1363935600000, 17],[1364194800000, 10],[1364454000000, 1],[1365058800000, 30],[1365145200000, 10],[1366009200000, 55],[1366182000000, 18],[1366268400000, 22],[1366354800000, 12]]"
console.log(typeof data);    //string
var parsedData=JSON.parse(data);
console.log(typeof parsedData);    //object
console.log(typeof parsedData[0]);    //object [1362639600000, 8]
console.log(typeof parsedData[0][0]);    //number 1362639600000

コンソール値をフィドルに直接貼り付けると、実際には有効な JavaScript 配列として貼り付けられます。コンソール値を"引用符で囲ん"でみて、正確な問題が再現されることを確認してください!!

デモ @ jsFiddle

$.getJSON()別のアプローチとして、代わりにメソッドを使用することもできます。jQuery は、コールバック メソッドを呼び出す前に解析を行います

于 2013-04-22T19:08:41.127 に答える