Series Line skip and label questions

[DALC.SENIOR]

How can I just skip over a point in a series if it doesn't have a value?

S1.data.values = [R1, R2, R3, R4, R5, R6, R7, R8, R9];
S1.data.x = [250, 500, 1000, 1500, 2000, 3000, 4000, 6000, 8000];

Like if R4 is a null value?

X axis labels = [".25K",".5K", "1K", "1.5K", "2K", "3K", "4K", "6K", "8K"];
I want the labels to print whether the particular point in the series has a value or not.

Also, how can I make each of the labels on the X axis be equal distance apart, even if they're numeric and not an equal value apart?

[Yeray]

Hi,

You can add null values as in the following example:

Code: Select all

Chart1.addSeries(new Tee.Line([5,3,2,null,7,1]) );

[DALC.SENIOR]

Thank you. I will give that a try.

[DALC.SENIOR]

That did not work. Wondering if there is something in the setup that I am missing.

[Yeray]

Hi,

Sorry, the actual version doesn't support treatNulls so with a Line series you can add the null points and they are just skipped.
The next maintenance release will include the treatNulls property that will allow you to choose between:
"skip": it doesn't draw the point but the line segment between the points before and after the null point is still drawn.
"dontPaint": the point isn't drawn and neither the segment linking the points next to it.

[DALC.SENIOR]

Is the best workaround then to stop when reaching a null, and then manually join the prior point and the next point?
Do you know of another workaround? I have worked with TeeChart in Delphi before, but not in javascript. We now need our graph on our web page.

Are there any manuals or books that can be downloaded that describe the TeeChart javascript process.

[DALC.SENIOR]

For some reason I did get part of it working today:
AChart=new Tee.Chart("canvas1");
var SerR=new Tee.Line();
R1=50, R2=null, R3=80, R4=40, R5=40, R6=50, R7=null, R8=80, R9=80 ;
SerR.data.values.clear;
SerR.data.x = [250, 500, 1000, 1500, 2000, 3000, 4000, 6000, 8000];
SerR.data.values = [R1, R2, R3, R4, R5, R6, R7, R8, R9];
SerR.data.labels = [".25K", ".5K", "1K", "1.5K", "2K", "3K", "4K", "6K", "8K"];
AChart.addSeries(SerR).pointer.visible = true;

Not sure what happened other than maybe order of lines changed.
Now to get the X=axis to space equally between the 9 points, even though their numeric difference is not equal.
Any suggestions would be appreciated.

[Yeray]

Hi

Not sure what happened other than maybe order of lines changed.

I'm glad to hear you made it work fine. If you find what makes the difference, don't hesitate to share it with us.

Now to get the X=axis to space equally between the 9 points, even though their numeric difference is not equal.
Any suggestions would be appreciated.

You can play with the axis increment.

Code: Select all

AChart.axes.bottom.increment = 1000;

However, no label will be drawn where you don't have a point. So you may prefer to show the axis values instead of the series labels in the bottom axis labels:

Code: Select all

AChart.axes.bottom.labels.labelStyle = "value";

[DALC.SENIOR]

Yes, I have tried that and it helps, but is not what our user's expect to see.
Previously in a Delphi7 & TeeChart application I did several years ago, I manually drew grid lines on the graph in that way.
Haven't seen a way in TeeChart for javascript to do that yet.

[Yeray]

Hello,

This is what I get with the code below and the actual sources we have here, isn't it what you are expecting?
If not, please, try to describe what are you expecting to achieve, or show it to us in a picture.

2013-04-17_1516.png (31.69 KiB) Viewed 25157 times

Code: Select all

  var SerR=new Tee.Line();
  R1=50, R2=null, R3=80, R4=40, R5=40, R6=50, R7=null, R8=80, R9=80 ;
  SerR.data.values.clear;
  SerR.data.x = [250, 500, 1000, 1500, 2000, 3000, 4000, 6000, 8000];
  SerR.data.values = [R1, R2, R3, R4, R5, R6, R7, R8, R9];
  SerR.data.labels = [".25K", ".5K", "1K", "1.5K", "2K", "3K", "4K", "6K", "8K"];
  Chart1.addSeries(SerR).pointer.visible = true;
  Chart1.axes.bottom.increment = 1000;
  Chart1.axes.bottom.labels.labelStyle = "value";

[DALC.SENIOR]

Yes, those are the points. The problem is that it is the points that need to be equal distance apart, not the numbers.

_____ .25K_____.5K_____ 1K _____ 2K _____ 4K _____ 8K are spaced equally on the x-axis.

I also need some custom symbols for some of the points.

[Yeray]

Hello,

Yes, those are the points. The problem is that it is the points that need to be equal distance apart, not the numbers.

_____ .25K_____.5K_____ 1K _____ 2K _____ 4K _____ 8K are spaced equally on the x-axis.

In that case, you should add the points in equidistant data.x values and show the non-equidistant values, your series labels:

Code: Select all

  Chart1=new Tee.Chart("canvas1");

  var SerR=new Tee.Line();
  R1=50, R2=null, R3=80, R4=40, R5=40, R6=50, R7=null, R8=80, R9=80 ;
  SerR.data.values.clear;
  SerR.data.values = [R1, R2, R3, R4, R5, R6, R7, R8, R9];
  SerR.data.labels = [".25K", ".5K", "1K", "1.5K", "2K", "3K", "4K", "6K", "8K"];
  Chart1.addSeries(SerR).pointer.visible = true;
  
  Chart1.draw();

2013-04-18_1123.png (32.69 KiB) Viewed 25144 times

I also need some custom symbols for some of the points.

Since this isn't strictly related, please, continue the discussion in the according thread if the solution suggested doesn't fit your needs:
http://www.teechart.net/support/viewtop ... 18&t=13981