Difference between revisions of "Display stock quotes from Yahoo!"

From JSXGraph Wiki
Jump to navigationJump to search
Line 33: Line 33:
 
                     x[0] += 1; // for shadows of horizontal lines.
 
                     x[0] += 1; // for shadows of horizontal lines.
 
                     g = brd.createElement('curve', [x,y],{strokeWidth:3, strokeColor:'green',shadow:true});  
 
                     g = brd.createElement('curve', [x,y],{strokeWidth:3, strokeColor:'green',shadow:true});  
                     txt = brd.createElement('text', [3,(hi+lo)*0.5,function(){return 'GDAXI = '+val;}],{fontSize:'14px'});  
+
                     txt = brd.createElement('text', [3,(hi+lo)*0.5,function(){return 'GDAXI = '+val;}],{fontSize:14});  
 
                     brd.createElement('functiongraph',[JXG.Math.Numerics.regressionPolynomial(1,g.dataX,g.dataY)],{strokecolor:'red',dash:3});
 
                     brd.createElement('functiongraph',[JXG.Math.Numerics.regressionPolynomial(1,g.dataX,g.dataY)],{strokecolor:'red',dash:3});
 
                 } else {
 
                 } else {
Line 95: Line 95:
 
                 if (!g) {  
 
                 if (!g) {  
 
                     g = brd.createElement('curve', [x,y],{strokeWidth:3, strokeColor:'green',shadow:true});  
 
                     g = brd.createElement('curve', [x,y],{strokeWidth:3, strokeColor:'green',shadow:true});  
                     txt = brd.createElement('text', [3,(hi+lo)*0.5,function(){return 'GDAXI = '+val;}],{fontSize:'14px'});  
+
                     txt = brd.createElement('text', [3,(hi+lo)*0.5,function(){return 'GDAXI = '+val;}],{fontSize:14});  
 
                     brd.createElement('functiongraph',[JXG.Math.Numerics.regressionPolynomial(1,g.dataX,g.dataY)],{strokecolor:'red',dash:3});
 
                     brd.createElement('functiongraph',[JXG.Math.Numerics.regressionPolynomial(1,g.dataX,g.dataY)],{strokecolor:'red',dash:3});
 
                 } else {
 
                 } else {

Revision as of 18:48, 14 January 2012

This JSXGraph application fetches the live stock quotes of the German DAX Index (gdaxi) from Yahoo!. The curve is updated only once a second, so initially it needs a little patience until the curve is visible.

Beware that in order to simplify the handling of AJAX we use the additional library prototype.js in this example.

The underlying JavaScript code

var hi, lo, brd, periodical, 
    brd, g, txt, val,
    x = [],
    y = [];


fetchData = function() {
    new Ajax.Request('/ajax/stockquotes.php', {
        onComplete: function(transport) {
            var t, a;
            if (200 == transport.status) {
                t = transport.responseText;
                a = t.split(',');
                x.push(x.length+1);
                y.push(a[1]);
                val = a[1];  // set the text
                if (!g) { 
                    g = brd.createElement('curve', [x,y],{strokeWidth:3, strokeColor:'green',shadow:true}); 
                    txt = brd.createElement('text', [3,(hi+lo)*0.5,function(){return 'GDAXI = '+val;}],{fontSize:14}); 
                    brd.createElement('functiongraph',[JXG.Math.Numerics.regressionPolynomial(1,g.dataX,g.dataY)],{strokecolor:'red',dash:3});
                } else {
                    g.dataX = x;                    
                    g.dataY = y;
                }
                brd.update();
            };
    }});
};

// Fetch max and min, and start the periodical update.
new Ajax.Request('/ajax/stockquotes.php', {
        onComplete: function(transport) {
            var a, t;
            if (200 == transport.status) {
                t = transport.responseText;
                a = t.split(',');
                hi = a[6]*1.00002;
                lo = a[7]*0.99998;
                brd = JXG.JSXGraph.initBoard('jxgbox', {axis:true, boundingbox:[0,hi,200,lo]});
                brd.createElement('axis',[[0,lo],[1,lo]]);
                Start();
            };
    }});


Start = function() {
   if (periodical==null) {
      periodical = setInterval(fetchData,1000);  // Start the periodical update
   }
};

Stop = function() {
   if (periodical!=null) {
       clearInterval(periodical);
       periodical = null;
   }
};

The PHP code

<?php
$fp = fopen ("http://finance.yahoo.com/d/quotes.csv?s=^gdaxi&f=sl1d1t1c1ohgv&e=.csv","r");
echo fgets ($fp, 1024);
fclose ($fp);
?>