ASE Home Page Products Download Purchase Support About ASE
ChartDirector Support
Forum HomeForum Home   SearchSearch

Message ListMessage List     Post MessagePost Message

  customize candlestick shadow color on finance chart
Posted by Mark on Aug-30-2013 19:01
Hi peter,

I was wondering if it is possible to change the color of the candlestick shadow for adding to
a finance chart in C#/.NET. in the simple candlestick chart code, the addCandleStickLayer
function is used, which can of course be customized to define the edge color of the
candles.

However, in the finance chart code, I use the default function from finance2.cs - i.e.
addCandleStick(0x00ff00, 0xff0000).

How do I customize the candlestick edge color in a finance chart, given that I earlier used
the setData function - setData(timeStamps, highData, lowData, openData, closeData,
volumeData, extraDays)?

My goal is to get a chart that looks like this one:
http://www.forex4you.com/images/site/metatrader_userguide/graph6.png - where the
candle edge color varies according to (and is the same as the corresponding) the body color
, i.e. whether the candle is up or down.

Alternatively, if i can change the shadow color to a single, different color (other than the
default black) in finance chart, it can look like this: http://www.online-stock-trading-
guide.com/image-files/candlestick-chart-large.png
-->in other words, i would be able to use a black background for my finance chart without
losing visibility of the shadow as is currently the case

Thanks.

  Re: customize candlestick shadow color on finance chart
Posted by Peter Kwan on Aug-31-2013 00:50
Attachments:
Hi Mark,

For the chart mentioned in your link, the fill color is either pure black or pure white, depending on whether it is an up or down day. The edge color is always green regardless of the data. I have attached the chart I found from your link, magnified so you can see its colors clearly. Note that the edge is color is not the same as the body color, but the colors sometimes mix together because the anti-alias method used by that chart can "randomly" spread the border and the fill color out so that may overlap randomly. (You can see that every candlestick is color differently due to anti-alias effects.)

In the documentation for addCandleStickLayer, it mentions you can control the up/down fill colors, as well as the central stem and box edge colors by setting the data set colors. So you can set the fill color to be black/white, and the central stem and box edge color to be green. In C#, it is like:

CandleStickLayer layer = myFinanceChartObj.addCandleStick(-1, -1);
layer.getDataSet(0).setDataColor(0xffffff, 0x00ff00);
layer.getDataSet(1).setDataColor(0x000000, 0x00ff00);

For the background and other colors, almost every part of the chart can have its color customized. For the FinanceChart background, you may use BaseChart.setBgColor on the FinanceChart object. You may also want to change the plot area background, axis colors, etc.. See FinanceChart.setPlotAreaStyle, FinanceChart.setXAxisStyle, FinanceChart.setYAxisStyle, FinanceChart.setPlotAreaBorder, etc..

Hope this can help.

Regards
Peter Kwan
image.png

  Re: customize candlestick shadow color on finance chart
Posted by Mark on Sep-16-2013 15:03
Attachments:
Hi Peter,

I took your advice on customizing the chart's candlestick colors, but I am still stuck for
some reason.

The code I use is below:
cLayer = c.addCandleStick(0x00EE00, 0xE65C01);
                cLayer.getDataSet(0).setDataColor(0x00EE00, 0x00EE00);
                cLayer.getDataSet(1).setDataColor(0xE65C01, 0xE65C01);

Along with the initial code of:
c.setPlotAreaStyle(0x000000, 0x000000, 0x000000, 0x000000, 0x000000);

Note: c is the initial Finance chart object of 760 pixels.

I am trying to recreate this chart
(http://www.bseindia.com/charting/BSETechnicalCharts.aspx?SYMBOL=500111) attached
below:

But what I end up with is the wrong body and stem colors:

In other words, I want orange borders and shadows for my orange candles (down), and
green borders and green shadows for my green candles (up).

Instead, as seen in the chart, my orange candles have green borders, and green candles
have orange stems.

Please help, I don't know what's going wrong!

Thanks,
Mark
whatiwant.png
mycurrentchart.png

  Re: customize candlestick shadow color on finance chart
Posted by Peter Kwan on Sep-17-2013 01:16
Hi Mark,

The code in my last message is for the previous chart you mentioned. In your previous chart, all the candlesticks has the same border color. If you use the same code, all of them will have the same border color as well.

For your new chart style, the code should be:

cLayer = c.addCandleStick(0x00EE00, 0xE65C01);
                cLayer.getDataSet(0).setDataColor(0x00EE00, Chart.SameAsMainColor);
                cLayer.getDataSet(1).setDataColor(0xE65C01, Chart.SameAsMainColor);

Hope this can help.

Regards
Peter Kwan

  Re: customize candlestick shadow color on finance chart
Posted by Manisha on Jul-28-2015 19:36
Hi,

Is there any way to change the color of a particular candle based on the timeStamp like
i want to make today date candle stick in yellow color.

Please help me out to do this.

Thanks

  Re: customize candlestick shadow color on finance chart
Posted by Peter Kwan on Jul-29-2015 03:10
HI Manisha,

You can try to add an extra candlestick layer using addCandleStickLayer with just one yellow candlestick, by using data arrays that contain Chart.NoValue for every elements except the last element.

The following is an example for a financial chart with an extra candlestick layer:

http://www.chartdir.com/forum/download_thread.php?bn=chartdir_support&thread=1143398629#N1269062963

Hope this can help.

Regards
Peter Kwan

  Re: customize candlestick shadow color on finance chart
Posted by Manisha on Jul-29-2015 18:53
i am still not able to display my last candle in yellow color and rest of the candle in red
and green color according to the date because we pass array of data to make chart how
will i show individual record.

  Re: customize candlestick shadow color on finance chart
Posted by Manisha on Jul-29-2015 18:53
i am still not able to display my last candle in yellow color and rest of the candle in red
and green color according to the date because we pass array of data to make chart how
will i show individual record.

  Re: customize candlestick shadow color on finance chart
Posted by Peter Kwan on Jul-30-2015 04:11
Hi Manisha,

As described in my previous message, to show one record, you can use arrays that
contain Chart.NoValue for every elements except the last element.

For example, in C#:

// These are the arrays containing Chart.NoValue
double[] highData2 = new double[highData.Length];
for (int i = 0; i < highData2.Length; ++i) highData2[i] = Chart.NoValue;
double[] lowData2 = (double[])highData2.Clone();
double[] openData2 = (double[])highData2.Clone();
double[] closeData2 = (double[])lowData2.Clone();

// Only the last record contains data, which is copied from the orignal array.
highData2[highData2.Length - 1] = highData[highData.Length - 1];
lowData2[lowData2.Length - 1] = lowData[lowData.Length - 1];
openData2[openData2.Length - 1] = openData[openData.Length - 1];
closeData2[closeData2.Length - 1] = closeData[closeData.Length - 1];

// Create the yellow candlestick layer, which should only contain 1 candlestick
CandleStickLayer myLayer2 = c.addCandleStickLayer(highData2, lowData2, openData2,
closeData2, 0xffff00, 0xffff00, 0x666600);

// Move it in front of the original candlestick layer
myLayer2.moveFront(myLayer);

Hope this can help.

Regards
Peter Kwan

  Re: customize candlestick shadow color on finance chart
Posted by Manisha on Jul-31-2015 14:25
Thanks Peter,
For the great help it worked perfectly.

Regards
Manisha

  Re: customize candlestick shadow color on finance chart
Posted by Manisha on Aug-04-2015 18:05
Hi Peter,

The above code is working fine to show the today date candle stick in yellow color but
when using this the %Change is stopped to display for that day

we fetch change=closevalue-lastClosevalue.

Can you please sort out this issue.

Regards
Manisha

  Re: customize candlestick shadow color on finance chart
Posted by Peter Kwan on Aug-05-2015 02:27
Hi Manisha,

You can add code to detect the additonal yellow candlestick layer (which does not have
"lastCloseValue" as it only has one candlestick) from interfering with the track cursor. I
suggest to modify the

if (closeValue == null)

to the following line to also detect the yellow candlestick layer:

if ((closeValue == null) || (layer.getDataSet(3).getValue(0) == null))

Regards
Peter Kwan