This is a migrated thread and some comments may be shown as answers.

Changing the Size of the Points -- and Removing the Colored Area beneath the Line

4 Answers 91 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Greg asked on 28 Jan 2009, 11:01 PM

I'm new to Telerik RAD tools, and I have a couple newbie questions:

1) I'm trying to figure out how to decrease the size of the points on a line chart.  I'd like them to go away completely, or make them so small the line masks where they are.  Is there a way to turn them off?

2) I'd like to know where it is you can change what kind of chart you're working with.  Right now, I have a LineArea chart, and I'd like to change it to just a Line chart.  For me, the default is line area, and I need the fill area beneath the line to be clear.

3) I'd also like to know how you set the speed of the animation of the line. Right now I have the animation disabled, but it would be nice to have it animate EXTREMELY fast.  Right now we have 600 points on a line graph, and I'd like to animate those points (3 major peaks) in about 3 seconds... and then perhaps repeat.  (We're simulating a heart beat EKG)

Any advice or help would be much appreciated.  Thanks so much! 


4 Answers, 1 is accepted

Sort by
Telerik team
answered on 29 Jan 2009, 04:01 PM
Hi Greg,

Here is what you should do to achieve this appearance:
  1. You can change the chart type by simply changing the series definition of your DataSeries collection to LineSeriesDefinition.
  2. You can hide the point marks of the series by setting the ShowPointMarks property of the series definition to false.
  3. You can adjust the animation of the series by creating an AnimationSettings  object with suitable values and setting it to the AnimationSettings property of your DataSeries. You can find this in our online examples: Chart -> Customization ->Custom Animation Settings.

Following is a sample code demonstrating how to do this:
            double totalAnimationDirationInSeconds = 1d
            DataSeries lineSeries = new DataSeries(); 
            LineSeriesDefinition definition = new LineSeriesDefinition(); 
            definition.ShowPointMarks = false
            AnimationSettings settings = new AnimationSettings(); 
            settings.TotalSeriesAnimationDuration = TimeSpan.FromSeconds(totalAnimationDirationInSeconds); 
            settings.ItemAnimationDuration = TimeSpan.FromSeconds(totalAnimationDirationInSeconds / lineSeries.Count); 
            definition.AnimationSettings = settings
            lineSeries.Definition = definition

Hope this helps.

the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Roxana C
Top achievements
Rank 1
answered on 04 Dec 2009, 09:34 AM
Showing or hiding pointmarks on a LineSeriesDefinition in an easy task, but I cannot make this points smaller or bigger in any way, and the Telerik tutorial won't work either. This thing is critical for my chart becauze I may have more than 100 points in a serie and I might want to see them all there.

Telerik team
answered on 08 Dec 2009, 12:36 PM
Hi Roxana C,

 You can use this code to change the size of the point marks:

 <Style x:Name="CustomPointMarkStyle" TargetType="telerikCharting:PointMark">
                <Setter Property="Size" Value="4" />
                <Setter Property="Template">
                        <ControlTemplate TargetType="telerikCharting:PointMark">
                                <Path x:Name="PART_PointMarkPath"
                              Canvas.Left="{TemplateBinding PointMarkCanvasLeft}"
                              Canvas.Top="{TemplateBinding PointMarkCanvasTop}"
                              Style="{TemplateBinding ShapeStyle}"
                              Width="{TemplateBinding Size}"
                              Height="{TemplateBinding Size}"
                              Stretch="Fill" >
                                        <PathGeometry x:Name="PART_PointMarkPathGeometry" />
//Code Behind
            ISeriesDefinition def = new LineSeriesDefinition();
            def.PointMarkItemStyle = this.CustomPointMarkStyle;

Hope this will help.

Sincerely yours,
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Roxana C
Top achievements
Rank 1
answered on 14 Dec 2009, 02:25 PM

Apparently using >> x:Name="CustomPointMarkStyle;"  <<  in xaml code and
>> this.CustomPointMarkStyle;
  << in .xaml.cs doesn't compile

but if I use x:Key="CustomPointMarkStyle;"
&  (Style)FindResource( "CustomPointMarkStyle" ); behind the scene -  everything goes smoothly  :)

Thank you very much!
Asked by
Top achievements
Rank 1
Answers by
Telerik team
Roxana C
Top achievements
Rank 1
Share this question