Question

这是我用于显示实时比特币图表的高图表代码。我真的是PHP，JavaScript等的菜鸟，所以我真的需要帮助将此代码转换为nvd3.js

PHP代码：

<?php
// Set the JSON header
header("Content-type: text/json");

function getPrice($url){
$decode = file_get_contents($url);
return json_decode($decode, true);
}



$btce = getPrice('https://btc-e.com/api/2/btc_usd/ticker');
$btcePrice = round($btce["ticker"]["last"], 2);

// The x value is the current JavaScript time, which is the Unix time multiplied 
// by 1000.
$x = time() * 1000;
// The y value is a random number
// Create a PHP array and echo it as JSON
$ret = array($x, $btcePrice);
echo json_encode($ret);
?>

HTML和Javascript代码：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
</head>
<body>
<script type="text/javascript">
var chart; // global


/**
 * Request data from the server, add it to the graph and set a timeout 
 * to request again
 */
function requestData() {
$.ajax({
url: 'x.php',
success: function(point) {
var series = chart.series[0],
shift = series.data.length > 175; // shift if the series is longer than 20
        // add the point
        chart.series[0].addPoint(point, true, shift);

        // call it again after one second
        setTimeout(requestData, 3000);    
    },
    cache: false
});
}

$(document).ready(function() {
chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        defaultSeriesType: 'spline',
        events: {
            load: requestData
        }
    },
    title: {
        text: 'Average price chart'
    },
    xAxis: {
        type: 'datetime',
        tickPixelInterval: 150,
        maxZoom: 20 * 1000
    },
    yAxis: {
        minPadding: 0.2,
        maxPadding: 0.2,
        title: {
            text: 'USD',
            margin: 80
        }
    },
    series: [{
        name: 'Live BTC USD Chart',
        data: []
    }]
});        
});

</script>
<div id="container" style="width:100%; height:400px;"></div>
</body>
</html>

任何有关解释如何将此代码转换为使用nvd3.js的帮助将不胜感激谢谢！

如何将高图表代码转换为nvd3.js

0 个答案: