Возникли проблемы при передаче данных в Highcharts

Question

Я пытаюсь получить данные о финансовых запасах нескольких компаний из CSV и отобразить их в виде отдельных рядов на линейном графике Highcharts/Highstocks. У меня настроены источники, и я могу получить данные + конвертировать в JSON, но у меня возникают проблемы при передаче данных в Highcharts. Я полагаю, что я не использую самый эффективный метод подготовки данных для использования в Highcharts, и я надеюсь, что кто-то может подсказать мне, что я сделал неправильно. Пожалуйста, посмотрите на мой код и сообщите мне о любых неэффективных или явных ошибках, которые вы видите.

Код PHP:

date_default_timezone_set('America/Los_Angeles');

$stocks = array('MSFT' => 'http://ichart.finance.yahoo.com/table.csv?s=MSFT', 'AAPL' => 'http://ichart.finance.yahoo.com/table.csv?s=AAPL', 'FB' => 'http://ichart.finance.yahoo.com/table.csv?s=FB');
$stocks_data = array();

foreach ($stocks as $key=>$stock) {
    $fh = fopen($stock, 'r');
    $header = fgetcsv($fh);

    $varname = $key . '_data';

    $$varname  = array();
    while ($line = fgetcsv($fh)) {
        ${$varname}[count($$varname)] = array_combine($header, $line);
    }

    fclose($fh);
}

foreach($MSFT_data as $val){
    $MSFT[]   = strtotime($val['Date']) * 1000 . ', ' . (float)$val['Close']; //sets the date as a javascript timestamp
}
$MSFT = json_encode($MSFT);

foreach($AAPL_data as $val){
    $AAPL[]   = strtotime($val['Date']) * 1000 . ', ' . (float)$val['Close']; //sets the date as a javascript timestamp
}
$AAPL = json_encode($AAPL);

foreach($FB_data as $val){
    $FB[]   = strtotime($val['Date']) * 1000 . ', ' . (float)$val['Close']; //sets the date as a javascript timestamp
}
$FB = json_encode($FB);

JS код:

$(function () {
    var seriesOptions = [],
        yAxisOptions = [],
        colors = Highcharts.getOptions().colors;

    seriesOptions[0] = {
        name: 'MSFT',
        data: <? php echo $MSFT; ?>
    };

    seriesOptions[1] = {
        name: 'AAPL',
        data: <? php echo $AAPL; ?>
    };

    seriesOptions[2] = {
        name: 'FB',
        data: <? php echo $FB; ?>
    };

    function createChart() {

        chart = new Highcharts.StockChart({
            chart: {
                renderTo: 'container'
            },

            rangeSelector: {
                selected: 4
            },

            yAxis: {
                labels: {
                    formatter: function () {
                        return (this.value > 0 ? '+' : '') + this.value + '%';
                    }
                },
                plotLines: [{
                    value: 0,
                    width: 2,
                    color: 'silver'
                }]
            },
            plotOptions: {
                series: {
                    compare: 'percent'
                }
            },
            tooltip: {
                pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
                valueDecimals: 2
            },
            series: seriesOptions
        });
    }
});

Если у вас есть какие-либо вопросы или вам нужна дополнительная информация, пожалуйста, дайте мне знать с комментарием.

Спасибо

Кстати, у меня есть все необходимые активы для работы Highcharts; Когда я заменяю свой JS + PHP на пример кода с сайта Highcharts, он прекрасно работает. Так что проблема явно заключается в моем коде JS + PHP.

Answer 1

Хорошо, я считаю, что я нашел проблему, она заключается в том, как вы храните каждую отдельную точку в массиве.

Вместо этого (который передает строку x,y через запятую):

strtotime($val['Date']) * 1000 . ', ' . (float)$val['Close'];

Вы захотите использовать что-то вроде этого ( Highcharts принимает массивы или ассоциативные массивы):

array((strtotime($val['Date']) * 1000), ((float)$val['Close']));

При этом переменные X и Y будут храниться в виде массива вместо строки, разделенной запятыми, для передачи JavaScript как данных.