Tooltip with information of other series

4 posts, 1 answers
  1. Filupa
    Filupa avatar
    10 posts
    Member since:
    Nov 2012

    Posted 14 Nov 2012 Link to this post

    Hi everyone

    I have a chart with to line series (Image), with the OnClientSeriesHovered and a JS function I achieve the information of both series show and update on the table aside, but My boss want to put that table in the Tooltip:

    With this code (C#), I achive this Image2:
    series3.TooltipsAppearance.ClientTemplate = "Table on Tooltip
    <table border=\"1\"><tr><td>Year S1</td><td>Value S1</td></tr>
    <tr><td>Year S2</td><td>Value S2</td></tr></table>"

    I try to change something like this:
    <td id="R1">Year S1</td>

    and whith Javascript try to change the value with:
    document.getElementById('R1').innerHTML = "(value)";

    But the "document.getElementById('R1')" return "NULL"

    In the help Page ClientTemplate for Series Labels and Tooltips, explain how to define a Tooltip format, with a DataSource/DataBind option, so I think I may try to use this making two DataTable:
    DT1:  (Value_Series1, Day, Value_Series1, Value_Series_2)
    DT2:  (Value_Series2, Day, Value_Series1, Value_Series_2)

    and in the code put somthing like this:
    Day: #=dataItem.Day#
    <table border=\"1\">
    <tr><td>Year 1</td><td>#=dataItem.Value_Series1#</td></tr>
    <tr><td>Year 2</td><td>#=dataItem.Value_Series2#</td></tr>

    But I don't find the way to binding two DataTables, and if this will work.

    Any advice?, please!
  2. Answer
    Marin Bratanov
    Marin Bratanov avatar
    3562 posts

    Posted 15 Nov 2012 Link to this post


    You cannot bind the chart to multiple datatables, so the additional columns should exist in the main one that you set as a datasource for the chart. For you convenience I am attaching a simple example of this here.

    Marin Bratanov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. DevCraft R3 2016 release webinar banner
  4. Filupa
    Filupa avatar
    10 posts
    Member since:
    Nov 2012

    Posted 15 Nov 2012 Link to this post

    Marin, Thanks, and with that I have this question:
    You use this in the ASPX:
    <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1">
                <telerik:BarSeries DataFieldY="data">

    What I have to do if I need to defined all programmaticaly, for a dynamic page, and In the ASPX only write this:
    <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1">
  5. Filupa
    Filupa avatar
    10 posts
    Member since:
    Nov 2012

    Posted 15 Nov 2012 Link to this post

    I SOLVE IT!!!!

    ColumnSeries series = new ColumnSeries();
    series.DataFieldY = "data1";  //this is how I conect the Binding with the series (programmaticaly define)
    RadHtmlChart1.PlotArea.Series[0].TooltipsAppearance.ClientTemplate = "..."
Back to Top