This question is locked. New answers and comments are not allowed.
I’m developing an app using the Telerik controls. I want to plot a line and then add different custom data points on the graph. I tried to use a Chart series line and a scatter series but the former requires a CatagoricalAxis while the latter requires LinearAxis. So I’m using a second line series, making the line transparent and then adding points. I need to customize the points based on another data set. For example, if the value is 1, draw a circle, 2, draw a square etc…
Here is a sample XMAL and code behind. The typeValueArray are the values that I want to customize the point templates. I don't think this is natively supported, but is there a workaround?
<
Grid
x:Name
=
"LayoutRoot"
Background
=
"Transparent"
>
<
Grid.RowDefinitions
>
<
RowDefinition
Height
=
"Auto"
/>
<
RowDefinition
Height
=
"*"
/>
</
Grid.RowDefinitions
>
<!--TitlePanel contains the name of the application and page title-->
<
StackPanel
x:Name
=
"TitlePanel"
Grid.Row
=
"0"
Margin
=
"12,17,0,28"
>
<
TextBlock
x:Name
=
"ApplicationTitle"
Text
=
"MY APPLICATION"
Style
=
"{StaticResource PhoneTextNormalStyle}"
/>
<
TextBlock
x:Name
=
"PageTitle"
Text
=
"page name"
Margin
=
"9,-7,0,0"
Style
=
"{StaticResource PhoneTextTitle1Style}"
/>
</
StackPanel
>
<!--ContentPanel - place additional content here-->
<
Grid
x:Name
=
"ContentPanel"
Grid.Row
=
"1"
Margin
=
"12,0,12,0"
>
<
chart:RadCartesianChart
x:Name
=
"TimeLine"
>
<
chart:RadCartesianChart.VerticalAxis
>
<
chart:LinearAxis
/>
</
chart:RadCartesianChart.VerticalAxis
>
<
chart:RadCartesianChart.HorizontalAxis
>
<
chart:CategoricalAxis
/>
</
chart:RadCartesianChart.HorizontalAxis
>
<
chart:LineSeries
Stroke
=
"Yellow"
StrokeThickness
=
"1"
/>
<
chart:LineSeries
Stroke
=
"Transparent"
>
<
chart:LineSeries.PointTemplates
>
<
DataTemplate
>
<
Ellipse
Width
=
"10"
Height
=
"15"
Fill
=
"Green"
/>
</
DataTemplate
>
<
DataTemplate
>
<
Ellipse
Width
=
"10"
Height
=
"15"
Fill
=
"Red"
/>
</
DataTemplate
>
<
DataTemplate
>
<
Ellipse
Width
=
"10"
Height
=
"15"
Fill
=
"Yellow"
/>
</
DataTemplate
>
</
chart:LineSeries.PointTemplates
>
</
chart:LineSeries
>
</
chart:RadCartesianChart
>
</
Grid
>
</
Grid
>
namespace PhoneScatterSeries
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
this.TimeLine.Series[0].ItemsSource = new double[] { 1, 2, 1, 3, 2, 1, 3};
//this.TimeLine.Series[1].ItemsSource = new double[] { 1, 1, 3, 1, 3, 2, 1};
LineSeries itemSeries = this.TimeLine.Series[1] as LineSeries;
itemSeries.ValueBinding = new PropertyNameDataPointBinding() { PropertyName = "TypeStat" };
itemSeries.ItemsSource = PopulateValues();
}
private List<
GraphSeriesClass
> PopulateValues()
{
List<
GraphSeriesClass
> DataClass = new List<
GraphSeriesClass
>();
int[] typeStatArray = new int[] { 2, 1, 3, 2, 1, 1, 2 };
int[] typeValueArray = new int[] { 4, 5, 2, 2, 3, 2, 1 };
for (int i = 1; i < 7; i++)
{
GraphSeriesClass ThisSeries = new GraphSeriesClass();
ThisSeries.TypeStat = typeStatArray[i];
ThisSeries.TypeValue = typeValueArray[i];
DataClass.Add(ThisSeries);
}
return DataClass;
}
}
namespace PhoneScatterSeries
{
public class GraphSeriesClass
{
private int _typeStat;
public int TypeStat
{
get {return _typeStat;}
set {_typeStat = value;}
}
private int _typeValue;
public int TypeValue
{
get {return _typeValue;}
set {_typeValue = value;}
}
}
}