Skip to content

Instantly share code, notes, and snippets.

@arpitnarechania
Last active February 25, 2017 10:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save arpitnarechania/41d53792f562df4a2ad6f704ef242af5 to your computer and use it in GitHub Desktop.
Save arpitnarechania/41d53792f562df4a2ad6f704ef242af5 to your computer and use it in GitHub Desktop.
Kagi Chart
var data = [
{
"date": "2015-01-02",
"close": 109.330002
},
{
"date": "2015-01-05",
"close": 106.25
},
{
"date": "2015-01-06",
"close": 106.260002
},
{
"date": "2015-01-07",
"close": 107.75
},
{
"date": "2015-01-08",
"close": 111.889999
},
{
"date": "2015-01-09",
"close": 112.010002
},
{
"date": "2015-01-12",
"close": 109.25
},
{
"date": "2015-01-13",
"close": 110.220001
},
{
"date": "2015-01-14",
"close": 109.800003
},
{
"date": "2015-01-15",
"close": 106.82
},
{
"date": "2015-01-16",
"close": 105.989998
},
{
"date": "2015-01-20",
"close": 108.720001
},
{
"date": "2015-01-21",
"close": 109.550003
},
{
"date": "2015-01-22",
"close": 112.400002
},
{
"date": "2015-01-23",
"close": 112.980003
},
{
"date": "2015-01-26",
"close": 113.099998
},
{
"date": "2015-01-27",
"close": 109.139999
},
{
"date": "2015-01-28",
"close": 115.309998
},
{
"date": "2015-01-29",
"close": 118.900002
},
{
"date": "2015-01-30",
"close": 117.160004
},
{
"date": "2015-02-02",
"close": 118.629997
},
{
"date": "2015-02-03",
"close": 118.650002
},
{
"date": "2015-02-04",
"close": 119.559998
},
{
"date": "2015-02-05",
"close": 119.940002
},
{
"date": "2015-02-06",
"close": 118.93
},
{
"date": "2015-02-09",
"close": 119.720001
},
{
"date": "2015-02-10",
"close": 122.019997
},
{
"date": "2015-02-11",
"close": 124.879997
},
{
"date": "2015-02-12",
"close": 126.459999
},
{
"date": "2015-02-13",
"close": 127.080002
},
{
"date": "2015-02-17",
"close": 127.830002
},
{
"date": "2015-02-18",
"close": 128.720001
},
{
"date": "2015-02-19",
"close": 128.449997
},
{
"date": "2015-02-20",
"close": 129.5
},
{
"date": "2015-02-23",
"close": 133
},
{
"date": "2015-02-24",
"close": 132.169998
},
{
"date": "2015-02-25",
"close": 128.789993
},
{
"date": "2015-02-26",
"close": 130.419998
},
{
"date": "2015-02-27",
"close": 128.460007
},
{
"date": "2015-03-02",
"close": 129.089996
},
{
"date": "2015-03-03",
"close": 129.360001
},
{
"date": "2015-03-04",
"close": 128.539993
},
{
"date": "2015-03-05",
"close": 126.410004
},
{
"date": "2015-03-06",
"close": 126.599998
},
{
"date": "2015-03-09",
"close": 127.139999
},
{
"date": "2015-03-10",
"close": 124.510002
},
{
"date": "2015-03-11",
"close": 122.239998
},
{
"date": "2015-03-12",
"close": 124.449997
},
{
"date": "2015-03-13",
"close": 123.589996
},
{
"date": "2015-03-16",
"close": 124.949997
},
{
"date": "2015-03-17",
"close": 127.040001
},
{
"date": "2015-03-18",
"close": 128.470001
},
{
"date": "2015-03-19",
"close": 127.5
},
{
"date": "2015-03-20",
"close": 125.900002
},
{
"date": "2015-03-23",
"close": 127.209999
},
{
"date": "2015-03-24",
"close": 126.690002
},
{
"date": "2015-03-25",
"close": 123.379997
},
{
"date": "2015-03-26",
"close": 124.239998
},
{
"date": "2015-03-27",
"close": 123.25
},
{
"date": "2015-03-30",
"close": 126.370003
},
{
"date": "2015-03-31",
"close": 124.43
},
{
"date": "2015-04-01",
"close": 124.25
},
{
"date": "2015-04-02",
"close": 125.32
},
{
"date": "2015-04-06",
"close": 127.349998
},
{
"date": "2015-04-07",
"close": 126.010002
},
{
"date": "2015-04-08",
"close": 125.599998
},
{
"date": "2015-04-09",
"close": 126.559998
},
{
"date": "2015-04-10",
"close": 127.099998
},
{
"date": "2015-04-13",
"close": 126.849998
},
{
"date": "2015-04-14",
"close": 126.300003
},
{
"date": "2015-04-15",
"close": 126.779999
},
{
"date": "2015-04-16",
"close": 126.169998
},
{
"date": "2015-04-17",
"close": 124.75
},
{
"date": "2015-04-20",
"close": 127.599998
},
{
"date": "2015-04-21",
"close": 126.910004
},
{
"date": "2015-04-22",
"close": 128.619995
},
{
"date": "2015-04-23",
"close": 129.669998
},
{
"date": "2015-04-24",
"close": 130.279999
},
{
"date": "2015-04-27",
"close": 132.649994
},
{
"date": "2015-04-28",
"close": 130.559998
},
{
"date": "2015-04-29",
"close": 128.639999
},
{
"date": "2015-04-30",
"close": 125.150002
},
{
"date": "2015-05-01",
"close": 128.949997
},
{
"date": "2015-05-04",
"close": 128.699997
},
{
"date": "2015-05-05",
"close": 125.800003
},
{
"date": "2015-05-06",
"close": 125.010002
},
{
"date": "2015-05-07",
"close": 125.260002
},
{
"date": "2015-05-08",
"close": 127.620003
},
{
"date": "2015-05-11",
"close": 126.32
},
{
"date": "2015-05-12",
"close": 125.870003
},
{
"date": "2015-05-13",
"close": 126.010002
},
{
"date": "2015-05-14",
"close": 128.949997
},
{
"date": "2015-05-15",
"close": 128.770004
},
{
"date": "2015-05-18",
"close": 130.190002
},
{
"date": "2015-05-19",
"close": 130.070007
},
{
"date": "2015-05-20",
"close": 130.059998
},
{
"date": "2015-05-21",
"close": 131.389999
},
{
"date": "2015-05-22",
"close": 132.539993
},
{
"date": "2015-05-26",
"close": 129.619995
},
{
"date": "2015-05-27",
"close": 132.039993
},
{
"date": "2015-05-28",
"close": 131.779999
},
{
"date": "2015-05-29",
"close": 130.279999
},
{
"date": "2015-06-01",
"close": 130.539993
},
{
"date": "2015-06-02",
"close": 129.960007
},
{
"date": "2015-06-03",
"close": 130.119995
},
{
"date": "2015-06-04",
"close": 129.360001
},
{
"date": "2015-06-05",
"close": 128.649994
},
{
"date": "2015-06-08",
"close": 127.800003
},
{
"date": "2015-06-09",
"close": 127.419998
},
{
"date": "2015-06-10",
"close": 128.880005
},
{
"date": "2015-06-11",
"close": 128.589996
},
{
"date": "2015-06-12",
"close": 127.169998
},
{
"date": "2015-06-15",
"close": 126.919998
},
{
"date": "2015-06-16",
"close": 127.599998
},
{
"date": "2015-06-17",
"close": 127.300003
},
{
"date": "2015-06-18",
"close": 127.879997
},
{
"date": "2015-06-19",
"close": 126.599998
},
{
"date": "2015-06-22",
"close": 127.610001
},
{
"date": "2015-06-23",
"close": 127.029999
},
{
"date": "2015-06-24",
"close": 128.110001
},
{
"date": "2015-06-25",
"close": 127.5
},
{
"date": "2015-06-26",
"close": 126.75
},
{
"date": "2015-06-29",
"close": 124.529999
},
{
"date": "2015-06-30",
"close": 125.43
},
{
"date": "2015-07-01",
"close": 126.599998
},
{
"date": "2015-07-02",
"close": 126.440002
},
{
"date": "2015-07-06",
"close": 126
},
{
"date": "2015-07-07",
"close": 125.690002
},
{
"date": "2015-07-08",
"close": 122.57
},
{
"date": "2015-07-09",
"close": 120.07
},
{
"date": "2015-07-10",
"close": 123.279999
},
{
"date": "2015-07-13",
"close": 125.660004
},
{
"date": "2015-07-14",
"close": 125.610001
},
{
"date": "2015-07-15",
"close": 126.82
},
{
"date": "2015-07-16",
"close": 128.509995
},
{
"date": "2015-07-17",
"close": 129.619995
},
{
"date": "2015-07-20",
"close": 132.070007
},
{
"date": "2015-07-21",
"close": 130.75
},
{
"date": "2015-07-22",
"close": 125.220001
},
{
"date": "2015-07-23",
"close": 125.160004
},
{
"date": "2015-07-24",
"close": 124.5
},
{
"date": "2015-07-27",
"close": 122.769997
},
{
"date": "2015-07-28",
"close": 123.379997
},
{
"date": "2015-07-29",
"close": 122.989998
},
{
"date": "2015-07-30",
"close": 122.370003
},
{
"date": "2015-07-31",
"close": 121.300003
},
{
"date": "2015-08-03",
"close": 118.440002
},
{
"date": "2015-08-04",
"close": 114.639999
},
{
"date": "2015-08-05",
"close": 115.400002
},
{
"date": "2015-08-06",
"close": 115.129997
},
{
"date": "2015-08-07",
"close": 115.519997
},
{
"date": "2015-08-10",
"close": 119.720001
},
{
"date": "2015-08-11",
"close": 113.489998
},
{
"date": "2015-08-12",
"close": 115.239998
},
{
"date": "2015-08-13",
"close": 115.150002
},
{
"date": "2015-08-14",
"close": 115.959999
},
{
"date": "2015-08-17",
"close": 117.160004
},
{
"date": "2015-08-18",
"close": 116.5
},
{
"date": "2015-08-19",
"close": 115.010002
},
{
"date": "2015-08-20",
"close": 112.650002
},
{
"date": "2015-08-21",
"close": 105.760002
},
{
"date": "2015-08-24",
"close": 103.120003
},
{
"date": "2015-08-25",
"close": 103.739998
},
{
"date": "2015-08-26",
"close": 109.690002
},
{
"date": "2015-08-27",
"close": 112.919998
},
{
"date": "2015-08-28",
"close": 113.290001
},
{
"date": "2015-08-31",
"close": 112.760002
},
{
"date": "2015-09-01",
"close": 107.720001
},
{
"date": "2015-09-02",
"close": 112.339996
},
{
"date": "2015-09-03",
"close": 110.370003
},
{
"date": "2015-09-04",
"close": 109.269997
},
{
"date": "2015-09-08",
"close": 112.309998
},
{
"date": "2015-09-09",
"close": 110.150002
},
{
"date": "2015-09-10",
"close": 112.57
},
{
"date": "2015-09-11",
"close": 114.209999
},
{
"date": "2015-09-14",
"close": 115.309998
},
{
"date": "2015-09-15",
"close": 116.279999
},
{
"date": "2015-09-16",
"close": 116.410004
},
{
"date": "2015-09-17",
"close": 113.919998
},
{
"date": "2015-09-18",
"close": 113.449997
},
{
"date": "2015-09-21",
"close": 115.209999
},
{
"date": "2015-09-22",
"close": 113.400002
},
{
"date": "2015-09-23",
"close": 114.32
},
{
"date": "2015-09-24",
"close": 115
},
{
"date": "2015-09-25",
"close": 114.709999
},
{
"date": "2015-09-28",
"close": 112.440002
},
{
"date": "2015-09-29",
"close": 109.059998
},
{
"date": "2015-09-30",
"close": 110.300003
},
{
"date": "2015-10-01",
"close": 109.580002
},
{
"date": "2015-10-02",
"close": 110.379997
},
{
"date": "2015-10-05",
"close": 110.779999
},
{
"date": "2015-10-06",
"close": 111.309998
},
{
"date": "2015-10-07",
"close": 110.779999
},
{
"date": "2015-10-08",
"close": 109.5
},
{
"date": "2015-10-09",
"close": 112.120003
},
{
"date": "2015-10-12",
"close": 111.599998
},
{
"date": "2015-10-13",
"close": 111.790001
},
{
"date": "2015-10-14",
"close": 110.209999
},
{
"date": "2015-10-15",
"close": 111.860001
},
{
"date": "2015-10-16",
"close": 111.040001
},
{
"date": "2015-10-19",
"close": 111.730003
},
{
"date": "2015-10-20",
"close": 113.769997
},
{
"date": "2015-10-21",
"close": 113.760002
},
{
"date": "2015-10-22",
"close": 115.5
},
{
"date": "2015-10-23",
"close": 119.080002
},
{
"date": "2015-10-26",
"close": 115.279999
},
{
"date": "2015-10-27",
"close": 114.550003
},
{
"date": "2015-10-28",
"close": 119.269997
},
{
"date": "2015-10-29",
"close": 120.529999
},
{
"date": "2015-10-30",
"close": 119.5
},
{
"date": "2015-11-02",
"close": 121.18
},
{
"date": "2015-11-03",
"close": 122.57
},
{
"date": "2015-11-04",
"close": 122
},
{
"date": "2015-11-05",
"close": 120.919998
},
{
"date": "2015-11-06",
"close": 121.059998
},
{
"date": "2015-11-09",
"close": 120.57
},
{
"date": "2015-11-10",
"close": 116.769997
},
{
"date": "2015-11-11",
"close": 116.110001
},
{
"date": "2015-11-12",
"close": 115.720001
},
{
"date": "2015-11-13",
"close": 112.339996
},
{
"date": "2015-11-16",
"close": 114.18
},
{
"date": "2015-11-17",
"close": 113.690002
},
{
"date": "2015-11-18",
"close": 117.290001
},
{
"date": "2015-11-19",
"close": 118.779999
},
{
"date": "2015-11-20",
"close": 119.300003
},
{
"date": "2015-11-23",
"close": 117.75
},
{
"date": "2015-11-24",
"close": 118.879997
},
{
"date": "2015-11-25",
"close": 118.029999
},
{
"date": "2015-11-27",
"close": 117.809998
},
{
"date": "2015-11-30",
"close": 118.300003
},
{
"date": "2015-12-01",
"close": 117.339996
},
{
"date": "2015-12-02",
"close": 116.279999
},
{
"date": "2015-12-03",
"close": 115.199997
},
{
"date": "2015-12-04",
"close": 119.029999
},
{
"date": "2015-12-07",
"close": 118.279999
},
{
"date": "2015-12-08",
"close": 118.230003
},
{
"date": "2015-12-09",
"close": 115.620003
},
{
"date": "2015-12-10",
"close": 116.169998
},
{
"date": "2015-12-11",
"close": 113.18
},
{
"date": "2015-12-14",
"close": 112.480003
},
{
"date": "2015-12-15",
"close": 110.489998
},
{
"date": "2015-12-16",
"close": 111.339996
},
{
"date": "2015-12-17",
"close": 108.980003
},
{
"date": "2015-12-18",
"close": 106.029999
},
{
"date": "2015-12-21",
"close": 107.330002
},
{
"date": "2015-12-22",
"close": 107.230003
},
{
"date": "2015-12-23",
"close": 108.610001
},
{
"date": "2015-12-24",
"close": 108.029999
},
{
"date": "2015-12-28",
"close": 106.82
},
{
"date": "2015-12-29",
"close": 108.739998
},
{
"date": "2015-12-30",
"close": 107.32
},
{
"date": "2015-12-31",
"close": 105.260002
},
{
"date": "2016-01-04",
"close": 105.349998
},
{
"date": "2016-01-05",
"close": 102.709999
},
{
"date": "2016-01-06",
"close": 100.699997
},
{
"date": "2016-01-07",
"close": 96.449997
},
{
"date": "2016-01-08",
"close": 96.959999
},
{
"date": "2016-01-11",
"close": 98.529999
},
{
"date": "2016-01-12",
"close": 99.959999
},
{
"date": "2016-01-13",
"close": 97.389999
},
{
"date": "2016-01-14",
"close": 99.519997
},
{
"date": "2016-01-15",
"close": 97.129997
},
{
"date": "2016-01-19",
"close": 96.660004
},
{
"date": "2016-01-20",
"close": 96.790001
},
{
"date": "2016-01-21",
"close": 96.300003
},
{
"date": "2016-01-22",
"close": 101.419998
},
{
"date": "2016-01-25",
"close": 99.440002
},
{
"date": "2016-01-26",
"close": 99.989998
},
{
"date": "2016-01-27",
"close": 93.419998
},
{
"date": "2016-01-28",
"close": 94.089996
},
{
"date": "2016-01-29",
"close": 97.339996
},
{
"date": "2016-02-01",
"close": 96.43
},
{
"date": "2016-02-02",
"close": 94.480003
},
{
"date": "2016-02-03",
"close": 96.349998
},
{
"date": "2016-02-04",
"close": 96.599998
},
{
"date": "2016-02-05",
"close": 94.019997
},
{
"date": "2016-02-08",
"close": 95.010002
},
{
"date": "2016-02-09",
"close": 94.989998
},
{
"date": "2016-02-10",
"close": 94.269997
},
{
"date": "2016-02-11",
"close": 93.699997
},
{
"date": "2016-02-12",
"close": 93.989998
},
{
"date": "2016-02-16",
"close": 96.639999
},
{
"date": "2016-02-17",
"close": 98.120003
},
{
"date": "2016-02-18",
"close": 96.260002
},
{
"date": "2016-02-19",
"close": 96.040001
},
{
"date": "2016-02-22",
"close": 96.879997
},
{
"date": "2016-02-23",
"close": 94.690002
},
{
"date": "2016-02-24",
"close": 96.099998
},
{
"date": "2016-02-25",
"close": 96.760002
},
{
"date": "2016-02-26",
"close": 96.910004
},
{
"date": "2016-02-29",
"close": 96.690002
},
{
"date": "2016-03-01",
"close": 100.529999
},
{
"date": "2016-03-02",
"close": 100.75
},
{
"date": "2016-03-03",
"close": 101.5
},
{
"date": "2016-03-04",
"close": 103.010002
},
{
"date": "2016-03-07",
"close": 101.870003
},
{
"date": "2016-03-08",
"close": 101.029999
},
{
"date": "2016-03-09",
"close": 101.120003
},
{
"date": "2016-03-10",
"close": 101.169998
},
{
"date": "2016-03-11",
"close": 102.260002
},
{
"date": "2016-03-14",
"close": 102.519997
},
{
"date": "2016-03-15",
"close": 104.580002
},
{
"date": "2016-03-16",
"close": 105.970001
},
{
"date": "2016-03-17",
"close": 105.800003
},
{
"date": "2016-03-18",
"close": 105.919998
},
{
"date": "2016-03-21",
"close": 105.910004
},
{
"date": "2016-03-22",
"close": 106.720001
},
{
"date": "2016-03-23",
"close": 106.129997
},
{
"date": "2016-03-24",
"close": 105.669998
},
{
"date": "2016-03-28",
"close": 105.190002
},
{
"date": "2016-03-29",
"close": 107.68
},
{
"date": "2016-03-30",
"close": 109.559998
},
{
"date": "2016-03-31",
"close": 108.989998
},
{
"date": "2016-04-01",
"close": 109.989998
},
{
"date": "2016-04-04",
"close": 111.120003
},
{
"date": "2016-04-05",
"close": 109.809998
},
{
"date": "2016-04-06",
"close": 110.959999
},
{
"date": "2016-04-07",
"close": 108.540001
},
{
"date": "2016-04-08",
"close": 108.660004
},
{
"date": "2016-04-11",
"close": 109.019997
},
{
"date": "2016-04-12",
"close": 110.440002
},
{
"date": "2016-04-13",
"close": 112.040001
},
{
"date": "2016-04-14",
"close": 112.099998
},
{
"date": "2016-04-15",
"close": 109.849998
},
{
"date": "2016-04-18",
"close": 107.480003
},
{
"date": "2016-04-19",
"close": 106.910004
},
{
"date": "2016-04-20",
"close": 107.129997
},
{
"date": "2016-04-21",
"close": 105.970001
},
{
"date": "2016-04-22",
"close": 105.68
},
{
"date": "2016-04-25",
"close": 105.080002
},
{
"date": "2016-04-26",
"close": 104.349998
},
{
"date": "2016-04-27",
"close": 97.82
},
{
"date": "2016-04-28",
"close": 94.830002
},
{
"date": "2016-04-29",
"close": 93.739998
},
{
"date": "2016-05-02",
"close": 93.639999
},
{
"date": "2016-05-03",
"close": 95.18
},
{
"date": "2016-05-04",
"close": 94.190002
},
{
"date": "2016-05-05",
"close": 93.239998
},
{
"date": "2016-05-06",
"close": 92.720001
},
{
"date": "2016-05-09",
"close": 92.790001
},
{
"date": "2016-05-10",
"close": 93.419998
},
{
"date": "2016-05-11",
"close": 92.510002
},
{
"date": "2016-05-12",
"close": 90.339996
},
{
"date": "2016-05-13",
"close": 90.519997
},
{
"date": "2016-05-16",
"close": 93.879997
},
{
"date": "2016-05-17",
"close": 93.489998
},
{
"date": "2016-05-18",
"close": 94.559998
},
{
"date": "2016-05-19",
"close": 94.199997
},
{
"date": "2016-05-20",
"close": 95.220001
},
{
"date": "2016-05-23",
"close": 96.43
},
{
"date": "2016-05-24",
"close": 97.900002
},
{
"date": "2016-05-25",
"close": 99.620003
},
{
"date": "2016-05-26",
"close": 100.410004
},
{
"date": "2016-05-27",
"close": 100.349998
},
{
"date": "2016-05-31",
"close": 99.860001
},
{
"date": "2016-06-01",
"close": 98.459999
},
{
"date": "2016-06-02",
"close": 97.720001
},
{
"date": "2016-06-03",
"close": 97.919998
},
{
"date": "2016-06-06",
"close": 98.629997
},
{
"date": "2016-06-07",
"close": 99.029999
},
{
"date": "2016-06-08",
"close": 98.940002
},
{
"date": "2016-06-09",
"close": 99.650002
},
{
"date": "2016-06-10",
"close": 98.830002
},
{
"date": "2016-06-13",
"close": 97.339996
},
{
"date": "2016-06-14",
"close": 97.459999
},
{
"date": "2016-06-15",
"close": 97.139999
},
{
"date": "2016-06-16",
"close": 97.550003
},
{
"date": "2016-06-17",
"close": 95.330002
},
{
"date": "2016-06-20",
"close": 95.099998
},
{
"date": "2016-06-21",
"close": 95.910004
},
{
"date": "2016-06-22",
"close": 95.550003
},
{
"date": "2016-06-23",
"close": 96.099998
},
{
"date": "2016-06-24",
"close": 93.400002
},
{
"date": "2016-06-27",
"close": 92.040001
},
{
"date": "2016-06-28",
"close": 93.589996
},
{
"date": "2016-06-29",
"close": 94.400002
},
{
"date": "2016-06-30",
"close": 95.599998
},
{
"date": "2016-07-01",
"close": 95.889999
},
{
"date": "2016-07-05",
"close": 94.989998
},
{
"date": "2016-07-06",
"close": 95.529999
},
{
"date": "2016-07-07",
"close": 95.940002
},
{
"date": "2016-07-08",
"close": 96.68
},
{
"date": "2016-07-11",
"close": 96.980003
},
{
"date": "2016-07-12",
"close": 97.419998
},
{
"date": "2016-07-13",
"close": 96.870003
},
{
"date": "2016-07-14",
"close": 98.790001
},
{
"date": "2016-07-15",
"close": 98.779999
},
{
"date": "2016-07-18",
"close": 99.830002
},
{
"date": "2016-07-19",
"close": 99.870003
},
{
"date": "2016-07-20",
"close": 99.959999
},
{
"date": "2016-07-21",
"close": 99.43
},
{
"date": "2016-07-22",
"close": 98.660004
},
{
"date": "2016-07-25",
"close": 97.339996
},
{
"date": "2016-07-26",
"close": 96.669998
},
{
"date": "2016-07-27",
"close": 102.949997
},
{
"date": "2016-07-28",
"close": 104.339996
},
{
"date": "2016-07-29",
"close": 104.209999
},
{
"date": "2016-08-01",
"close": 106.050003
},
{
"date": "2016-08-02",
"close": 104.480003
},
{
"date": "2016-08-03",
"close": 105.790001
},
{
"date": "2016-08-04",
"close": 105.870003
},
{
"date": "2016-08-05",
"close": 107.480003
},
{
"date": "2016-08-08",
"close": 108.370003
},
{
"date": "2016-08-09",
"close": 108.809998
},
{
"date": "2016-08-10",
"close": 108
},
{
"date": "2016-08-11",
"close": 107.93
},
{
"date": "2016-08-12",
"close": 108.18
},
{
"date": "2016-08-15",
"close": 109.480003
},
{
"date": "2016-08-16",
"close": 109.379997
},
{
"date": "2016-08-17",
"close": 109.220001
},
{
"date": "2016-08-18",
"close": 109.080002
},
{
"date": "2016-08-19",
"close": 109.360001
},
{
"date": "2016-08-22",
"close": 108.510002
},
{
"date": "2016-08-23",
"close": 108.849998
},
{
"date": "2016-08-24",
"close": 108.029999
},
{
"date": "2016-08-25",
"close": 107.57
},
{
"date": "2016-08-26",
"close": 106.940002
},
{
"date": "2016-08-29",
"close": 106.82
},
{
"date": "2016-08-30",
"close": 106
},
{
"date": "2016-08-31",
"close": 106.099998
},
{
"date": "2016-09-01",
"close": 106.730003
},
{
"date": "2016-09-02",
"close": 107.730003
},
{
"date": "2016-09-06",
"close": 107.699997
},
{
"date": "2016-09-07",
"close": 108.360001
},
{
"date": "2016-09-08",
"close": 105.519997
},
{
"date": "2016-09-09",
"close": 103.129997
},
{
"date": "2016-09-12",
"close": 105.440002
},
{
"date": "2016-09-13",
"close": 107.949997
},
{
"date": "2016-09-14",
"close": 111.769997
},
{
"date": "2016-09-15",
"close": 115.57
},
{
"date": "2016-09-16",
"close": 114.919998
},
{
"date": "2016-09-19",
"close": 113.580002
},
{
"date": "2016-09-20",
"close": 113.57
},
{
"date": "2016-09-21",
"close": 113.550003
},
{
"date": "2016-09-22",
"close": 114.620003
},
{
"date": "2016-09-23",
"close": 112.709999
},
{
"date": "2016-09-26",
"close": 112.879997
},
{
"date": "2016-09-27",
"close": 113.089996
},
{
"date": "2016-09-28",
"close": 113.949997
},
{
"date": "2016-09-29",
"close": 112.18
},
{
"date": "2016-09-30",
"close": 113.050003
},
{
"date": "2016-10-03",
"close": 112.519997
},
{
"date": "2016-10-04",
"close": 113
},
{
"date": "2016-10-05",
"close": 113.050003
},
{
"date": "2016-10-06",
"close": 113.889999
},
{
"date": "2016-10-07",
"close": 114.059998
},
{
"date": "2016-10-10",
"close": 116.050003
},
{
"date": "2016-10-11",
"close": 116.300003
},
{
"date": "2016-10-12",
"close": 117.339996
},
{
"date": "2016-10-13",
"close": 116.980003
},
{
"date": "2016-10-14",
"close": 117.629997
},
{
"date": "2016-10-17",
"close": 117.550003
},
{
"date": "2016-10-18",
"close": 117.470001
},
{
"date": "2016-10-19",
"close": 117.120003
},
{
"date": "2016-10-20",
"close": 117.059998
},
{
"date": "2016-10-21",
"close": 116.599998
},
{
"date": "2016-10-24",
"close": 117.650002
},
{
"date": "2016-10-25",
"close": 118.25
},
{
"date": "2016-10-26",
"close": 115.589996
},
{
"date": "2016-10-27",
"close": 114.480003
},
{
"date": "2016-10-28",
"close": 113.720001
},
{
"date": "2016-10-31",
"close": 113.540001
},
{
"date": "2016-11-01",
"close": 111.489998
},
{
"date": "2016-11-02",
"close": 111.589996
},
{
"date": "2016-11-03",
"close": 109.830002
},
{
"date": "2016-11-04",
"close": 108.839996
},
{
"date": "2016-11-07",
"close": 110.410004
},
{
"date": "2016-11-08",
"close": 111.059998
},
{
"date": "2016-11-09",
"close": 110.879997
},
{
"date": "2016-11-10",
"close": 107.790001
},
{
"date": "2016-11-11",
"close": 108.43
},
{
"date": "2016-11-14",
"close": 105.709999
},
{
"date": "2016-11-15",
"close": 107.110001
},
{
"date": "2016-11-16",
"close": 109.989998
},
{
"date": "2016-11-17",
"close": 109.949997
},
{
"date": "2016-11-18",
"close": 110.059998
},
{
"date": "2016-11-21",
"close": 111.730003
},
{
"date": "2016-11-22",
"close": 111.800003
},
{
"date": "2016-11-23",
"close": 111.230003
},
{
"date": "2016-11-25",
"close": 111.790001
},
{
"date": "2016-11-28",
"close": 111.57
},
{
"date": "2016-11-29",
"close": 111.459999
},
{
"date": "2016-11-30",
"close": 110.519997
},
{
"date": "2016-12-01",
"close": 109.489998
},
{
"date": "2016-12-02",
"close": 109.900002
},
{
"date": "2016-12-05",
"close": 109.110001
},
{
"date": "2016-12-06",
"close": 109.949997
},
{
"date": "2016-12-07",
"close": 111.029999
},
{
"date": "2016-12-08",
"close": 112.120003
},
{
"date": "2016-12-09",
"close": 113.949997
},
{
"date": "2016-12-12",
"close": 113.300003
},
{
"date": "2016-12-13",
"close": 115.190002
},
{
"date": "2016-12-14",
"close": 115.190002
},
{
"date": "2016-12-15",
"close": 115.82
},
{
"date": "2016-12-16",
"close": 115.970001
},
{
"date": "2016-12-19",
"close": 116.639999
},
{
"date": "2016-12-20",
"close": 116.949997
},
{
"date": "2016-12-21",
"close": 117.059998
},
{
"date": "2016-12-22",
"close": 116.290001
},
{
"date": "2016-12-23",
"close": 116.519997
},
{
"date": "2016-12-27",
"close": 117.260002
},
{
"date": "2016-12-28",
"close": 116.760002
},
{
"date": "2016-12-29",
"close": 116.730003
},
{
"date": "2016-12-30",
"close": 115.82
},
{
"date": "2017-01-03",
"close": 116.150002
},
{
"date": "2017-01-04",
"close": 116.019997
},
{
"date": "2017-01-05",
"close": 116.610001
},
{
"date": "2017-01-06",
"close": 117.910004
},
{
"date": "2017-01-09",
"close": 118.989998
},
{
"date": "2017-01-10",
"close": 119.110001
},
{
"date": "2017-01-11",
"close": 119.75
},
{
"date": "2017-01-12",
"close": 119.25
},
{
"date": "2017-01-13",
"close": 119.040001
},
{
"date": "2017-01-17",
"close": 120
},
{
"date": "2017-01-18",
"close": 119.989998
},
{
"date": "2017-01-19",
"close": 119.779999
},
{
"date": "2017-01-20",
"close": 120
},
{
"date": "2017-01-23",
"close": 120.080002
},
{
"date": "2017-01-24",
"close": 119.970001
},
{
"date": "2017-01-25",
"close": 121.879997
},
{
"date": "2017-01-26",
"close": 121.940002
},
{
"date": "2017-01-27",
"close": 121.949997
},
{
"date": "2017-01-30",
"close": 121.629997
},
{
"date": "2017-01-31",
"close": 121.349998
},
{
"date": "2017-02-01",
"close": 128.75
},
{
"date": "2017-02-02",
"close": 128.529999
},
{
"date": "2017-02-03",
"close": 129.080002
},
{
"date": "2017-02-06",
"close": 130.289993
},
{
"date": "2017-02-07",
"close": 131.529999
},
{
"date": "2017-02-08",
"close": 132.039993
},
{
"date": "2017-02-09",
"close": 132.419998
},
{
"date": "2017-02-10",
"close": 132.119995
},
{
"date": "2017-02-13",
"close": 133.289993
},
{
"date": "2017-02-14",
"close": 135.020004
},
{
"date": "2017-02-15",
"close": 135.509995
},
{
"date": "2017-02-16",
"close": 135.350006
},
{
"date": "2017-02-17",
"close": 135.720001
},
{
"date": "2017-02-21",
"close": 136.699997
},
{
"date": "2017-02-22",
"close": 137.110001
},
{
"date": "2017-02-23",
"close": 136.529999
}
];
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kagi Chart</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" type="text/css"
href="https://cdn.rawgit.com/arpitnarechania/d3-kagi/f66fcce9/dist/kagi.css"/>
</head>
<body>
<div id="settings" style="display:inline-block;float:left;">
<div class="formElement">
<span>Chart Theme</span>
<select id="chartTheme" onchange="changeChartTheme(this)">
<option value="light" selected>Light</option>
<option value="dark">Dark</option>
</select>
</div>
<div class="formElement">
<span >Caption</span>
<input id="caption" type="text" value="Apple Stock Closing Prices" onchange="changeCaption(this)">
</div>
<div class="formElement">
<span >Sub caption</span>
<input id="subCaption" type="text" value="2015-01-02 to 2017-02-24" onchange="changeSubCaption(this)">
</div>
<div class="formElement">
<span >Reversal Type</span>
<select id="reversalType" onchange="changeReversalType(this)">
<option value="diff" selected>Difference</option>
<option value="pct">Percentage</option>
</select>
</div>
<div class="formElement">
<span >Reversal Value</span>
<input id="reversalValue" type="number" value="5" onchange="changeReversalValue(this)">
</div>
<div class="formElement">
<span >Rally Color</span>
<input id="rallyColor" type="color" value="#2ecc71" onchange="changeRallyColor(this)">
</div>
<div class="formElement">
<span >Rally Thickness</span>
<input id="rallyThickness" type="number" value="3" onchange="changeRallyThickness(this)">
</div>
<div class="formElement">
<span >Rally Thickness On Hover</span>
<input id="rallyThicknessOnHover" type="number" value="5" onchange="changeRallyThicknessOnHover(this)">
</div>
<div class="formElement">
<span >Decline Color</span>
<input id="declineColor" type="color" value="#e74c3c" onchange="changeDeclineColor(this)">
</div>
<div class="formElement">
<span >Decline Thickness</span>
<input id="declineThickness" type="number" value="2" onchange="changeDeclineThickness(this)">
</div>
<div class="formElement">
<span >Decline Thickness On Hover</span>
<input id="declineThicknessOnHover" type="number" value="4" onchange="changeDeclineThicknessOnHover(this)">
</div>
<div class="formElement">
<span >Show Breakpoints</span>
<input id="breakPoints" type='checkbox' onclick='showBreakPoints(this);' checked>
</div>
<div class="formElement">
<span >Breakpoints Color</span>
<input id="breakPointColor" type="color" value="#3498db" onchange="changeBreakPointColor(this)">
</div>
<div class="formElement">
<span >Breakpoint Radius</span>
<input id="breakPointRadius" type="number" value="2" onchange="changeBreakPointRadius(this)">
</div>
<div class="formElement">
<span >Breakpoint Radius On Hover</span>
<input id="breakPointRadiusOnHover" type="number" value="5" onchange="changeBreakPointRadiusOnHover(this)">
</div>
<div class="formElement">
<span >Show Breakpoint Text</span>
<input id="breakPointText" type='checkbox' onclick='showBreakPointText(this);' checked>
</div>
<div class="formElement">
<span >Show Breakpoint Tooltips</span>
<input id="breakPointTooltips" type='checkbox' onclick='showBreakPointTooltip(this);' checked>
</div>
<div class="formElement">
<span >Show Range Tooltips</span>
<input id="rangeTooltips" type='checkbox' onclick='showRangePointTooltips(this);' checked>
</div>
<div class="formElement">
<span >Show Legend</span>
<input id="legend" type='checkbox' onclick='showLegend(this);' checked>
</div>
<div class="formElement">
<span >Show Animation</span>
<input id="animation" type='checkbox' onclick='showAnimation(this);' checked>
</div>
<div class="formElement">
<span >Animation Duration (millis)</span>
<input id="animDuration" type="number" value="500" onclick='changeAnimDuration(this);'>
</div>
<div class="formElement">
<span >Animation Ease</span>
<select id="animEase" onchange="changeAnimEase(this)">
<option value="linear" selected>linear</option>
<option value="quadIn">quadIn</option>
<option value="quadOut">quadOut</option>
<option value="cubicIn">cubicIn</option>
<option value="cubicOut">cubicOut</option>
<option value="cubicInOut">cubicInOut</option>
<option value="polyIn">polyIn</option>
<option value="polyOut">polyOut</option>
<option value="polyInOut">polyInOut</option>
<option value="sinIn">sinIn</option>
<option value="sinOut">sinOut</option>
<option value="sinInOut">sinInOut</option>
<option value="expIn">expIn</option>
<option value="expOut">expOut</option>
<option value="expInOut">expInOut</option>
<option value="circleIn">circleIn</option>
<option value="circleOut">circleOut</option>
<option value="circleInOut">circleInOut</option>
<option value="bounceIn">bounceIn</option>
<option value="bounceOut">bounceOut</option>
<option value="bounceInOut">bounceInOut</option>
<option value="backIn">backIn</option>
<option value="backOut">backOut</option>
<option value="backInOut">backInOut</option>
<option value="elasticIn">elasticIn</option>
<option value="elasticOut">elasticOut</option>
<option value="elasticInOut">elasticInOut</option>
</select>
</div>
</div>
<div id="kagiChart" style="display:inline-block;float:left;"></div>
</body>
<script type="text/javascript" src="https://cdn.rawgit.com/arpitnarechania/d3-kagi/f66fcce9/dist/kagi.js"></script>
<script type="text/javascript" src="data.js"></script>
<script type="text/javascript" src="main.js"></script>
</html>
function changeAnimEase(element){
console.log(element);
animEase = element.value;
drawChart();
}
function changeAnimDuration(element){
animDuration = element.value;
drawChart();
}
function changeChartTheme(element){
chartTheme = element.value;
drawChart();
}
function changeReversalType(element){
reversalType = element.value;
drawChart();
}
function changeReversalValue(){
reversalValue = element.value;
drawChart();
}
function showBreakPoints(element){
breakPoints = element.checked;
drawChart();
}
function showLegend(element){
legend = element.checked;
drawChart();
}
function showBreakPointTooltip(element){
breakPointTooltips = element.checked;
drawChart();
}
function showBreakPoints(element){
breakPoints = element.checked;
drawChart();
}
function showBreakPointText(element){
breakPointText = element.checked;
drawChart();
}
function showAnimation(element){
animation = element.checked;
drawChart();
}
function showRangePointTooltips(element){
rangeTooltips = element.checked;
drawChart();
}
function changeCaption(element){
caption = element.value;
drawChart();
}
function changeSubCaption(element){
subCaption = element.value;
drawChart();
}
function changeRallyColor(element){
rallyColor = element.value;
drawChart();
}
function changeRallyThickness(element){
rallyThickness = element.value;
drawChart();
}
function changeRallyThicknessOnHover(element){
rallyThicknessOnHover = element.value;
drawChart();
}
function changeDeclineColor(element){
declineColor = element.value;
drawChart();
}
function changeDeclineThickness(element){
declineThickness = element.value;
drawChart();
}
function changeDeclineThicknessOnHover(element){
declineThicknessOnHover = element.value;
drawChart();
}
function changeBreakPointRadius(element){
breakPointRadius = element.value;
drawChart();
}
function changeBreakPointRadiusOnHover(element){
breakPointRadiusOnHover = element.value;
drawChart();
}
function changeBreakPointColor(element){
breakPointColor = element.value;
drawChart();
}
function drawChart(){
var chartElement = document.getElementById("kagiChart");
chartElement.innerHTML="";
var chart_options = {
"width":window.innerWidth - document.getElementById("settings").offsetWidth - 25,
"height":500,
"margin":{top: 75, right: 50, bottom: 100, left: 50},
"chartTheme":chartTheme,
"caption": caption,
"subCaption": subCaption,
"reversalType": reversalType, // use "diff" for difference in value; use "pct" for percentage change
"reversalValue": reversalValue,
"unit": "$",
"isPrecedingUnit":true,
"rallyColor": rallyColor,
"rallyThickness": rallyThickness,
"rallyThicknessOnHover": rallyThicknessOnHover,
"declineColor": declineColor,
"declineThickness": declineThickness,
"declineThicknessOnHover": declineThicknessOnHover,
"showBreakPoints":breakPoints,
"breakPointColor":breakPointColor,
"breakPointRadius":breakPointRadius,
"breakPointRadiusOnHover":breakPointRadiusOnHover,
"showBreakPointText":breakPointText,
"showBreakPointTooltips":breakPointTooltips,
"showRangeTooltips":rangeTooltips,
"showLegend":legend,
"showAnimation":animation,
"animationDurationPerTrend":animDuration, // in seconds
"animationEase":animEase
}
KagiChart(data,chart_options); // data is served from data.js
}
var animEase = document.getElementById("animEase").value;
var animDuration = document.getElementById("animDuration").value;
var chartTheme = document.getElementById("chartTheme").value;
var reversalType = document.getElementById("reversalType").value;
var reversalValue = document.getElementById("reversalValue").value;
var caption = document.getElementById("caption").value;
var subCaption = document.getElementById("subCaption").value;
var rallyColor = document.getElementById("rallyColor").value;
var rallyThickness = document.getElementById("rallyThickness").value;
var rallyThicknessOnHover = document.getElementById("rallyThicknessOnHover").value;
var declineColor = document.getElementById("declineColor").value;
var declineThickness = document.getElementById("declineThickness").value;
var declineThicknessOnHover = document.getElementById("declineThicknessOnHover").value;
var breakPointRadius = document.getElementById("breakPointRadius").value;
var breakPointColor = document.getElementById("breakPointColor").value;
var breakPointRadiusOnHover = document.getElementById("breakPointRadiusOnHover").value;
var legend = document.getElementById("legend").checked;
var breakPoints = document.getElementById("breakPoints").checked;
var breakPointText = document.getElementById("breakPointText").checked;
var breakPointTooltips = document.getElementById("breakPointTooltips").checked;
var rangeTooltips = document.getElementById("rangeTooltips").checked;
var animation = document.getElementById("animation").checked;
drawChart();
.formElement{
padding:4px;
}
span{
display: inline-block;
width: 100px;
}
#settings{
padding: 8px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment