I'm creating the columns in a RadGridView by code:
this.radGridView.Columns.Add(new SparkLineColumn()
{
UniqueName = column.ColumnName,
Header = CommonTranslations.ResourceManager.GetString(column.LabelKey),
DataMemberBinding = new Binding(string.Format(BINDING_STRING, index)),
Width = column.Width,
IsSortable = column.IsSortable,
IsFilterable = column.IsFilterable
}
);
And I have the class:
public class SparkLineColumn : GridViewDataColumn
{
public override FrameworkElement CreateCellElement(GridViewCell cell, object dataItem)
{
line = new RadLinearSparkline();
Random r = new Random();
List<double> myData = new List<double>();
for (int i = 0; i < 20; i++)
{
myData.Add(r.Next(0, 100));
}
line.ItemsSource = myData;
return line;
}
}
But the RadGridView columns doesn't show the graph,
I can show Buttons and RadChart, but SparkLine......
I have been testing with
q2 2012
q1 2013
Thanks
this.radGridView.Columns.Add(new SparkLineColumn()
{
UniqueName = column.ColumnName,
Header = CommonTranslations.ResourceManager.GetString(column.LabelKey),
DataMemberBinding = new Binding(string.Format(BINDING_STRING, index)),
Width = column.Width,
IsSortable = column.IsSortable,
IsFilterable = column.IsFilterable
}
);
And I have the class:
public class SparkLineColumn : GridViewDataColumn
{
public override FrameworkElement CreateCellElement(GridViewCell cell, object dataItem)
{
line = new RadLinearSparkline();
Random r = new Random();
List<double> myData = new List<double>();
for (int i = 0; i < 20; i++)
{
myData.Add(r.Next(0, 100));
}
line.ItemsSource = myData;
return line;
}
}
But the RadGridView columns doesn't show the graph,
I can show Buttons and RadChart, but SparkLine......
I have been testing with
q2 2012
q1 2013
Thanks
11 Answers, 1 is accepted
0
Hello Rodrigo,
Tsvetie
the Telerik team
I created a simple page to test your code, but the sparkline controls in the column of the gridView showed as expected. I have attached my test page for your reference. In case the problem persists, please open a new support ticket and send me a simple running project, demonstrating the problem.
Tsvetie
the Telerik team
Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.
0
Asutosh
Top achievements
Rank 1
Rank 1
answered on 05 Jul 2014, 10:31 AM
hi
i am creating sparkline chart in radgrid column
its works fine
but the issue is i can not format my sparkline tool tip
my date format is come as june 2012 but it convert it in 6/1/2012
i want that date format as june 2012 in tooltip
how can i set it?
i have attached error screen shot
thanks
i am creating sparkline chart in radgrid column
its works fine
but the issue is i can not format my sparkline tool tip
my date format is come as june 2012 but it convert it in 6/1/2012
i want that date format as june 2012 in tooltip
how can i set it?
i have attached error screen shot
thanks
0
Hello Asutosh,
Please refer to MSDN for information on DateTime format strings:
Regards,
Tsvetie
Telerik
Please refer to MSDN for information on DateTime format strings:
Regards,
Tsvetie
Telerik
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
0
Asutosh
Top achievements
Rank 1
Rank 1
answered on 07 Jul 2014, 10:53 AM
hi
i know that how to format that
i have attached image in that in tool tip date is display like 1/12/2012 while i want to display it as dec 2012 and also that field also come as dec 2012 from my table but in spark line it automatically convert it in dec 2012 to 1/12/2012
so how can i show my date field in tool tip is as dec 2012 ?
i know that how to format that
i have attached image in that in tool tip date is display like 1/12/2012 while i want to display it as dec 2012 and also that field also come as dec 2012 from my table but in spark line it automatically convert it in dec 2012 to 1/12/2012
so how can i show my date field in tool tip is as dec 2012 ?
0
Hi Asutosh,
I am not quite sure I understand the problem you have. Could you please open a new support ticket and send me a simple running project, demonstrating the problem?
Regards,
Tsvetie
Telerik
I am not quite sure I understand the problem you have. Could you please open a new support ticket and send me a simple running project, demonstrating the problem?
Regards,
Tsvetie
Telerik
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
0
Asutosh
Top achievements
Rank 1
Rank 1
answered on 10 Jul 2014, 10:45 AM
hi
i have 1 sparkline chart
in that i have date value to show in chart
i have tooltip also in that chart
now in tool tip date is display in MM/DD/YYYY formate while i want to show it as MM/YYYY format
how can i do that?
i have 1 sparkline chart
in that i have date value to show in chart
i have tooltip also in that chart
now in tool tip date is display in MM/DD/YYYY formate while i want to show it as MM/YYYY format
how can i do that?
0
Hello Asutosh,
I suppose you are using a custom template for the tooltip. In this custom template, you probably have a TextBox and you have bound the Text property of the control to a property of the DataContext. If this is the case, you can use the Binding.FormatString property to apply the format string that you need. You can find the information you need regarding DateTime format strings in MSDN as well.
In case you need additional help, please open a new support ticket and send me the code that you need help with.
Regards,
Tsvetie
Telerik
I suppose you are using a custom template for the tooltip. In this custom template, you probably have a TextBox and you have bound the Text property of the control to a property of the DataContext. If this is the case, you can use the Binding.FormatString property to apply the format string that you need. You can find the information you need regarding DateTime format strings in MSDN as well.
In case you need additional help, please open a new support ticket and send me the code that you need help with.
Regards,
Tsvetie
Telerik
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
0
Asutosh
Top achievements
Rank 1
Rank 1
answered on 21 Jul 2014, 11:38 AM
i didnt write any code to bind value in tool tip
can u send me demo of my problem?
can u send me demo of my problem?
0
Hi Asutosh,
Please understand that we need to get familiar with your current implementation in order to suggest a proper approach in your particular scenario. Note that there are numerous ways to set that tooltip and we need to know how exactly you have done this in order to provide you with any code. The best way to send us a simple project replicating your real life scenario is to start a new support ticket and attach it there. Please do this in order to allow us to help you out.
Regards,
Pavel R. Pavlov
Telerik
Please understand that we need to get familiar with your current implementation in order to suggest a proper approach in your particular scenario. Note that there are numerous ways to set that tooltip and we need to know how exactly you have done this in order to provide you with any code. The best way to send us a simple project replicating your real life scenario is to start a new support ticket and attach it there. Please do this in order to allow us to help you out.
Regards,
Pavel R. Pavlov
Telerik
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
0
Asutosh
Top achievements
Rank 1
Rank 1
answered on 25 Jul 2014, 07:29 AM
hi
below is my code
i used radgrid and bind sparkline chart in it
.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
foreach (GridDataItem item in tlrkgrid_showfinincedata.MasterTableView.Items)
{
RadHtmlChart chart = item["ChartColumn"].FindControl("FinancialPerformance_Chart") as RadHtmlChart;
SqlDataSource2.SelectParameters[0].DefaultValue = item.GetDataKeyValue("CustomerID").ToString();
chart.DataSource = SqlDataSource2.Select(DataSourceSelectArguments.Empty);
chart.DataBind();
}
}
protected void tlrkgrid_showfinincedata_ItemDataBound(object sender, GridItemEventArgs e)
{
try
{
if (e.Item.ItemType == GridItemType.Item || e.Item.ItemType == GridItemType.AlternatingItem)
{
GridDataItem item = e.Item as GridDataItem;
RadHtmlChart chart = item["ChartColumn"].FindControl("FinancialPerformance_Chart") as RadHtmlChart;
SqlDataSource2.SelectParameters[0].DefaultValue = item.GetDataKeyValue("TIN_LegalBusinessName").ToString();
chart.DataSource = SqlDataSource2.Select(DataSourceSelectArguments.Empty);
if ((chart.DataSource as DataView).Count > 0)
{
chart.DataBind();
}
else
{
chart.Visible = false;
item["ChartColumn"].Controls.Add(new LiteralControl("Record Not Found."));
}
}
}
catch (Exception ex)
{
throw ex;
}
}
.aspx
<telerik:RadGrid ID="tlrkgrid_showfinincedata" runat="server" Width="100%" ShowStatusBar="true"
AutoGenerateColumns="false" PageSize="25" DataSourceID="SqlDataSource1" Height="240"
AllowSorting="True" AllowMultiRowSelection="False" Skin="Silk"
AllowPaging="false" AllowFilteringByColumn="false" PagerStyle-AlwaysVisible="true"
PagerStyle-Mode="NextPrevNumericAndAdvanced" OnItemDataBound="tlrkgrid_showfinincedata_ItemDataBound">
<GroupingSettings CaseSensitive="false" />
<MasterTableView Width="100%" DataKeyNames="ACO_ID,TIN_LegalBusinessName" DataSourceID="SqlDataSource1">
<Columns>
<telerik:GridBoundColumn SortExpression="ACO_ID" HeaderText="Aco" HeaderButtonType="TextButton"
DataField="ACO_ID" FilterControlWidth="65%">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn SortExpression="TIN_LegalBusinessName" HeaderText="Group Name" HeaderButtonType="TextButton"
DataField="TIN_LegalBusinessName" FilterControlWidth="65%" AutoPostBackOnFilter="false">
</telerik:GridBoundColumn>
<telerik:GridTemplateColumn DataField="TIN_LegalBusinessName" HeaderText="Financial Performance" UniqueName="ChartColumn">
<ItemTemplate>
<div>
<telerik:RadHtmlChart ID="FinancialPerformance_Chart" Height="40" runat="server" Layout="Sparkline" Skin="Silk">
<Legend>
<Appearance Visible="false"></Appearance>
</Legend>
<PlotArea>
<CommonTooltipsAppearance Color="White"></CommonTooltipsAppearance>
<Series>
<telerik:AreaSeries Name="AvrMonthly Cost" DataFieldY="AvgMonthlyCost">
<Appearance>
</Appearance>
<LabelsAppearance Position="Above" Visible="false"></LabelsAppearance>
<LineAppearance Width="1"></LineAppearance>
<MarkersAppearance MarkersType="Circle"
BorderWidth="2"></MarkersAppearance>
<TooltipsAppearance Color="White"></TooltipsAppearance>
</telerik:AreaSeries>
<telerik:AreaSeries Name="Avrg Savings" DataFieldY="AvgSavings">
<Appearance>
</Appearance>
<LabelsAppearance Position="Above" Visible="false"></LabelsAppearance>
<LineAppearance Width="1"></LineAppearance>
<MarkersAppearance MarkersType="Circle"
BorderWidth="2"></MarkersAppearance>
<TooltipsAppearance Color="White"></TooltipsAppearance>
</telerik:AreaSeries>
<telerik:AreaSeries Name="Benchmark" DataFieldY="Benchmark">
<Appearance>
</Appearance>
<LabelsAppearance Position="Above" Visible="false">
</LabelsAppearance>
<LineAppearance Width="1">
</LineAppearance>
<MarkersAppearance MarkersType="Circle"
BorderWidth="2"></MarkersAppearance>
<TooltipsAppearance Color="White"></TooltipsAppearance>
</telerik:AreaSeries>
</Series>
<XAxis Visible="false" DataLabelsField="ClaimYearMonth">
<LabelsAppearance Visible="true" RotationAngle="-45" DataFormatString ="{0:}">
<TextStyle Color="black" FontFamily="verdana" Italic="false" FontSize="11" />
</LabelsAppearance>
<MajorGridLines Visible="false" />
<MinorGridLines Visible="false" />
</XAxis>
<YAxis>
<LabelsAppearance DataFormatString="${0}">
<TextStyle Color="black" FontFamily="verdana" Italic="false" FontSize="11" />
</LabelsAppearance>
<TitleAppearance Position="Center" Text="Finance" Visible="false"></TitleAppearance>
<MajorGridLines Visible="false" />
<MinorGridLines Visible="false" />
</YAxis>
</PlotArea>
</telerik:RadHtmlChart>
</div>
</ItemTemplate>
</telerik:GridTemplateColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
below is my code
i used radgrid and bind sparkline chart in it
.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
foreach (GridDataItem item in tlrkgrid_showfinincedata.MasterTableView.Items)
{
RadHtmlChart chart = item["ChartColumn"].FindControl("FinancialPerformance_Chart") as RadHtmlChart;
SqlDataSource2.SelectParameters[0].DefaultValue = item.GetDataKeyValue("CustomerID").ToString();
chart.DataSource = SqlDataSource2.Select(DataSourceSelectArguments.Empty);
chart.DataBind();
}
}
protected void tlrkgrid_showfinincedata_ItemDataBound(object sender, GridItemEventArgs e)
{
try
{
if (e.Item.ItemType == GridItemType.Item || e.Item.ItemType == GridItemType.AlternatingItem)
{
GridDataItem item = e.Item as GridDataItem;
RadHtmlChart chart = item["ChartColumn"].FindControl("FinancialPerformance_Chart") as RadHtmlChart;
SqlDataSource2.SelectParameters[0].DefaultValue = item.GetDataKeyValue("TIN_LegalBusinessName").ToString();
chart.DataSource = SqlDataSource2.Select(DataSourceSelectArguments.Empty);
if ((chart.DataSource as DataView).Count > 0)
{
chart.DataBind();
}
else
{
chart.Visible = false;
item["ChartColumn"].Controls.Add(new LiteralControl("Record Not Found."));
}
}
}
catch (Exception ex)
{
throw ex;
}
}
.aspx
<telerik:RadGrid ID="tlrkgrid_showfinincedata" runat="server" Width="100%" ShowStatusBar="true"
AutoGenerateColumns="false" PageSize="25" DataSourceID="SqlDataSource1" Height="240"
AllowSorting="True" AllowMultiRowSelection="False" Skin="Silk"
AllowPaging="false" AllowFilteringByColumn="false" PagerStyle-AlwaysVisible="true"
PagerStyle-Mode="NextPrevNumericAndAdvanced" OnItemDataBound="tlrkgrid_showfinincedata_ItemDataBound">
<GroupingSettings CaseSensitive="false" />
<MasterTableView Width="100%" DataKeyNames="ACO_ID,TIN_LegalBusinessName" DataSourceID="SqlDataSource1">
<Columns>
<telerik:GridBoundColumn SortExpression="ACO_ID" HeaderText="Aco" HeaderButtonType="TextButton"
DataField="ACO_ID" FilterControlWidth="65%">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn SortExpression="TIN_LegalBusinessName" HeaderText="Group Name" HeaderButtonType="TextButton"
DataField="TIN_LegalBusinessName" FilterControlWidth="65%" AutoPostBackOnFilter="false">
</telerik:GridBoundColumn>
<telerik:GridTemplateColumn DataField="TIN_LegalBusinessName" HeaderText="Financial Performance" UniqueName="ChartColumn">
<ItemTemplate>
<div>
<telerik:RadHtmlChart ID="FinancialPerformance_Chart" Height="40" runat="server" Layout="Sparkline" Skin="Silk">
<Legend>
<Appearance Visible="false"></Appearance>
</Legend>
<PlotArea>
<CommonTooltipsAppearance Color="White"></CommonTooltipsAppearance>
<Series>
<telerik:AreaSeries Name="AvrMonthly Cost" DataFieldY="AvgMonthlyCost">
<Appearance>
</Appearance>
<LabelsAppearance Position="Above" Visible="false"></LabelsAppearance>
<LineAppearance Width="1"></LineAppearance>
<MarkersAppearance MarkersType="Circle"
BorderWidth="2"></MarkersAppearance>
<TooltipsAppearance Color="White"></TooltipsAppearance>
</telerik:AreaSeries>
<telerik:AreaSeries Name="Avrg Savings" DataFieldY="AvgSavings">
<Appearance>
</Appearance>
<LabelsAppearance Position="Above" Visible="false"></LabelsAppearance>
<LineAppearance Width="1"></LineAppearance>
<MarkersAppearance MarkersType="Circle"
BorderWidth="2"></MarkersAppearance>
<TooltipsAppearance Color="White"></TooltipsAppearance>
</telerik:AreaSeries>
<telerik:AreaSeries Name="Benchmark" DataFieldY="Benchmark">
<Appearance>
</Appearance>
<LabelsAppearance Position="Above" Visible="false">
</LabelsAppearance>
<LineAppearance Width="1">
</LineAppearance>
<MarkersAppearance MarkersType="Circle"
BorderWidth="2"></MarkersAppearance>
<TooltipsAppearance Color="White"></TooltipsAppearance>
</telerik:AreaSeries>
</Series>
<XAxis Visible="false" DataLabelsField="ClaimYearMonth">
<LabelsAppearance Visible="true" RotationAngle="-45" DataFormatString ="{0:}">
<TextStyle Color="black" FontFamily="verdana" Italic="false" FontSize="11" />
</LabelsAppearance>
<MajorGridLines Visible="false" />
<MinorGridLines Visible="false" />
</XAxis>
<YAxis>
<LabelsAppearance DataFormatString="${0}">
<TextStyle Color="black" FontFamily="verdana" Italic="false" FontSize="11" />
</LabelsAppearance>
<TitleAppearance Position="Center" Text="Finance" Visible="false"></TitleAppearance>
<MajorGridLines Visible="false" />
<MinorGridLines Visible="false" />
</YAxis>
</PlotArea>
</telerik:RadHtmlChart>
</div>
</ItemTemplate>
</telerik:GridTemplateColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
0
Hi ,
You must use ShareTemplate and then format the category with kendo.format() method like this:
ASPX:
More information on the matter is available in the following set of resources:
Shared Template for ToolTips
You can find the full runnable VS example in the attached archive.
I would also ask you to choose the proper product when you open support tickets/forum posts in future.
Thank you for your cooperation.
Regards,
Danail Vasilev
Telerik
You must use ShareTemplate and then format the category with kendo.format() method like this:
ASPX:
<CommonTooltipsAppearance Color="White"> <SharedTemplate> <div>GDP in #= kendo.format(\'{0:MM/yyyy}\',category) #</div> # for (var i = 0; i < points.length; i++) { # <div>#: points[i].series.name#: #: points[i].value #</div> # } # </SharedTemplate></CommonTooltipsAppearance>More information on the matter is available in the following set of resources:
Shared Template for ToolTips
You can find the full runnable VS example in the attached archive.
I would also ask you to choose the proper product when you open support tickets/forum posts in future.
Thank you for your cooperation.
Regards,
Danail Vasilev
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.