219 lines
11 KiB
HTML
219 lines
11 KiB
HTML
|
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||
|
|
<title>Time Series Analysis</title>
|
||
|
|
|
||
|
|
<script type="text/javascript" src="jquery.js"></script>
|
||
|
|
<script type="text/javascript" src="highcharts.js"></script>
|
||
|
|
<script type="text/javascript" src="TSDat.txt"></script>
|
||
|
|
<!-- ----------------------------------------------------------------------------------------- -->
|
||
|
|
<script type="text/javascript">
|
||
|
|
|
||
|
|
Highcharts.theme = {
|
||
|
|
credits:{enabled:false},
|
||
|
|
chart:{borderRadius:1,borderWidth:0,shadow:true,borderColor:'#EAEAEA',spacingRight:25,plotBorderWidth:1,plotBorderColor:'#EAEAEA'},
|
||
|
|
title:{style:{color:'#222',font:'normal 16px "Trebuchet MS",Verdana,Tahoma,Arial,Helvetica,sans-serif'}},
|
||
|
|
subtitle:{style:{color:'#444',font:'normal 12px "Trebuchet MS",Verdana,Tahoma,Arial,Helvetica,sans-serif'}},
|
||
|
|
xAxis:{gridLineWidth:1,lineColor:'#000',tickColor:'#000',startOnTick:false,endOnTick:false,gridLineColor:'#EAEAEA',
|
||
|
|
maxPadding:0.05,minPadding:0.05,
|
||
|
|
labels:{style:{color: '#000',font:'11px Trebuchet MS,Verdana,Tahoma,Arial,Helvetica,sans-serif'}},
|
||
|
|
title:{style:{color:'#444',fontWeight:'normal',fontSize:'12px',fontFamily:'Trebuchet MS,Verdana,Tahoma,Arial,Helvetica,sans-serif'}}
|
||
|
|
},
|
||
|
|
yAxis:{lineColor:'#000',lineWidth:1,tickWidth:1,tickColor:'#000',startOnTick:false,endOnTick:false,gridLineColor:'#EAEAEA',
|
||
|
|
maxPadding:0.05,minPadding:0.05,
|
||
|
|
labels:{style:{color:'#000',font:'11px Trebuchet MS,Verdana,Tahoma,Arial,Helvetica,sans-serif'}},
|
||
|
|
title:{style:{color:'#444',fontWeight:'normal',fontSize:'12px',fontFamily:'Trebuchet MS,Verdana,Tahoma,Arial,Helvetica,sans-serif'}}
|
||
|
|
},
|
||
|
|
legend:{enabled:false},
|
||
|
|
tooltip:{borderWidth:0,borderRadius:1},
|
||
|
|
plotOptions:{scatter:{enableMouseTracking:false,color:'rgb(17,50,110)',marker:{symbol:'diamond',radius:2}},
|
||
|
|
column:{pointPadding:0.1,groupPadding:0,color:'#F0F0F5',borderWidth:2,borderColor:'rgb(20,60,130)',shadow:false},
|
||
|
|
spline:{enableMouseTracking:false,color:'rgba(0,170,0,0.5)',lineWidth:1,shadow:false,enableMouseTracking:false,marker:{enabled:false}},
|
||
|
|
line:{enableMouseTracking:false,color:'rgb(20,60,130)',shadow:false,marker:{enabled:false}}}
|
||
|
|
};
|
||
|
|
var highchartsOptions = Highcharts.setOptions(Highcharts.theme);
|
||
|
|
|
||
|
|
$(document).ready(function(){
|
||
|
|
//------------ Header
|
||
|
|
var tit=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'top',borderWidth:0,shadow:false,backgroundColor:{linearGradient:[0,0,500,500],
|
||
|
|
stops:[[0,'rgb(251,252,255)'],[1,'rgb(223,227,252)']]}},
|
||
|
|
title:{style:{color:'#405A75',font:'normal 10px "Trebuchet MS",Verdana,Tahoma,Arial,Helvetica,sans-serif'},
|
||
|
|
align:'left',y:2,text:'Time Series Analysis. MQL5 language and JavaScript ( Highcharts, jQuery ).'}
|
||
|
|
});
|
||
|
|
//------------ Time series plot
|
||
|
|
var ymin=0;
|
||
|
|
var ymax=0;
|
||
|
|
if(minOut<MinTS)ymin=minOut;else ymin=MinTS;
|
||
|
|
if(maxOut>MaxTS)ymax=maxOut;else ymax=MaxTS;
|
||
|
|
ymin=ymin-(ymax-ymin)/12;ymax=ymax+(ymax-ymin)/12;
|
||
|
|
var ts=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'tseries',zoomType:'x'},
|
||
|
|
title:{text:'Time series plot. Number of samples = '+NumTS+'.'},
|
||
|
|
subtitle:{text:'Time series, mean and border of outliers lines. Click and drag in the plot area to zoom in.'},
|
||
|
|
tooltip:{enabled:true,shared:true,crosshairs:{dashStyle:'Dash'},
|
||
|
|
formatter:function(){return 'N = '+this.x+'<br>'+Highcharts.numberFormat(this.points[0].y,4,'.')}},
|
||
|
|
yAxis:{title:{text:'TS values'},min:ymin,max:ymax,
|
||
|
|
plotLines:[{zIndex:1,color:'#00AA00',dashStyle:'LongDash',width:1,value:Mean},
|
||
|
|
{zIndex:2,color:'#E02020',dashStyle:'LongDash',width:1,value:minOut},
|
||
|
|
{zIndex:3,color:'#E02020',dashStyle:'LongDash',width:1,value:maxOut}]},
|
||
|
|
xAxis:{title:{text:'Sample number'},showLastLabel:true,min:0,max:NumTS-1,maxZoom:NumTS/16},
|
||
|
|
series:[{zIndex:4,data:TS}]
|
||
|
|
});
|
||
|
|
//------------ Lag plot
|
||
|
|
var lp=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'lagplot'},
|
||
|
|
title:{text:'Lag plot.'},
|
||
|
|
yAxis:{title:{text:'TS[n+1]'}},
|
||
|
|
xAxis:{title:{text:'TS[n]'}},
|
||
|
|
series:[{type:'scatter',data:LagP}]
|
||
|
|
});
|
||
|
|
//------------- Histogram
|
||
|
|
var hi=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'hist'},
|
||
|
|
title:{text:'Histogram.'},
|
||
|
|
yAxis:{title:{text:'Probability density'}},
|
||
|
|
xAxis:{title:{text:'Standard deviation'},min:Nd[0][0],max:-Nd[0][0]},
|
||
|
|
tooltip:{enabled:true,formatter:function(){return this.y}},
|
||
|
|
series:[{type:'column',data:HistP},
|
||
|
|
{type:'spline',data:Nd}]
|
||
|
|
});
|
||
|
|
//------------- Normal probability plot
|
||
|
|
var np=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'norm'},
|
||
|
|
title:{text:'Normal probability plot.'},
|
||
|
|
yAxis:{title:{text:'Ordered TS'}},
|
||
|
|
xAxis:{title:{text:'Normal order statistic medians'}},
|
||
|
|
series:[{type:'line',color:'#00AA00',lineWidth:1,dashStyle:'LongDash',shadow:false,data:Ndl},
|
||
|
|
{type:'scatter',data:Xnpp}]
|
||
|
|
});
|
||
|
|
//------------- Spectrum
|
||
|
|
var k = Spec.length;
|
||
|
|
var spe=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'spectr'},
|
||
|
|
title:{text:'Spectral estimation via ACF.'},
|
||
|
|
subtitle:{text:'Number of ACF lags '+NLags+'.'},
|
||
|
|
yAxis:{title:{text:'Spectral levels'},plotLines:[{zIndex:1,color:'rgb(20,60,130)',width:1,value:0}]},
|
||
|
|
xAxis:{title:{text:'Frequency'},showLastLabel:true,min:0,max:k,tickInterval:k/4,
|
||
|
|
labels:{formatter:function(){return this.value/k/2;}}},
|
||
|
|
tooltip:{enabled:true,shared:true,crosshairs:{dashStyle:'Dash'},
|
||
|
|
formatter:function(){return this.points[0].y+'<br>F = '+Highcharts.numberFormat(this.x/k/2,3,'.')}},
|
||
|
|
series:[{type:'line',data:Spec}]
|
||
|
|
});
|
||
|
|
//------------- Statistics (text)
|
||
|
|
var i=0;
|
||
|
|
var tx=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'stat',plotBorderWidth:0},
|
||
|
|
title:{text:''}},
|
||
|
|
function(tx){
|
||
|
|
for(i=0;i<15;i++)
|
||
|
|
{
|
||
|
|
tx.renderer.text(s[i*2],18,25+i*16).css({color:'#445',font:'bold 12px "Courier New",monospace'}).add();
|
||
|
|
tx.renderer.text(s[i*2+1],65,25+i*16).css({color:'#445',font:'bold 12px "Courier New",monospace'}).add();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
//------------- ACF. Autocorrelation function
|
||
|
|
var acf=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'acfunc'},
|
||
|
|
title:{text:'Autocorrelation function.'},
|
||
|
|
subtitle:{text:'Lag order '+NLags+' with 95% confidence bands.'},
|
||
|
|
yAxis:{title:{text:'ACF'},
|
||
|
|
plotLines:[{zIndex:1,color:'rgb(20,60,130)',width:1,value:0},
|
||
|
|
{zIndex:2,color:'rgb(0,170,0)',dashStyle:'LongDash',width:1,value:UPLim},
|
||
|
|
{zIndex:3,color:'rgb(0,170,0)',dashStyle:'LongDash',width:1,value:-UPLim}]},
|
||
|
|
xAxis:{title:{text:'Lag'},min:0,max:NLags+1},
|
||
|
|
tooltip:{enabled:true,formatter:function(){return 'N = '+this.x+'<br>'+this.y}},
|
||
|
|
series:[{type:'spline',dashStyle:'LongDash',color:'rgb(224,32,32)',data:CBup},
|
||
|
|
{type:'spline',dashStyle:'LongDash',color:'rgb(224,32,32)',data:CBlo},
|
||
|
|
{type:'column',pointPadding:0.1,groupPadding:0.2,borderWidth:0,color:'rgba(20,60,130,0.85)',data:ACF}]
|
||
|
|
});
|
||
|
|
//------------- PACF. Partial Autocorrelation function
|
||
|
|
var pacf=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'pacfunc'},
|
||
|
|
title:{text:'Partial autocorrelation function.'},
|
||
|
|
subtitle:{text:'Lag order '+NLags+' with 95% confidence bands.'},
|
||
|
|
yAxis:{title:{text:'PACF'},
|
||
|
|
plotLines:[{zIndex:1,color:'rgb(20,60,130)',width:1,value:0},
|
||
|
|
{zIndex:2,color:'rgb(0,170,0)',dashStyle:'LongDash',width:1,value:UPLim},
|
||
|
|
{zIndex:3,color:'rgb(0,170,0)',dashStyle:'LongDash',width:1,value:-UPLim}]},
|
||
|
|
xAxis:{title:{text:'Lag'},min:0,max:NLags+1},
|
||
|
|
tooltip:{enabled:true,formatter:function(){return 'N = '+this.x+'<br>'+this.y}},
|
||
|
|
series:[{type:'spline',dashStyle:'LongDash',color:'rgb(224,32,32)',data:CBup},
|
||
|
|
{type:'spline',dashStyle:'LongDash',color:'rgb(224,32,32)',data:CBlo},
|
||
|
|
{type:'column',pointPadding:0.1,groupPadding:0.2,borderWidth:0,color:'rgba(20,60,130,0.85)',data:PACF}]
|
||
|
|
});
|
||
|
|
//------------ Maximum entropy spectral estimation
|
||
|
|
var n = ARSp.length;
|
||
|
|
var ars=new Highcharts.Chart({
|
||
|
|
chart:{renderTo:'arspectr',zoomType:'x'},
|
||
|
|
title:{text:'Maximum entropy spectral estimation. Model order '+IP+'.'},
|
||
|
|
subtitle:{text:'Click and drag in the plot area to zoom in.'},
|
||
|
|
yAxis:{title:{text:'Power spectral density, dB'},tickInterval:10},
|
||
|
|
xAxis:{title:{text:'Frequency'},showLastLabel:true,min:0,max:n,maxZoom:n/16,tickInterval:n/8,
|
||
|
|
labels:{formatter:function(){return this.value/n/2;}}},
|
||
|
|
tooltip:{enabled:true,shared:true,crosshairs:{dashStyle:'Dash'},
|
||
|
|
formatter:function(){return this.points[0].y+' db'+
|
||
|
|
'<br>F = '+Highcharts.numberFormat(this.x/n/2,4,'.')+
|
||
|
|
'<br>T = '+Highcharts.numberFormat(2*n/this.x,4,'.')}},
|
||
|
|
series:[{type:'line',data:ARSp}]
|
||
|
|
});
|
||
|
|
//------------ Footer
|
||
|
|
var fo=new Highcharts.Chart({
|
||
|
|
credits:{enabled:true},
|
||
|
|
chart:{renderTo:'foot',borderWidth:0,shadow:false,backgroundColor:{linearGradient:[0,0,500,500],
|
||
|
|
stops:[[0,'rgb(251,252,255)'],[1,'rgb(223,227,252)']]}},
|
||
|
|
title:{style:{color:'#405A75',font:'normal 10px "Trebuchet MS",Verdana,Tahoma,Arial,Helvetica,sans-serif'},
|
||
|
|
align:'left',y:2,text:'MetaTrader 5. MetaQuotes Software Corp.'}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
<!-- ----------------------------------------------------------------------------------------- -->
|
||
|
|
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<table border=0 cellspacing=0>
|
||
|
|
<tr>
|
||
|
|
<td><div id="top" style="width:994px; height:20px; margin:0 auto"></div></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
<table border=0 cellspacing=0>
|
||
|
|
<tr>
|
||
|
|
<td><div id="tseries" style="width:662px; height:270px; margin:0 auto"></div></td>
|
||
|
|
<td><div id="lagplot" style="width:330px; height:270px; margin:0 auto"></div></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
<table border=0 cellspacing=0>
|
||
|
|
<tr>
|
||
|
|
<td><div id="hist" style="width:330px; height:270px; margin:0 auto"></div></td>
|
||
|
|
<td><div id="norm" style="width:330px; height:270px; margin:0 auto"></div></td>
|
||
|
|
<td><div id="spectr" style="width:330px; height:270px; margin:0 auto"></div></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
<table border=0 cellspacing=0>
|
||
|
|
<tr>
|
||
|
|
<td><div id="stat" style="width:170px; height:270px; margin:0 auto"></div></td>
|
||
|
|
<td><div id="acfunc" style="width:410px; height:270px; margin:0 auto"></div></td>
|
||
|
|
<td><div id="pacfunc" style="width:410px; height:270px; margin:0 auto"></div></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
<table border=0 cellspacing=0>
|
||
|
|
<tr>
|
||
|
|
<td><div id="arspectr" style="width:994px; height:270px; margin:0 auto"></div></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
|
||
|
|
<table border=0 cellspacing=0>
|
||
|
|
<tr>
|
||
|
|
<td><div id="foot" style="width:994px; height:20px; margin:0 auto"></div></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|