RadHTMLChart ordering of Line series over Column Series

9 posts, 1 answers
  1. V
    V avatar
    4 posts
    Member since:
    Mar 2016

    Posted 18 Mar Link to this post

    I have a radhtmlchart with dynamic line series and column series and server side binding of series.My chart is not showing values of line charts if line chart is on column  chart.
  2. Stamo Gochev
    Admin
    Stamo Gochev avatar
    157 posts

    Posted 22 Mar Link to this post

    Hi Baljeet,

    Can you send me an example that reproduces the issue, so I can investigate it?

    As you are using server-side data binding, I suggest you to replace your actual data with some hard-coded values, so that the sample page is fully runnable on my end.

    Regards,
    Stamo Gochev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. V
    V avatar
    4 posts
    Member since:
    Mar 2016

    Posted 23 Mar in reply to Stamo Gochev Link to this post

    Hi Stamo Gochev,

    I am giving source code of my demo application of my chart. Can u suggest me the solution with tooltip of line series over column series.

    Aspx Page Source Code:

    <telerik:RadHtmlChart runat="server" ID="ucBPViewProfile" Legend-Appearance-Position="Top"
                              PlotArea-XAxis-Step="1" PlotArea-XAxis-TitleAppearance-TextStyle-Bold="true"
                              ChartTitle-Appearance-TextStyle-Bold="true" ChartTitle-Appearance-Align="Center"
                              PlotArea-YAxis-TitleAppearance-TextStyle-Bold="true"
                              ChartTitle-Appearance-TextStyle-FontSize="8.5pt" BackColor="Transparent" Legend-Appearance-BackgroundColor="Transparent"
                              Legend-Appearance-TextStyle-FontFamily="Arial" Legend-Appearance-TextStyle-FontSize="8.5pt"
                              Legend-Appearance-TextStyle-Bold="true" ChartTitle-Appearance-TextStyle-FontFamily="Arial"
                              PlotArea-XAxis-TitleAppearance-TextStyle-FontFamily="Arial" PlotArea-XAxis-TitleAppearance-TextStyle-FontSize="8.5pt"
                              PlotArea-YAxis-TitleAppearance-TextStyle-FontFamily="Arial" PlotArea-YAxis-TitleAppearance-TextStyle-FontSize="8.5pt"
                              PlotArea-XAxis-LabelsAppearance-TextStyle-FontSize="8.5pt" PlotArea-YAxis-LabelsAppearance-TextStyle-FontSize="8.5pt"
                              PlotArea-XAxis-LabelsAppearance-TextStyle-FontFamily="Arial" PlotArea-YAxis-LabelsAppearance-TextStyle-FontFamily="Arial">
                              <ChartTitle Text="Bid Price View (O&D)">
                              </ChartTitle>
                              <PlotArea>
                                  <XAxis AxisCrossingValue="0" Reversed="false" StartAngle="1" MinorTickType="None"
                                      BaseUnit="Auto" MajorTickType="None">
                                      <LabelsAppearance RotationAngle="0" Skip="0" Step="1">
                                      </LabelsAppearance>
                                      <TitleAppearance Text="">
                                      </TitleAppearance>
                                      <Items>
                                      </Items>
                                      <MajorGridLines Visible="false" />
                                      <MinorGridLines Visible="false" />
                                  </XAxis>
                                  <YAxis AxisCrossingValue="0" Reversed="false">
                                      <LabelsAppearance DataFormatString="{0}" RotationAngle="0" Skip="0" Step="1">
                                      </LabelsAppearance>
                                      <TitleAppearance Text="" Position="Center" RotationAngle="-90">
                                      </TitleAppearance>
                                      <MinorGridLines Visible="false" />
                                  </YAxis>
                              </PlotArea>
                          </telerik:RadHtmlChart>

     

    .cs Code

    private void BindChart()
           {
               try
               {
     
                   ucBPViewProfile.Visible = true;
                       ucBPViewProfile.PlotArea.Series.Clear();
                       ucBPViewProfile.PlotArea.XAxis.Items.Clear();
                       ucBPViewProfile.ChartTitle.Text = "Chart";
                        
                           // UserSession OUser = (UserSession)HttpContext.Current.Session["User"];
                           DataTable dt = new DataTable();
                            
                           string[] chartHeaderNames = { "A", "D" };
                           string[] selectedValues = { "A", "D" };
                           int len = selectedValues.Length;
                           Array.Resize(ref selectedValues, len + 1);
                           selectedValues[len] = "A";
                            
                            
                           foreach (var names_Head in chartHeaderNames)
                           {
                               if (selectedValues.Contains(names_Head))
                               {
                                   LineSeries theoreticalData = new LineSeries();
                                   ColumnSeries theoreticalCol = new ColumnSeries();
     
                                   if (names_Head == "D")
                                   {
                                       ucBPViewProfile.PlotArea.Series.Add(theoreticalCol);
                                       theoreticalCol.LabelsAppearance.Visible = false;
                                       theoreticalCol.Spacing = 0;
                                       theoreticalCol.Name = names_Head;
                                   }
                                   else
                                   {
                                       ucBPViewProfile.PlotArea.Series.Add(theoreticalData);
                                       theoreticalData.LabelsAppearance.Visible = false;
                                       theoreticalData.Name = names_Head;
                                   }
     
                                   int i = 1;
                                   int ii = 2;
                                   int dataEnd = 3;
                                   for (int Times = 0; Times < 5;Times++ )
                                   {
                                       AxisItem axisitem = new AxisItem();
     
                                       for (int dataTimes=ii; dataTimes < dataEnd; dataTimes = dataTimes + 2)
                                       {
                                            
                                               switch (names_Head)
                                               {
                                                   case "A": theoreticalData.Items.Add(Convert.ToDecimal(dataTimes));
                                                       break;
                                                   case "D": theoreticalCol.Items.Add(Convert.ToDecimal(dataTimes+2));
                                                       break;
                                                   default:
                                                       break;
                                               }
     
                                       }
                                       ii=ii+1;
                                       dataEnd = dataEnd + 1;
                                       if (ucBPViewProfile.PlotArea.XAxis.MaxValue <= 0 || ucBPViewProfile.PlotArea.XAxis.MaxValue == null)
                                       {
                                           if (ucBPViewProfile.PlotArea.XAxis.Items.Count < 5)
                                           {
                                               axisitem.LabelText = Convert.ToString(i);
                                               ucBPViewProfile.PlotArea.XAxis.Items.Add(axisitem);
                                           }
                                       }
                                       if (i == 5)
                                           break;
                                       i = i + 1;
                                   }
     
                               }
                           }
     
                       ucBPViewProfile.Visible = true;
                    
               }
               catch (Exception ex)
               {
                   ucBPViewProfile.Visible = true;
               }
           }

    Regards,
    V

  5. Stamo Gochev
    Admin
    Stamo Gochev avatar
    157 posts

    Posted 25 Mar Link to this post

    Hello,

    I tried to reproduce the issue using the provided code by modifying some configurations to make it runnable, but to no avail. I cannot be sure when the BindChart() method should be called and if there are other dependencies that might be connected with the scenario in some way.

    This is the reason why I created a sample page with Column and Line series that you can find as an attached file. As both their tooltips are shown as expected, can you modify this page, so that the issue can be demonstrated?

    It will be very helpful if you can try to isolate the case without adding the custom logic that is currently available in the BindChart() method as this will not result in a simpler example.

    I want to also point out that I checked your account subscriptions and as there are no purchases there, you should know that you can try our free trial by downloading it on the following address:

    https://www.telerik.com/download-trial-file/v2/ui-for-asp.net-ajax

    Our support policy states that this will give you the right to send us support tickets regarding technical questions about our products and get a response withing a fixed time limit.

    Regards,
    Stamo Gochev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  6. V
    V avatar
    4 posts
    Member since:
    Mar 2016

    Posted 28 Mar in reply to Stamo Gochev Link to this post

    Hello,

    Can you please provide me the solution for these type of values.

    <telerik:RadHtmlChart runat="server" ID="ChartWithColumnAndLineSeries" Width="500px" Height="400px">
                   <ChartTitle Text="Chart with Line and Column series">
                   </ChartTitle>
                   <PlotArea>
                       <Series>
                           <telerik:ColumnSeries>
                               <SeriesItems>
                                   <telerik:CategorySeriesItem Y="12" />
                                   <telerik:CategorySeriesItem Y="34" />
                                   <telerik:CategorySeriesItem Y="20" />
                                   <telerik:CategorySeriesItem Y="40" />
                                   <telerik:CategorySeriesItem Y="5" />
                               </SeriesItems>
                               <TooltipsAppearance Color="White" />
                           </telerik:ColumnSeries>
                           <telerik:LineSeries>
                               <SeriesItems>
                                   <telerik:CategorySeriesItem Y="45" />
                                   <telerik:CategorySeriesItem Y="23" />
                                   <telerik:CategorySeriesItem Y="12" />
                                   <telerik:CategorySeriesItem Y="54" />
                                   <telerik:CategorySeriesItem Y="71" />
                               </SeriesItems>
                               <TooltipsAppearance Color="White" />
                           </telerik:LineSeries>
                       </Series>
                   </PlotArea>
                   <Legend>
                       <Appearance Visible="false" />
                   </Legend>
               </telerik:RadHtmlChart>
    Regards,
    V

  7. Stamo Gochev
    Admin
    Stamo Gochev avatar
    157 posts

    Posted 31 Mar Link to this post

    Hello,

    I have tested the provided code snippet and both the tooltips and the values of the series are shown as expected.

    Can you elaborate more on the exact problem that you are facing as I suppose that it is no longer connected with the tooltips?

    Regards,
    Stamo Gochev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  8. V
    V avatar
    4 posts
    Member since:
    Mar 2016

    Posted 01 Apr in reply to Stamo Gochev Link to this post

    Hello,

    The problem is that whenever I hovered on circle connected with yellow line which has the value marked as 12 in third column (as marked in image attached earlier), I get the value in tooltip as 20 which is of column chart and not of line chart. Can I get value 12 on hover of line series also in middle of that column.

    Regards,
    V

  9. Stamo Gochev
    Admin
    Stamo Gochev avatar
    157 posts

    Posted 06 Apr Link to this post

    Hello,

    As I have already mentioned, the example that I provided works as expected. The tooltip of the line series is shown when you hover the exact marker of its series item (the circle) and this can be seen in the attached screenshot.

    I want to mention that I am testing with the latest version of our product (2016.1.225). Since I see that you have downloaded a free trial, you should be able to test the scenario as well.

    Regards,
    Stamo Gochev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  10. Answer
    Stamo Gochev
    Admin
    Stamo Gochev avatar
    157 posts

    Posted 06 Apr Link to this post

    Hello,

    As I have already mentioned, the example that I provided works as expected. The tooltip of the line series is shown when you hover the exact marker of its series item (the circle) and this can be seen in the attached screenshot.

    I want to mention that I am testing with the latest version of our product (2016.1.225). Since I see that you have downloaded a free trial, you should be able to test the scenario as well.

    Regards,
    Stamo Gochev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017