Javascript错误从JSON回显接收数据

时间:2019-04-28 11:41:12

标签: javascript php json ajax highcharts

我正在尝试创建一个带有交易量的烛台图表。 烛台图工作正常,问题在于交易量。

我所拥有的:

imgur image

我需要什么:

imgur image

datachart.php->它发送JSON数据。

我认为错误出在$ data []中,因为脚本index.htm无法识别卷数据。

<?php
include '../dbh.php';//It connects to the database

$sql = "SELECT * FROM table ORDER BY date ASC";
$result = $conn->query($sql);

$data = array();
$count = 0;
while ($row = mysqli_fetch_array($result))
{
  $newdate = strtotime($row['date']) * 1000; 
  $data[] = array($newdate, (float)$row['open'], (float)$row['high'], (float)$row['low'], (float)$row['close'], (float)$row['volume']);
  $count++;
}   
echo json_encode($data);
?>

index.htm

$.getJSON('datachart.php', function (data) {

// split the data set into ohlc and volume
var ohlc = [],
    volume = [],
    dataLength = data.length,
    // set the allowed units for data grouping
    groupingUnits = [[
        'week',                         // unit name
        [1]                             // allowed multiples
    ], [
        'month',
        [1, 2, 3, 4, 6]
    ]],

    i = 0;

for (i; i < dataLength; i += 1) {
    ohlc.push([
        data[i][0], // the date
        data[i][1], // open
        data[i][2], // high
        data[i][3], // low
        data[i][4] // close
    ]);

    volume.push([
        data[i][0], // the date
        data[i][5] // the volume
    ]);
}


// create the chart
Highcharts.stockChart('container', {

    rangeSelector: {
        selected: 1
    },

    title: {
        text: 'Exchange Market'
    },

    yAxis: [{
        labels: {
            align: 'right',
            x: -3
        },
        title: {
            text: 'OHLC'
        },
        height: '60%',
        lineWidth: 2,
        resize: {
            enabled: true
        }
    }, {
        labels: {
            align: 'right',
            x: -3
        },
        title: {
            text: 'Volume'
        },
        top: '65%',
        height: '35%',
        offset: 0,
        lineWidth: 2
    }],

    tooltip: {
        split: true
    },

    series: [{
        type: 'candlestick',
        name: 'AAPL',
        data: ohlc,
        dataGrouping: {
            units: groupingUnits
        }
    }, {
        type: 'column',
        name: 'Volume',
        data: volume,
        yAxis: 1,
        dataGrouping: {
            units: groupingUnits
        }
    }]
});
});

如果仅采用index.htm代码的这一部分:

volume.push([
    data[i][0], // the date
    data[i][5] // the volume
]);

如果将“ 5”更改为1,2,3或4,则会绘制体积图。那么,如果体积在第5位,为什么不用“ 5”绘制图形呢?

0 个答案:

没有答案