User drawn lines automatically extend?

[dave]

Users will often draw trend lines on financial charts. Putting a line segment on a chart with TeeCharts is very easy. Do you have any way to make those lines automatically extend toward the right-side axis as new data and new bars are added over time? How about a property like:

DrawLine.Extend = True

Thanks!

Dave

[Sandra]

Hello Dave,

I'm not sure about are you want do. Could you please give us more detailed information and explain exactly what do you want achieve?

Thanks,

[dave]

The following image is a screen shot of a chart that will update live. Notice that there are two trend lines that have been drawn on the chart. They may represent support or resistance lines on which the user wants to keep watch. Because they are simply line segments that have distinct start and end points, as time goes by those lines are going to scroll to the left, and eventually off the visible portion of the chart. It would be very handy to have a line style which, when positioned by the two points, autmatically drew themselves off to the right hand side of the chart. (They do not need to extend to the left since that is old information.) As new bars are added to the chart and the old data scrolls to the left, the chart Redraw function would again extend the line to the right.

ESH1 Chart

ESH1.jpg (280.68 KiB) Viewed 6886 times

Here the chart has had a few minutes to add some new bars. You can see how the trend lines are moving left with the chart. I am looking for a way to make the right-most end of the line fire out to the right side without the user having to modify anything.

Hope this makes sense!

Second Chart

ESH1-2.jpg (293.7 KiB) Viewed 6891 times

[Sandra]

Hello Dave,

I have made for you, two simple examples. One draws a Line directly in the canvas and other, draws lines using tools DrawLine and DrawLineItem.
First: Simple code where is drawn a line directly in canvas in AfterDraw Event:

Code: Select all

 Steema.TeeChart.Styles.Bar Series1;
        Steema.TeeChart.Tools.DrawLine drawLine1;
        int Count;       
        private void InitialzieChart()
        { //InitializeChart
            tChart1.Aspect.View3D = false;
            //Series
            Series1 = new Steema.TeeChart.Styles.Bar(tChart1.Chart);
            this.Series1.FillSampleValues(5);    
            tChart1.AfterDraw += new Steema.TeeChart.PaintChartEventHandler(tChart1_AfterDraw);
            tChart1.Draw();         
        }
       void tChart1_AfterDraw(object sender, Steema.TeeChart.Drawing.Graphics3D g)
        {   //Draw DrawLine.
            tChart1.Tools.Clear();
            Count = Series1.Count;
            drawLine1 = new Steema.TeeChart.Tools.DrawLine(tChart1.Chart);
            drawLine1.EnableDraw = false;

            for (int i = 0; i < Count; i++)
            {
                Steema.TeeChart.Tools.DrawLineItem I = new Steema.TeeChart.Tools.DrawLineItem(drawLine1);
                I.StartPos = new Steema.TeeChart.Drawing.PointDouble(Series1[i].X, Series1[i].Y);
                I.EndPos = new Steema.TeeChart.Drawing.PointDouble(Series1[Count - 1].X, Series1[Count - 1].Y);
            }
        }
        private void button1_Click(object sender, EventArgs e)
        {  //Add more data.
            Random rnd = new Random();
            tChart1[0].Add(tChart1[0].Count, rnd.Next(100));
            tChart1.Draw();
        }

Second: Simple code where is used tools DrawLine and DrawLineItem to draw lines.

Code: Select all

     Steema.TeeChart.Styles.Bar Series1;
        Steema.TeeChart.Tools.DrawLine drawLine1;
        int Count;       
        private void InitialzieChart()
        { //InitializeChart
            tChart1.Aspect.View3D = false;
            //Series
            Series1 = new Steema.TeeChart.Styles.Bar(tChart1.Chart);
            this.Series1.FillSampleValues(5);    
            tChart1.AfterDraw += new Steema.TeeChart.PaintChartEventHandler(tChart1_AfterDraw);
            tChart1.Draw();         
        }
       void tChart1_AfterDraw(object sender, Steema.TeeChart.Drawing.Graphics3D g)
        {   //Draw DrawLine.
            tChart1.Tools.Clear();
            Count = Series1.Count;
            drawLine1 = new Steema.TeeChart.Tools.DrawLine(tChart1.Chart);
            drawLine1.EnableDraw = false;

            for (int i = 0; i < Count; i++)
            {
                Steema.TeeChart.Tools.DrawLineItem I = new Steema.TeeChart.Tools.DrawLineItem(drawLine1);
                I.StartPos = new Steema.TeeChart.Drawing.PointDouble(Series1[i].X, Series1[i].Y);
                I.EndPos = new Steema.TeeChart.Drawing.PointDouble(Series1[Count - 1].X, Series1[Count - 1].Y);
            }
        }
        private void button1_Click(object sender, EventArgs e)
        {  //Add more data.
            Random rnd = new Random();
            tChart1[0].Add(tChart1[0].Count, rnd.Next(100));
            tChart1.Draw();
        }

How you can see in previous code, is drawn a line for each value of Series, Series bar in this case.

Can you tell us, if previous codes work as you want?

I hope will helps.

Thanks,

[dave]

I am not sure if you understood my question. It really has nothing to do with drawing the underlying series. That works just fine. It is about the DrawLine tool, specifically.

Let's say you draw a line from point A to point B. Right now the drawline tool will draw a line segment connecting those two points. What I am looking for is a way to have the line continue right through the right-most point, extending in a straight line until is hit one of the axes. As new bars are added to the chart and the chart is redrawn, that line would continue to extend to the axis.

In financial charts it is common for a trader to draw a line connecting some significant points. That line is then extended into the future on the chart. As the price approaches or crosses that line, the trader may make some buy or sell decision. Having the ability to create a line and then have it appear on the chart, extending automatically into the future would be very useful for anyone doing financial charts.

[Sandra]

Hello dave,

Sorry, I understood that you wanted that line touch last value of series that painted. Now, I have modified my code, because drawlines touch the right axis. I have done two modifications in AfterDraw event:


First: Using y variable that is a sum between MinYValue and half of difference of MaxYValue and MinYValue to calculate EndPos.Y point:

Code: Select all

void tChart1_AfterDraw(object sender, Steema.TeeChart.Drawing.Graphics3D g)
        {   //Draw DrawLine.
            tChart1.Tools.Clear();
            Count = Series1.Count;
            drawLine1 = new Steema.TeeChart.Tools.DrawLine(tChart1.Chart);
            drawLine1.EnableDraw = false;

            double y = Series1.MinYValue() + (Series1.MaxYValue() - Series1.MinYValue()) / 2;

            for (int i = 0; i < Count; i++)
            {
                Steema.TeeChart.Tools.DrawLineItem I = new Steema.TeeChart.Tools.DrawLineItem(drawLine1);
                I.StartPos = new Steema.TeeChart.Drawing.PointDouble(Series1[i].X, Series1[i].Y);
                I.EndPos = new Steema.TeeChart.Drawing.PointDouble(tChart1.Axes.Right.CalcXPosValue(tChart1.Axes.Right.Position), y);
            }
        }

Second: Using Series.Y to calculate EndPos.Y point.

Code: Select all

void tChart1_AfterDraw(object sender, Steema.TeeChart.Drawing.Graphics3D g)
        {   //Draw DrawLine.
            tChart1.Tools.Clear();
            Count = Series1.Count;
            drawLine1 = new Steema.TeeChart.Tools.DrawLine(tChart1.Chart);
            drawLine1.EnableDraw = false;

            double y = Series1.MinYValue() + (Series1.MaxYValue() - Series1.MinYValue()) / 2;

            for (int i = 0; i < Count; i++)
            {
                Steema.TeeChart.Tools.DrawLineItem I = new Steema.TeeChart.Tools.DrawLineItem(drawLine1);
                I.StartPos = new Steema.TeeChart.Drawing.PointDouble(Series1[i].X, Series1[i].Y);
                I.EndPos = new Steema.TeeChart.Drawing.PointDouble(tChart1.Axes.Right.CalcXPosValue(tChart1.Axes.Right.Position), Series[i].Y);
            }
        }

Please, could you say if this modification work as you wants? If doesn't like it please tell us exactly values you want use, so we can make and example for you, more exactly.

I hope will helps.

Thanks,

[dave]

Finally back to looking at this one... My guess is that your solution will move the end point toward the right hand edge of the chart, but I do not see anything in the code that would account for maintainnig the slope of the original line. If you just bump over the right-most point, the line slope will eventually flatten out. If one is recalculating that right point, it has to move both horizontally and vertically. If you have done it and have an example, that would be great. Your existing solution does point me in the right direction, calculate the horizontal offset of the scrolled chart and then figure out the math for keeping the slope of the line in there. (My highschool geometry teacher would be proud. I finally have a use for some of the knowlege she tried to impart to me! Now, if I can just clear out the cobwebs and remember what she taught me!!)

[Narcís]

Hi dave,

Probably you'll find some of the maths necessary for calculating the slope of a line at the All Features\Welcome !\Chart styles\Standard\Line(Strip)\Interpolating line series example in the features demo, available at TeeChart's program group.

Hope this helps!