Coloring point symbols on a line series.

[BenW]

Hello.

I'm using a line series where the pointer style is being set dynamically. I can control the color of each line that is drawn from point symbol to point symbol to match my data quality coloring requirement, using the colorEach capability. Sadly I'm not able to control the point symbol (I believe the correct name is pointer ?), (e.g. triangle or circle representing the point), in the same colorEach manner. It seems that at the time I add the point to the series and re-assign the color to the series pointer pen as follows:

e.g.
((Steema.TeeChart.Styles.Line)s).ColorEach = true;
s.Marks.Pen.Color = dataQualityColor;
((Steema.TeeChart.Styles.Line)s).Pointer.Pen.Color = dataQualityColor;
((Steema.TeeChart.Styles.Line)s).Pointer.Color = dataQualityColor;
//s.Color = dataQualityColor;
s.Add(((DateTime)trendDataList.List.DataArray[0]), ((double)trendDataList.List.DataArray[1]), dataQualityColor);

then all previously added pointer symbols are reset to the specified new color. Is it possible to color each pointer symbol independently in the same manner as I'm able to do for the connecting lines?

(Note, I did try implementing the GetSeriesMark event handler to somehow change the color in the desired manner, but with no success)

Do I need to use the linepoint series instead of a line series? I know the point series can be controlled in this way, but I need to have the connecting lines capability...

T.I.A.
Ben.

[Narcís]

Hi Ben,

To change series pointer style you should use GetPointerStyle event as shown in Tutorial6 - Working with Series. You'll find the tutorials at TeeChart's program group.

[BenW]

Hi Narcis, thanks for the reply.

I did consider this, but there's no indication in the turorial on how to change the color for that instance of the style in the event handler. The following sample code from your turorial:

Private Sub Line1_GetPointerStyle(ByVal series As Steema.TeeChart.CustomPointSeries, ByVal e As Steema.TeeChart.CustomPointSeries.GetPointerStyleEventArgs) Handles Line1.GetPointerStyle
If e.ValueIndex > 0 Then
If (Line1.YValues(e.ValueIndex) > Line1.YValues(e.ValueIndex - 1)) Then
e.Style = Steema.TeeChart.PointerStyles.Triangle
ElseIf (Line1.YValues(e.ValueIndex) < Line1.YValues(e.ValueIndex - 1)) Then
e.Style = Steema.TeeChart.PointerStyles.DownTriangle
Else
e.Style = Steema.TeeChart.PointerStyles.Diamond
End If
Else e.Style = Steema.TeeChart.PointerStyles.Diamond
End If
End Sub

...shows how to change the pointer style (diamond, triangle, etc), but not how to change the color.

Is it possible to change the color at the granularity I require, i.e. on a point by point basis?

Kind Regards,
Ben.

[Marjan]

Hi.

In the GetPointerStyle event you could use the following code to change ValueIndex point color:

Code: Select all

// C# version
int pointindex = e.ValueIndex;
if (index>1)
{
  if (series.YValues[index]-series.YValues[index-1]>0)
  {
    series.ValueColor[index] = Color.Greed;
  }
  else
  {
    series.ValueColor[index] = Color.Red;
  }
}

Alternatively, you could also use series AfterAdd event to do the same thing (change added point color).

[BenW]

Hi Marjan.

The ValueColor array is not accessible from my series. There is a function called ValueColor(int index), but it's equivalent to a get (not set) method.

The documentation is also confusing because it seems to indicate that the color can be set/gotten using the same method.

Is there another way to set the color in the manner I need using the GetPointerStyle event? It looks like the ValueColor[] array would be a good way to go, so is there another coding route to get to this array from the series?

Note, the documentation for the ValueColor() method reads:

Remarks

Use the ValueColor property to get or set the Color of a point at a particular position. Index gives the position of the point, where 0 is the first, 1 is the second, and so on.


thanks,
Ben.

[Marjan]

Hi.

Sorry for the confusion, I mixed the VCL and .NET version. In .NET, you could use the Colors array to control individual point color. For example:

Code: Select all

int index = e.ValueIndex;
// plot all positive values green, negative and zero red
if (series.YValues[index] > 0) series.Colors[index] = Color.Green;
else series.Colors[index] = Color.Red;

or in VB.NET:

Code: Select all

Private Sub Points1_GetPointerStyle(ByVal series As Steema.TeeChart.Styles.CustomPoint, ByVal e As Steema.TeeChart.Styles.GetPointerStyleEventArgs) Handles Points1.GetPointerStyle
  If series.YValues(e.ValueIndex) > 0 Then
    series.Colors(e.ValueIndex) = Color.Green
  Else : series.Colors(e.ValueIndex) = Color.Red
  End If
End Sub

[BenW]

Hi Marjan,

Thanks for the update, sadly this is still not having the desired effect. The event handler is being called for each point that is in the series, which is undesirable as the series grows. Also after assigning the color in the event handler, the color of the point symbol (e.g. triangle) does not change to the assigned color ??

Marjan, I'm thinking that it should be possible to set the color of the plotted symbol, right at the time the new sample is added to the series. I'm surprised that when I call the overloaded Add(...) method that specifies the sample color of the series as follows:

Color dataQualityColor = Color.Red;
s.Add(((DateTime)trendDataList.List.DataArray[0]), ((double)trendDataList.List.DataArray[1]), dataQualityColor);
that it doesn't also set the color of the symbol when it is plotted...

What am I missing here?

Regards,
Ben.

[Narcís]

Hi Ben,

You may need to set ColorEach to true for your series before populating them:

Code: Select all

			s.ColorEach = true;

[BenW]

Hi Narcís,

Setting the ColorEach for my series hasn't made a difference ??

My series is of type Steema.TeeChart.Styles.Line, and I get the impression that the ColorEach property is really applicable to series of type Steema.TeeChart.Styles.Points. I know that setting the ColorEach property for another independent 'Points' type series in my application, does work.

Are there any properties that I may be setting against my 'Line' series that may be counteracting/inhibiting the dynamic coloring of the point symbols in the way I need?

Ben.

[Narcís]

Hi Ben,

Ok, then you can try using this:

Code: Select all

			s.ColorEachLine = true;

[BenW]

Hi Narcís,

I've tried that already with no change in behaviour. Here's my series creation and initialization code:

protected virtual void PreConfigureLine()
{
Steema.TeeChart.Styles.Line line = new Steema.TeeChart.Styles.Line();
line.ColorEach = true;
line.ColorEachLine = true;
line.Brush.Color = System.Drawing.Color.Brown;
line.HorizAxis = Steema.TeeChart.Styles.HorizontalAxis.Both;
line.VertAxis = Steema.TeeChart.Styles.VerticalAxis.Both;
line.LinePen.Color = System.Drawing.Color.Brown;
line.OutLine.Color = System.Drawing.Color.Brown;
line.Marks.Callout.Arrow = line.Marks.Arrow;
line.Marks.Callout.ArrowHead = Steema.TeeChart.Styles.ArrowHeadStyles.None;
line.Marks.Callout.ArrowHeadSize = 8;
line.Marks.Callout.Brush.Color = System.Drawing.Color.Black;
line.Marks.Callout.Distance = 0;
line.Marks.Callout.Draw3D = false;
line.Marks.Callout.Length = 10;
line.Marks.Callout.Style = Steema.TeeChart.Styles.PointerStyles.Triangle;
line.Marks.Font.Shadow.Visible = false;
line.Pointer.Brush.Color = System.Drawing.Color.Brown;
line.Pointer.HorizSize = 2;
line.Pointer.Pen.Color = System.Drawing.Color.Brown;
line.Pointer.Style = Steema.TeeChart.Styles.PointerStyles.Triangle;
line.Pointer.VertSize = 2;
line.Pointer.Visible = true;
line.Title = "Line Pen";
line.XValues.DataMember = "X";
line.XValues.Order = Steema.TeeChart.Styles.ValueListOrder.Ascending;
line.YValues.DataMember = "Y";
this.series = line;
}

Is there anything in the initialization that may be adversely impacting the desired functionality?

thanks,
Ben.

[Edu]

Hi BenW

Here It's working fine using lastest release (Build 2.0.2586.24038 "avaible at the web") and the below code

Code: Select all

private void Form1_Load(object sender, EventArgs e)
        {
            Steema.TeeChart.Styles.Line line = new Steema.TeeChart.Styles.Line(tChart1.Chart);
            //Steema.TeeChart.Styles.Line line = new Steema.TeeChart.Styles.Line();
            line.ColorEach = true;
            line.ColorEachLine = true;
            line.Brush.Color = System.Drawing.Color.Brown;
            line.HorizAxis = Steema.TeeChart.Styles.HorizontalAxis.Both;
            line.VertAxis = Steema.TeeChart.Styles.VerticalAxis.Both;
            line.LinePen.Color = System.Drawing.Color.Brown;
            line.OutLine.Color = System.Drawing.Color.Brown;
            line.Marks.Callout.Arrow = line.Marks.Arrow;
            line.Marks.Callout.ArrowHead = Steema.TeeChart.Styles.ArrowHeadStyles.None;
            line.Marks.Callout.ArrowHeadSize = 8;
            line.Marks.Callout.Brush.Color = System.Drawing.Color.Black;
            line.Marks.Callout.Distance = 0;
            line.Marks.Callout.Draw3D = false;
            line.Marks.Callout.Length = 10;
            line.Marks.Callout.Style = Steema.TeeChart.Styles.PointerStyles.Triangle;
            line.Marks.Font.Shadow.Visible = false;
            line.Pointer.Brush.Color = System.Drawing.Color.Brown;
            line.Pointer.HorizSize = 2;
            line.Pointer.Pen.Color = System.Drawing.Color.Brown;
            line.Pointer.Style = Steema.TeeChart.Styles.PointerStyles.Triangle;
            line.Pointer.VertSize = 2;
            line.Pointer.Visible = true;
            line.Title = "Line Pen";
            line.XValues.Order = Steema.TeeChart.Styles.ValueListOrder.Ascending;
            //this.series = line;

            line.DataSource = CreateDataSet();
            line.YValues.DataMember = "SALARY";
            line.XValues.DataMember = "ID";
            line.LabelMember = "LASTNAME";
            line.ColorMember = "COLOR";

            line.CheckDataSource(); 

        }

        private DataTable CreateDataSet()
        {
            DataTable Employee = new DataTable();

            DataColumn SALARY = new DataColumn("SALARY", Type.GetType("System.Int32"));
            DataColumn ID = new DataColumn("ID", Type.GetType("System.Int32"));
            DataColumn LASTNAME = new DataColumn("LASTNAME", Type.GetType("System.String"));
            DataColumn COLOR = new DataColumn("COLOR", Type.GetType("System.Object")); 

            Employee.Columns.Add(SALARY);
            Employee.Columns.Add(ID);
            Employee.Columns.Add(LASTNAME);
            Employee.Columns.Add(COLOR);


            DataRow dataRow0;
            dataRow0 = Employee.NewRow();
            dataRow0[SALARY] = 10;
            dataRow0[ID] = 0;
            dataRow0[LASTNAME] = "George";
            dataRow0[COLOR] = Color.Black;

            Employee.Rows.Add(dataRow0);

            DataRow dataRow;
            dataRow = Employee.NewRow();
            dataRow[SALARY] = 10000;
            dataRow[ID] = 1;
            dataRow[LASTNAME] = "Jones";
            dataRow[COLOR] = Color.Red;

            Employee.Rows.Add(dataRow);

            DataRow dataRow2;
            dataRow2 = Employee.NewRow();
            dataRow2[SALARY] = 96000;
            dataRow2[ID] = 2;
            dataRow2[LASTNAME] = "Sam";
            dataRow2[COLOR] = Color.Green;

            Employee.Rows.Add(dataRow2);

            DataRow dataRow3;
            dataRow3 = Employee.NewRow();
            dataRow3[SALARY] = 50200;
            dataRow3[ID] = 3;
            dataRow3[LASTNAME] = "Eva";
            dataRow3[COLOR] = Color.Blue;

            Employee.Rows.Add(dataRow3);

            DataRow dataRow4;
            dataRow4 = Employee.NewRow();
            dataRow4[SALARY] = 106943;
            dataRow4[ID] = 4;
            dataRow4[LASTNAME] = "Tom";
            dataRow4[COLOR] = Color.Yellow;

            Employee.Rows.Add(dataRow4);

            DataRow dataRow5;
            dataRow5 = Employee.NewRow();
            dataRow5[SALARY] = 26943;
            dataRow5[ID] = 5;
            dataRow5[LASTNAME] = "Gerrard";
            dataRow5[COLOR] = Color.Tomato;

            Employee.Rows.Add(dataRow5);

            return Employee;
        }

Which version are you using? Could you please try with the last version?

If the problem persist could you please send us a simple example project we can run "as-is" to reproduce the issue here?

You can post your files either at [url]news://www.steema.net/steema.public.attachments[/url] newsgroup or at our upload page

[BenW]

Hi Edu.

I had to digress for a few weeks in order to address some memory leak issues, but now I'm back looking at this issue.

I downloaded and 'fitted' the latest release (2.0.2586.24039) into our product, but sadly it did not fix my issue. However, your code helped me create a test app to try and reproduce the issue to send on to you. My app does not use a dataset to drive data updates but always uses the .Add() method against the series. Anyways my test app seemed to work well. At this point (a little confused), I discovered that in my code, after I add new data updates, I execute code to purge data values from the ValuesLists (X and Y), that are older than the timespan specified for the trends X-axis. It turns out this is where my color confusion issue arises. By ensuring that I also purge the corresponding .Colors series property values, the data values and colors remain aligned for the series, and my trend line color issue goes away...

...so, thanks for your sample. Ultimately it helped me get to the bottom of my issue. If there is a better (easier) way in which I should be synchronously purging data(X,Y)/color values then please let me know what this is...

Kind Regards,
Ben.

[Christopher]

Hello Ben,

Well, in v2 you have the SetNull() method which you can use to update the indexes of null values within the Series valuelists.

In v3 you'll be able to work with nullable values, meaning that updating arrays of double?[], say, will automatically refresh series null values where there is a (double?)null.

[BenW]

OK thanks...

...on a related issue, if I have a line series, is it possible to color the series marker (e.g. triangle) independently of the line that connects the markers ??

If so, how is this achieved?

thanks,
Ben.