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

Message ListMessage List     Post MessagePost Message

  Finance Chart Bottom and Top Margin distortions
Posted by icm63 on Aug-25-2021 07:29
Attachments:
Hi,

This chart follows the code from your FINANCE chart (v6 vbnet dll)

Chart 1 = Is perfect a control test. All good. The idea is draw a perfect SQUARE for drawing Gann Angle tools with the mainXYChart.

Chart 2 = I wished to expand the xAxis to show more detail, hence I needed to expand the TOP and BOTTOM margins. But errors with the fitting occur with the mainXYChart object.

QUESTION: For some reason mainXYChart chart 2 fails to draw correctly. ANY IDEAS ?
NOTE: Yes Local is called before all drawings.

HERE are the relevant code lines to set up mainChart and mainXYChart

    Dim FC_MinMargin As Integer = 10
    Dim FC_leftMargin As Integer = 40
    Dim FC_rightMargin As Integer = 40
    Dim FC_topMargin As Integer = 28
    Dim FC_bottomMargin As Integer = 30

st.PlotWidth = 600 ** User input
st.PlotHeight = 600 ** User input

       Dim mainChart As cFinanceChart = New cFinanceChart(st.PlotWidth + FC_leftMargin + FC_rightMargin + FC_MinMargin)
        mainChart.setMargins(FC_leftMargin, FC_topMargin, FC_rightMargin, FC_bottomMargin)


Dim FinHeight As Integer = st.PlotHeight + FC_topMargin
NOTE: I have to add 'FC_topMargin' to ensure the mainXYChart is a perfect square with st.PlotWidth and st.PlotHeigh, otherwise it does not work. I have fiddled with this variable, with no positive effect.

        'Set Finance Chart as XYChart and OHLC layer
        mainXYChart = mainChart.addMainChart(FinHeight, BackGroundColor)


HERE are the OBJECT SIZE settings

CHART 1 - PERFECT
*******XYCHART FROM MAINCHART**************
User Input width:600, User Input  height:600
mainChart.getDrawArea.getHeight:687
mainChart.getDrawArea.getWidth:690
mainXYChart.getPlotArea.getHeight:628
mainXYChart.getPlotArea.getWidth:610
--------MARGINS------------
FC_topMargin:28
FC_bottomMargin:30
FC_leftMargin:40
FC_rightMargin:40
FC_MinMargin:10
--------RED SQUARE SETTINGS------------
x1:40
y1:28 plus 28 = 56
x2:40 plus 610 less 10 = 640
y2:28 plus 628 = 656
Red Square:mainXYChart.makeChart3().rect(x1, y1, x2, y2, &HFF0000, Chart.Transparent



CHART 2 - Error (see blue on chart)
*******XYCHART FROM MAINCHART**************
User Input width:600, User Input  height:600
mainChart.getDrawArea.getHeight:726
mainChart.getDrawArea.getWidth:690
mainXYChart.getPlotArea.getHeight:640
mainXYChart.getPlotArea.getWidth:610
--------MARGINS------------
FC_topMargin:40   <CHANGED to fit vertical xAxis Dates>
FC_bottomMargin:45   CHANGED to fit vertical xAxis Dates>
FC_leftMargin:40
FC_rightMargin:40
FC_MinMargin:10
--------RED SQUARE SETTINGS------------
x1:40
y1:40 plus 40 = 80
x2:40 plus 610 less 10 = 640
y2:40 plus 640 = 680
Red Square:mainXYChart.makeChart3().rect(x1, y1, x2, y2, &HFF0000, Chart.Transparent
SH_0002.png
SH_0003.png

  Re: Finance Chart Bottom and Top Margin distortions
Posted by Peter Kwan on Aug-25-2021 14:39
Hi icm63,

In your first chart, the y-axis from 0 to 56 is 600 pixels long. It matches with your square what is 600 x 600.

In your second chart, the plot area is taller. So the y-axis is longer. It is 618 pixels long. So it does not match with your square.

I understand you want to reserve some space outside the plot area for your top x-axis, but I do not understand why you need to increase the plot area height. If you increase the plot area height but not the width, it is normal the y-axis will not match the square.
For the square to match the y-axis, please use the same plot area height for both charts.

Regards
Peter Kwan

  Re: Finance Chart Bottom and Top Margin distortions
Posted by icm63 on Aug-26-2021 02:11
Where did you get 618 ?

  Re: Finance Chart Bottom and Top Margin distortions
Posted by icm63 on Aug-26-2021 03:10
Code for the numbers below

                Dim x1 As Integer = mainXYChart.getPlotArea.getLeftX

                Dim y1 As Integer = mainXYChart.getPlotArea.getTopY + FC_topMargin

                Dim x2 As Integer = mainXYChart.getPlotArea.getLeftX + mainXYChart.getPlotArea.getWidth - FC_MinMargin

                Dim y2 As Integer = mainXYChart.getPlotArea.getTopY + mainXYChart.getPlotArea.getHeight

Red Square:mainXYChart.makeChart3().rect(x1, y1, x2, y2, &HFF0000, Chart.Transparent)



CHART 1

FC_topMargin:28
FC_bottomMargin:30
FC_leftMargin:40
FC_rightMargin:40
FC_MinMargin:10


--------RED SQUARE SETTINGS------------
x1:40
y1:28 plus 28 = 56
x2:40 plus 610 less 10 = 640
y2:28 plus 628 = 656



WIDTH
x1: Starts at getLeftX = 40
x2: End, Moves right to  getLeftX + getWidth - FC_MinMargin = 640

End less start = 640 - 40 = 600 >> CORRECT USER INPUT

HEIGHT
y1: Starts at getTopY + FC_topMargin = 56
y2: End, Moves down getTopY + getHeight = 28 + 628 = 656

End less start = 656 - 56 = 600 >> CORRECT USER INPUT





CHART 2

FC_topMargin:40   <CHANGED to fit vertical xAxis Dates>
FC_bottomMargin:45   CHANGED to fit vertical xAxis Dates>
FC_leftMargin:40
FC_rightMargin:40
FC_MinMargin:10


--------RED SQUARE SETTINGS------------
x1:40
y1:40 plus 40 = 80
x2:40 plus 610 less 10 = 640
y2:40 plus 640 = 680


WIDTH
x1: Starts at getLeftX = 40
x2: End, Moves right to  getLeftX + getWidth - FC_MinMargin = 640

End less start = 640 - 40 = 600 >> CORRECT USER INPUT


HEIGHT
y1: Starts at getTopY + FC_topMargin = 80
y2: End, Moves down getTopY + getHeight = 40 + 640 = 680

End less start = 680 - 80 = 600 >> CORRECT USER INPUT


POINT: The code for CHART 1 and CHART 2 both reconcile to the CORRECT USER INPUT of 600 x 600.

ERROR: BUT visually the drawing output is FAULTY. What gives?????

  Re: Finance Chart Bottom and Top Margin distortions
Posted by Peter Kwan on Aug-26-2021 11:27
Hi icm63,

The bug is in the line:

y1: Starts at getTopY + FC_topMargin

You can look at your two charts. No matter FC_topMargin is 28 or 40, the space between the top of the plot area and the tick at y = 56 has not changed between the two charts. In both charts it is 28 pixels.

In your previous message, your code seem to set the plot area height as:

Dim FinHeight As Integer = st.PlotHeight + FC_topMargin

Note that the plot area height is the height of the plot area, which is not the same as the "top margin" inside the plot area is larger. Changing the plot area height only changes the axis length, not the "top margin" inside the plot area.

In my earlier message, I suggest to change to:

Dim FinHeight As Integer = st.PlotHeight

You also need to change your other code that assumes the FC_topMargin will change the "top margin" inside the plot area, such as how you compute the y1. It should be:

y1 = getTopY + 28

The 28 comes from the axis margin, which is configurable using FinanceChart.setYAxisStyle. See:

https://www.advsofteng.com/doc/cdnet.htm#FinanceChart.setYAxisStyle.htm

The default y-axis margin is 14 pixels. It is for the legend box. However, because the main chart has a double height legend box, so its margin is twice the normal y-axis margin.

Hope this can help.

Regards
Peter Kwan

  Re: Finance Chart Bottom and Top Margin distortions
Posted by icm63 on Aug-27-2021 02:50
Attachments:
OK here is the result, and I have tested this many times

        'Dim FinHeight As Integer = st.PlotHeight + FC_topMargin

Changed tooo..


        Dim FinHeight As Integer = st.PlotHeight


CHART 1
*******XYCHART FROM MAINCHART**************
User Input width:600, User Input  height:600
mainChart.getDrawArea.getHeight:659
mainChart.getDrawArea.getWidth:690
mainXYChart.getPlotArea.getHeight:600
mainXYChart.getPlotArea.getWidth:610
--------MARGINS------------
FC_topMargin:28
FC_bottomMargin:30
FC_leftMargin:40
FC_rightMargin:40
FC_MinMargin:10
--------RED SQUARE SETTINGS------------
x1:40
y1:28 plus 28 = 56
x2:40 plus 610 less 10 = 640
y2:28 plus 600 = 628
Red Square:mainXYChart.makeChart3().rect(x1, y1, x2, y2, &HFF0000, Chart.Transparent

x2  = 640-40 = 600
y2 = 628-28 = 600

ERROR- BUT Visually the 45 degree line shows the drawing area is NOT SQUARE. I need a perfect SQUARE to draw Gann Angles (as drawn originally)
SH_0001.png

  Re: Finance Chart Bottom and Top Margin distortions
Posted by icm63 on Aug-28-2021 05:23
Attachments:
Here is were I am at, I think there is something weird in Finance Chart code.

Firstly, the above posts shows CHART 2 had two errors. The error at the upper yAxis margin has been fixed with 'FinanceChart.setYAxisStyle' setting the margin variable.

The error which remains is the  trend lines do NOT draw from ZERO, there is a gap.

NOTE: I must draw a area which is SQUARE, 45 degree line must be true ( see prior post). This is why the FC_topMargin is added to st.PlotHeight



STATS

CHART 2
*******XYCHART FROM MAINCHART**************
User Input width:600, User Input  height:600
mainChart.getDrawArea.getHeight:726
mainChart.getDrawArea.getWidth:690
mainXYChart.getPlotArea.getHeight:640
mainXYChart.getPlotArea.getWidth:610
--------MARGINS------------
FC_topMargin:40 <Changed for upper yAxis time detail>
FC_bottomMargin:45 <Changed for upper yAxis time detail>
FC_leftMargin:40
FC_rightMargin:40
FC_MinMargin:10
--------RED SQUARE SETTINGS------------
x1:40
y1:40 plus 40 = 80
x2:40 plus 610 less 10 = 640
y2:40 plus 640 = 680
Red Square:mainXYChart.makeChart3().rect(x1, y1, x2, y2, &HFF0000, Chart.Transparent

X2 - X1: 640-40 = 600 user input
Y2 - Y1: 680-80 = 600 user input


Chart 2
SH_0001.png

  Re: Finance Chart Bottom and Top Margin distortions
Posted by Peter Kwan on Aug-30-2021 14:41
Hi icm63,

I read your code again, and I found that the FinHeight should be:

Dim FinHeight As Integer = st.PlotHeight + 28

and

y1 = getTopY + 28

The 28 is the default y-axis margin. If you set the y-axis margin to 40, then the 28 should be replaced by 40. Basically, the FinHeight and y1 should be consistent.

I am not sure how you draw your trend line. If they are drawn using BaseChart.addLine, the y-coordinate at the bottom should be set to the same value as bottom y-coordinate of your red square.

I suspect your line drawing code for some reasons assume the default margin of 28. When you change the margin, the code is no longer correct. May be you can use the default margin 28 (by not setting the y-axis margin) to see how it works.

To debug the problem, in addition to drawing the line, you can add a semi-transparent shape (eg. a semi-transparent square) at the bottom point of your line, and also add a text box next to the square to display the x and y coordinates used. In this way, you can see the coordinates your code actually used to draw the line. Please let me know what the resulting chart looks like.

Regards
Peter Kwan

  Re: Finance Chart Bottom and Top Margin distortions
Posted by icm63 on Aug-31-2021 04:11
FOUND THE BUG in my DRAWING TRENDLINE from DEGREES code

I had hard coded '30' where I have FC_bottomMargin

*******************************



            'Lines Starting low ending high
            'If TLHL < 87 Or TLHL >= 99 Then
            'Y2 is above top of chart
            If y2 < TOPCHARTMARGIN Then
                x2 = CInt((x2 - x1) * Util.safeDivide((TOPCHARTMARGIN - y1), (y2 - y1), 0, True) + x1)
                y2 = TOPCHARTMARGIN
            End If

            'Y1 is above top of chart
            If y1 < TOPCHARTMARGIN Then
                x1 = CInt((x1 - x2) * Util.safeDivide((TOPCHARTMARGIN - y2), (y1 - y2), 0, True) + x2)
                y1 = TOPCHARTMARGIN
            End If

            'Y2 is below bottom of chart
            If y2 > (TLLay.getPlotArea().getHeight() + FC_bottomMargin) Then
                x2 = CInt((x2 - x1) * Util.safeDivide(((TLLay.getPlotArea().getHeight() + FC_bottomMargin) - y1), (y2 - y1), 0, True) + x1)
                y2 = (TLLay.getPlotArea().getHeight() + FC_bottomMargin)
            End If

            'Y1 is below bottom of chart
            If y1 > (TLLay.getPlotArea().getHeight() + FC_bottomMargin) Then
                x1 = CInt((x1 - x2) * Util.safeDivide(((TLLay.getPlotArea().getHeight() + FC_bottomMargin) - y2), (y1 - y2), 0, True) + x2)
                y1 = (TLLay.getPlotArea().getHeight() + FC_bottomMargin)
            End If
            'End If




            'if both Y's are below or above chart boundaries then dont draw
            If TLHL < 87 Or TLHL >= 99 Then
                If y1 = (TLLay.getPlotArea().getHeight() + FC_bottomMargin) And y2 = (TLLay.getPlotArea().getHeight() + FC_bottomMargin) Then Exit Sub
                If y1 = TOPCHARTMARGIN And y2 = TOPCHARTMARGIN Then Exit Sub
            End If


   TLLay.addLine(x1, y1, x2, y2, TLColorForm, TLWidth)