A set of google charts need to be corrected. The google charts will be created out of a database application, which has already been developed. The remaining questions have to do with the flexibility that we need for these charts. Details of the chart corrections to be developed are provided below.
## Deliverables
1- Overlay chart
The following shows a line chart with both a candle chart and a signal marker added.
The candles represent prices, the line represents the indicator value and the marker the buy/sell signals.
Legend:
chs: chart size
chco: line color
cht: chart-type, in this case lc = line chart
chxt: the axes to show
chxr: multiple axes and their ranges
chg: dashed grid lines
chd: data series, given as the line values first, then the candle values as follows: all lows, all opens, all closes, all highs (so the candle values are transposed, see explanation below)
chm: markers: F represents candle charts, v represents the buy/sell signal and H represents the lower and upper markers for the signal line
[login to view URL]
chs=300x225&
chco=6666FF&
cht=lc&
chxt=x,y,r&
chxr=0,0,500|
1,0,100|
2,0,50&
chg=20,50,1,5&
chd=t1:90,85,70,50,40,25,35|
20,5,10,5,5,10,0|
20,15,20,10,15,40,0|
25,35,25,6,35,20,0|
55,40,30,15,40,50,0&
chm=F,000000,1,1:-2,5|
H,BBBBFF,0,3,1,-1|
H,BBBBFF,0,5,1,-1|
v,00CC00,0,3,1,-1|
v,FF0000,0,5,1,-1
To do:
- How can the horizontal lines be added to the graph without it needing an identical value on the indicator?
- Show dates on the x-axis
- Left hand y-axis must conform to the prices (row 2 to 5 from the chd list) and the right hand y-axis must conform to the signal value (row 1 from the chd list)
A data file is included which would lead to an error in the browser because the data set is too large. One way to solve this problem elegantly is to split up the graph by month, so there would be one graph for january, one for february etc. The dates are added as the first column and should be displayed on the x-axis.
The data file is not transposed, so where you see the first column in the example above (20, 20, 25, 55), this corresponds to the row 2979.11 2996.37 2974.59 2988.97 in the spreadsheet (first data row).
So you need to transpose the data from the spreadsheet and for the first few rows this would result as follows:
2979.11,2991.67,2969.25,2945.87,2963.13,2933.16,0|
2996.37,3000.11,2988.59,2976.08,2970.88,2958.42,0|
2974.59,2961.77,2966.61,2933.3,2958.82,2922.96,0|
2988.97,2966.89,2986.76,2966.16,2963.75,2956.98,0&
2- Validation chart
To be used for displaying multiple versions of prices.
chd: data given as x, y1, x, y2 etc, so x is repeated
chm: marker colors and of which the 3rd argument represents the marker color; 2 equals the marker size
[login to view URL]
chs=300x225&
cht=lxy&
chxt=y&
chco=CC0000,00CC00,0000CC&
chg=20,50,1,5&
chd=t:10,20,25,30,50,55,65,70|
66,88,78,86,63,53,49,50|
10,20,25,30,50,55,65,70|
63,53,49,66,88,78,86,50|
10,20,25,30,50,55,65,70|
43,46,45,60,66,75,80,60&
chm=o,330000,0,-1,2|
o,003300,1,-1,2|
o,000033,2,-1,2
To do:
- The date should be shown on the x-axis.
- A legend should also be included, showing y1, y2 etc and each in its own color.
3- Volatility chart
The volatility chart must display the following things in a single chart:
- a volatility line
- a column chart showing the relative first order difference of the main signal against the other signals
- a confidence band
A volatility line is a regular line in a chart, you can pick the data from the validation chart for it. Please use a dark red color for this line as follows:
[login to view URL]
chs=300x225&
cht=lc&
chxt=y&
chco=821212&
chd=t:10,50,60,80,40,60,30&
chls=1
A column chart displays relative values of which the background is out of scope of this description. An example of a column chart is the following, whereby the color is the lighter version of the volatility line:
[login to view URL]
chs=300x225&
cht=bvg&
chxt=y&
chco=D88F8F&
chbh=a,6&
chds=-60,100&
chd=t:10,50,-60,80,-40,60,30
Note that because the data for the column chart can be negative, a separate y-axis must be displayed on the right hand side of the volatility chart.
For the confidence bands the situation is more complicated. You can assume that they are calculated from the volatility values and you only need to display them correctly.
Confidence bands are calculated as percentiles from the volatility data at the 80% level and 95% level. This means that the outer band (lighter colored) starts at the 5% level and ends at the 95% level.
For the inner band (darker colored) the start is at the 20% level and the end at the 80% level.
[login to view URL],y&chd=t:95,95|80,80|20,20|5,5&chm=b,E2EBFB,0,1,0|b,C9DBFB,1,2,0|b,E2EBFB,2,3,0
To do:
- How to remove the orange lines?
- How to add the confidence bands to the background of the volatility graph and the volatility line to the foreground?
- How to display the bands with the same y-axis as the volatility data, or rather not just from 0 to 100?
- How can all data be displayed in one volatility chart?
- How can also the date be displayed on the x-axis?