Chart : mouse over series

11 posts, 1 answers
  1. Nicolas Wagener
    Nicolas Wagener avatar
    6 posts
    Member since:
    Nov 2009

    Posted 31 Aug 2010 Link to this post

    Hello,

    I want to have the same animation in my chart that in the Smart Labels exemples.

    I mean, when my mouse is over a series I want to see just the series that I mouse over...
    How do I change the opacity of the other series ?

    Thank You.

    Greetz
    Nicolas.
  2. Answer
    Nikolay
    Admin
    Nikolay avatar
    397 posts

    Posted 02 Sep 2010 Link to this post

    Hi Nicolas Wagener,

    You can achieve this by enabling the chart interactivity effects, here is a sample code snippet demonstrating how to do it :
    BarSeriesDefinition def = new BarSeriesDefinition();
    def.InteractivitySettings.HoverScope = InteractivityScope.Item;

    For more information on this feature, please, have a look at this help topic. You may also refer to our InteractivityEffects example and review the code by clicking on the View Code button.

    Hope this helps.

    Kind regards,
    Nikolay
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Nicolas Wagener
    Nicolas Wagener avatar
    6 posts
    Member since:
    Nov 2009

    Posted 02 Sep 2010 Link to this post

    Tank you :)
  4. Manish Kumar
    Manish  Kumar avatar
    62 posts
    Member since:
    Feb 2010

    Posted 06 Dec 2010 Link to this post

    Hi

    I have a similar requirement but I need to trap the value of AxisY on mouse hover or LeftButtonClicked event.  Is this possible?
    for reference i have attached image document

    Thanks,
    Manish
  5. Nikolay
    Admin
    Nikolay avatar
    397 posts

    Posted 07 Dec 2010 Link to this post

    Hello Manish Kumar,

    Unfortunately it is not possible to show the exact Y value in a tooltip when hovering over any part of the series, the tooltips display the corresponding segment's value from the data source, but has no way of displaying the intermediate values between two individual points from the source.

    For more information on tooltips, please, have a look at this help topic.

    Greetings,
    Nikolay
    the Telerik team
    Browse the videos here>> to help you get started with RadControls for Silverlight
  6. Manish Kumar
    Manish  Kumar avatar
    62 posts
    Member since:
    Feb 2010

    Posted 08 Dec 2010 Link to this post

    Hi

    Thanks for your reply. Just one small query regarding LineSeriesDefinition. Is there any workaround so that I can disable the clicking feature when the mouse hovers on the line between the two points of a line in the chart and is available only when the mouse hovers the points.

    regards
    Manish Kumar
  7. Nikolay
    Admin
    Nikolay avatar
    397 posts

    Posted 09 Dec 2010 Link to this post

    Hello Manish Kumar,

    You may achieve this behavior by setting the line's IsHitTestVisible property to False ( by retemplating the line ). This way you would be able to click only on the point marks.

    Hope this helps.

    All the best,
    Nikolay
    the Telerik team
    Browse the videos here>> to help you get started with RadControls for Silverlight
  8. Manish Kumar
    Manish  Kumar avatar
    62 posts
    Member since:
    Feb 2010

    Posted 09 Dec 2010 Link to this post

    Hi

    Thanks, but may i know how do we retemplate out the line. I tried doing by creating a simple style as below, will this work ? and if yes where i am doing wrong.

    Style

     

    pathStyle1 = new Style(typeof(System.Windows.Shapes.Path));

     

    pathStyle1.Setters.Add(

    new Setter(System.Windows.Shapes.Path.IsHitTestVisibleProperty, "true"));

     

     

    Style lineStyle1 = new Style(typeof(Telerik.Windows.Controls.Charting.LineSeries));

     

    lineStyle1.Setters.Add(

    new Setter(LineSeries.BorderLineStyleProperty, pathStyle1));

     



    thanks
    Manish
  9. Manish Kumar
    Manish  Kumar avatar
    62 posts
    Member since:
    Feb 2010

    Posted 09 Dec 2010 Link to this post

    Hi
     I also created a style as below but some where i am getting javascript error

    Line: 55
    Error: Unhandled Error in Silverlight Application
    Code: 2012   
    Category: ParserError      
    Message: Unknown attribute PointMarkCanvasLeft on element PointMark.    
    File:     
    Line: 3    
    Position: 136    


    may be some dll version mismatch. I am using 2010.2.714.1030. can you please correct my script.

    <Style x:Key="LineStyle" TargetType="charting:Line">

     

     

     

    <Setter Property="Template" > 

     

     

     

    <Setter.Value> 

     

     

     

    <ControlTemplate TargetType="charting:Line"> 

     

     

     

    <Canvas x:Name="PART_CanvasContainer"> 

     

     

     

    <Line x:Name="PART_LineGeometry" StrokeThickness="1" X1="0" 

     

     

    Y1="{TemplateBinding StartPointY}" X2="{TemplateBinding EndPointX}" Y2="{TemplateBinding EndPointY}" 

     

     

    Style="{TemplateBinding ItemStyle}" /> 

     

     

     

    <charting:PointMark x:Name="PART_PointMark" Canvas.Top="{TemplateBinding StartPointY}" 

     

     

    PointMarkCanvasLeft="{TemplateBinding PointMarkCanvasLeft}" PointMarkCanvasTop="{TemplateBinding PointMarkCanvasTop}" 

     

     

    Visibility="{TemplateBinding PointMarkVisibility}" ShapeStyle="{TemplateBinding PointMarkShapeStyle}" 

     

     

    Style="{TemplateBinding PointMarkItemStyle}" /> 

     

     

     

    </Canvas> 

     

     

     

    </ControlTemplate> 

     

     

     

    </Setter.Value> 

     

     

     

    </Setter> 

     

     

     

    </Style>

    regards
    Manish

     

  10. Manish Kumar
    Manish  Kumar avatar
    62 posts
    Member since:
    Feb 2010

    Posted 09 Dec 2010 Link to this post

    Hi

    I guess i have resolved the issue after removing the property from the style script namely 
     PointMarkCanvasLeft="{TemplateBinding PointMarkCanvasLeft}" PointMarkCanvasTop="{TemplateBinding PointMarkCanvasTop}" 
    is that correct ?...

    thanks a lot!!
    Manish

  11. Nikolay
    Admin
    Nikolay avatar
    397 posts

    Posted 11 Dec 2010 Link to this post

    Hi Manish Kumar,

    You can retemplate the line in the following way :
    <Style x:Key="CustomStyle"
                TargetType="telerik:Line">
                <Setter Property="Template" >
                    <Setter.Value>
                        <ControlTemplate TargetType="telerik:Line">
                            <Canvas x:Name="PART_MainContainer">
                                <Line x:Name="PART_LineGeometry"
                                  Fill="Transparent" IsHitTestVisible="False"
                                  Stroke="Transparent"
                                  StrokeThickness="5"
                                  X1="0"
                                  Y1="{TemplateBinding StartPointY}"
                                  X2="{TemplateBinding EndPointX}"
                                  Y2="{TemplateBinding EndPointY}"
                                  Style="{TemplateBinding ItemStyle}" />
                                <telerik:PointMark x:Name="PART_PointMark"
                                                       Canvas.Top="{TemplateBinding StartPointY}"
                                                       PointMarkCanvasLeft="{TemplateBinding PointMarkCanvasLeft}"
                                                       PointMarkCanvasTop="{TemplateBinding PointMarkCanvasTop}"
                                                       Visibility="{TemplateBinding PointMarkVisibility}"
                                                       ShapeStyle="{TemplateBinding PointMarkShapeStyle}" 
                                                       Style="{TemplateBinding PointMarkItemStyle}" />
                            </Canvas>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
     
    Then add the custom style :
    <telerik:RadChart x:Name="RadChart1">
                <telerik:RadChart.SeriesMappings>
                    <telerik:SeriesMapping>
                        <telerik:SeriesMapping.SeriesDefinition>
                            <telerik:LineSeriesDefinition ItemStyle="{StaticResource CustomStyle}"/>
                        </telerik:SeriesMapping.SeriesDefinition>
                        <telerik:ItemMapping DataPointMember="XCategory" FieldName="FieldName1" />
                        <telerik:ItemMapping DataPointMember="YValue" FieldName="FieldName2" />
                    </telerik:SeriesMapping>
                </telerik:RadChart.SeriesMappings>
            </telerik:RadChart>

    Hope this helps.

    Best wishes,
    Nikolay
    the Telerik team
    Browse the videos here>> to help you get started with RadControls for Silverlight
Back to Top