Skip to content

Instantly share code, notes, and snippets.

@andredumas andredumas/README.md forked from fojt/data.csv
Last active Sep 28, 2016

Embed
What would you like to do?
TechanJS Aroon

Aroon calculation and rendering demo.

Date Open High Low Close Volume
19-Sep-14 77.40 78.30 76.44 77.91 76671330
18-Sep-14 76.77 77.33 76.52 77.00 23030936
17-Sep-14 75.96 77.25 75.57 76.43 28693348
16-Sep-14 73.52 76.23 73.07 76.08 37742482
15-Sep-14 77.15 77.25 73.43 74.58 49679130
12-Sep-14 78.02 78.30 77.10 77.48 26744356
11-Sep-14 77.13 78.36 77.05 77.92 32247724
10-Sep-14 76.52 77.95 76.51 77.43 29908606
9-Sep-14 77.59 78.17 76.20 76.67 28881803
8-Sep-14 77.26 78.17 77.01 77.89 28183156
5-Sep-14 76.10 77.38 75.60 77.26 29475854
4-Sep-14 75.89 76.93 75.53 75.95 26676444
3-Sep-14 77.14 77.48 75.60 75.83 32389102
2-Sep-14 75.01 76.70 74.82 76.68 34979438
29-Aug-14 74.30 74.82 74.01 74.82 26241162
28-Aug-14 74.00 74.43 73.73 73.86 21946738
27-Aug-14 75.27 75.49 74.46 74.63 36323060
26-Aug-14 75.00 75.99 74.73 75.96 23992668
25-Aug-14 74.94 75.28 74.79 75.02 19734103
22-Aug-14 74.34 74.73 73.57 74.57 20897393
21-Aug-14 74.92 75.19 74.41 74.57 20101979
20-Aug-14 74.97 75.18 74.62 74.81 22916678
19-Aug-14 74.81 75.58 74.77 75.29 26678640
18-Aug-14 74.00 74.72 73.96 74.59 23973658
15-Aug-14 74.32 74.65 73.00 73.63 38909161
14-Aug-14 73.97 74.38 73.69 74.30 22207019
13-Aug-14 73.12 74.25 73.05 73.77 29265662
12-Aug-14 73.09 73.33 72.22 72.83 27418983
11-Aug-14 73.46 73.91 73.06 73.44 24591177
8-Aug-14 73.40 73.43 72.56 73.06 27202325
7-Aug-14 73.00 74.00 72.70 73.17 38140550
6-Aug-14 72.02 73.72 71.79 72.47 30985533
5-Aug-14 73.51 73.59 72.18 72.69 34986147
4-Aug-14 72.36 73.88 72.36 73.51 30776819
1-Aug-14 72.22 73.22 71.55 72.36 43535314
31-Jul-14 74.00 74.16 72.44 72.65 43991772
30-Jul-14 74.21 75.19 74.13 74.68 36853018
29-Jul-14 74.72 74.92 73.42 73.71 41324470
28-Jul-14 75.17 75.50 73.85 74.92 41725249
25-Jul-14 74.99 75.67 74.66 75.19 45917435
24-Jul-14 75.96 76.74 74.51 74.98 124167936
23-Jul-14 69.74 71.33 69.61 71.29 78434716
22-Jul-14 69.76 69.77 68.61 69.27 40397693
21-Jul-14 68.81 69.96 68.50 69.40 49539121
18-Jul-14 66.80 68.46 66.16 68.42 42455649
17-Jul-14 67.03 67.85 66.04 66.41 38188432
16-Jul-14 67.54 67.94 67.07 67.66 29593589
15-Jul-14 67.96 68.09 66.26 67.16 44292944
14-Jul-14 67.13 68.17 66.90 67.90 38536924
11-Jul-14 65.28 66.59 64.79 66.34 39212022
10-Jul-14 63.31 65.34 63.05 64.87 44421915
9-Jul-14 63.41 65.12 63.15 64.97 51431582
8-Jul-14 65.06 65.56 62.21 62.76 68926036
7-Jul-14 66.30 66.57 65.12 65.29 28745099
3-Jul-14 66.86 67.00 65.76 66.29 25203215
2-Jul-14 68.04 68.30 65.79 66.45 41895220
1-Jul-14 67.58 68.44 67.39 68.06 33243166
30-Jun-14 67.46 67.92 67.13 67.29 27201749
27-Jun-14 67.31 67.70 66.84 67.60 46460627
26-Jun-14 68.00 68.00 66.90 67.13 47713944
25-Jun-14 65.58 67.48 65.57 67.44 44308249
24-Jun-14 65.36 67.17 65.27 65.72 57334867
23-Jun-14 64.32 65.66 64.22 65.37 34560121
20-Jun-14 64.46 64.81 63.35 64.50 46466073
19-Jun-14 65.46 65.58 64.21 64.34 34245182
18-Jun-14 64.49 65.75 64.05 65.60 35570154
17-Jun-14 64.10 64.88 63.93 64.40 27714816
16-Jun-14 64.16 64.88 63.75 64.19 31045811
13-Jun-14 64.70 64.97 63.83 64.50 29418910
12-Jun-14 65.85 66.47 64.06 64.29 55729828
11-Jun-14 65.32 65.80 64.90 65.78 44241926
10-Jun-14 63.53 65.82 63.50 65.77 69338140
9-Jun-14 62.40 63.34 61.79 62.88 37617413
6-Jun-14 63.37 63.48 62.15 62.50 42442096
5-Jun-14 63.66 64.36 62.82 63.19 47352368
4-Jun-14 62.45 63.59 62.07 63.34 36513991
3-Jun-14 62.62 63.42 62.32 62.87 32216707
2-Jun-14 63.23 63.59 62.05 63.08 35995537
30-May-14 63.95 64.17 62.56 63.30 45283577
29-May-14 63.84 64.30 63.51 63.83 42699670
28-May-14 63.39 64.14 62.62 63.51 47795088
27-May-14 61.62 63.51 61.57 63.48 55681663
23-May-14 60.41 61.45 60.15 61.35 38293993
22-May-14 60.94 61.48 60.40 60.52 54200116
21-May-14 58.56 60.50 58.25 60.49 58991505
20-May-14 59.50 60.19 58.18 58.56 53931469
19-May-14 57.89 59.56 57.57 59.21 43033925
16-May-14 58.31 58.45 57.31 58.02 47933075
15-May-14 59.26 59.38 57.52 57.92 56813940
14-May-14 59.53 60.45 58.95 59.23 47428583
13-May-14 59.66 60.89 59.51 59.83 48525476
12-May-14 57.98 59.90 57.98 59.83 48575487
9-May-14 56.85 57.65 56.38 57.24 52583858
8-May-14 57.23 58.82 56.50 56.76 61251053
7-May-14 58.77 59.30 56.26 57.39 78587247
6-May-14 60.98 61.15 58.49 58.53 55900809
5-May-14 59.67 61.35 59.18 61.22 46057411
2-May-14 61.30 61.89 60.18 60.46 54189197
1-May-14 60.43 62.28 60.21 61.15 82428606
30-Apr-14 57.58 59.85 57.16 59.78 76093004
29-Apr-14 56.09 58.28 55.84 58.15 75557202
28-Apr-14 58.05 58.31 54.66 56.14 107757756
25-Apr-14 59.97 60.01 57.57 57.71 92501529
24-Apr-14 63.60 63.65 59.77 60.87 138769345
23-Apr-14 63.45 63.48 61.26 61.36 96564750
22-Apr-14 62.65 63.44 62.22 63.03 60631312
21-Apr-14 59.46 61.24 59.15 61.24 60363619
17-Apr-14 59.30 60.58 58.72 58.94 88040346
16-Apr-14 59.79 60.19 57.74 59.72 78773521
15-Apr-14 59.29 59.68 55.88 59.09 108622706
14-Apr-14 60.09 60.45 57.78 58.89 72324603
11-Apr-14 57.60 60.31 57.31 58.53 91451960
10-Apr-14 63.08 63.18 58.68 59.16 114987616
9-Apr-14 59.63 62.46 59.19 62.41 100215307
8-Apr-14 57.68 58.71 57.17 58.19 78835935
7-Apr-14 55.90 58.00 55.44 56.95 108487569
4-Apr-14 59.94 60.20 56.32 56.75 125465774
3-Apr-14 62.55 63.17 59.13 59.49 83859330
2-Apr-14 63.21 63.91 62.21 62.72 66276613
1-Apr-14 60.46 62.66 60.24 62.62 59291210
31-Mar-14 60.78 61.52 59.87 60.24 53011205
28-Mar-14 61.34 61.95 59.34 60.01 67051528
27-Mar-14 60.51 61.90 57.98 60.97 112649694
26-Mar-14 64.74 64.95 60.37 60.38 97689774
25-Mar-14 64.89 66.19 63.78 64.89 68785500
24-Mar-14 67.19 67.36 63.36 64.10 85695872
21-Mar-14 67.53 67.92 66.18 67.24 60041228
20-Mar-14 68.01 68.23 66.82 66.97 44438500
19-Mar-14 69.17 69.29 67.46 68.24 43980558
18-Mar-14 68.76 69.60 68.30 69.19 40827226
17-Mar-14 68.18 68.95 66.62 68.74 52196699
14-Mar-14 68.49 69.43 67.46 67.72 48226824
13-Mar-14 71.29 71.35 68.15 68.83 57091157
12-Mar-14 69.86 71.35 69.00 70.88 46400431
11-Mar-14 72.50 72.59 69.96 70.10 59615238
10-Mar-14 70.77 72.15 70.51 72.03 59949746
7-Mar-14 71.08 71.18 69.47 69.80 38985763
6-Mar-14 71.88 71.89 70.25 70.84 46126260
5-Mar-14 69.69 71.97 69.62 71.57 74649486
4-Mar-14 68.66 68.90 67.62 68.80 42164222
3-Mar-14 66.96 68.05 66.51 67.41 56900444
<!DOCTYPE html>
<meta charset="utf-8">
<style>
body {
font: 10px sans-serif;
}
text {
fill: #000;
}
button {
position: absolute;
right: 20px;
top: 440px;
display: none;
}
.aroon path {
fill: none;
stroke-width: 1;
}
.aroon {
stroke: #000000;
}
.aroon.up {
stroke: #00AA00;
stroke-width: 1.5;
}
.aroon.down {
stroke: #FF0000;
stroke-width: 1.5;
}
.aroon.oscillator {
stroke: #0000FF;
stroke-width: 0.5;
}
.aroon.oscillatorArea{
fill: #0000FF;
opacity:0.025;
}
.aroon path.overbought, .aroon path.oversold {
stroke: #FF9999;
stroke-width: 1;
stroke-dasharray: 2, 2;
}
.aroon path.middle, path.zero {
stroke: #BBBBBB;
stroke-dasharray: 5, 5;
}
</style>
<body>
<button>Update</button>
<script src="http://d3js.org/d3.v4.min.js"></script>
<script src="http://techanjs.org/techan.min.js"></script>
<script>
var margin = {top: 20, right: 20, bottom: 30, left: 50},
width = 960 - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
var parseDate = d3.timeParse("%d-%b-%y");
var x = techan.scale.financetime()
.range([0, width]);
var y = d3.scaleLinear()
.range([height, 0]);
var aroon = techan.plot.aroon()
.xScale(x)
.yScale(y);
var accessor = aroon.accessor();
var xAxis = d3.axisBottom(x);
var yAxis = d3.axisLeft(y)
.tickFormat(d3.format(",.3s"));
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
d3.csv("data.csv", function(error, data) {
data = data.map(function(d) {
// Open, high, low, close generally not required, is being used here to demonstrate colored volume
// bars
return {
date: parseDate(d.Date),
volume: +d.Volume,
open: +d.Open,
high: +d.High,
low: +d.Low,
close: +d.Close
};
}).sort(function(a, b) { return d3.ascending(accessor.d(a), accessor.d(b)); });
svg.append("g")
.attr("class", "aroon");
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")");
svg.append("g")
.attr("class", "y axis")
.append("text")
.attr("transform", "rotate(-90)")
.attr("y", 6)
.attr("dy", ".71em")
.style("text-anchor", "end")
.text("Aroon");
// Data to display initially
draw(data.slice(0, data.length-20));
// Only want this button to be active if the data has loaded
d3.select("button").on("click", function() { draw(data); }).style("display", "inline");
});
function draw(data) {
var aroonData = techan.indicator.aroon()(data);
x.domain(aroonData.map(accessor.d));
y.domain(techan.scale.plot.aroon().domain());
svg.selectAll("g.aroon").datum(aroonData).call(aroon);
svg.selectAll("g.x.axis").call(xAxis);
svg.selectAll("g.y.axis").call(yAxis);
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.