Pre loader

Draggable Legend

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

0
0

hi,
Can I make a LegendModifier draggable?
so that I can drag it anywhere in the scichart surface?

Thanks in advance.
Vibin

Version
latest
  • You must to post comments
1
0

Not official response, but here what I would do…

The Legend API allows you to place a legend anywhere in an application, and bind it to the Legend Modifier (see the section Alternatively – Binding LegendModifier.LegendData to SciChartLegend at this link). Additionally, you can create a Custom Annotation to layout any control onto your surface… See where I am going?

After a little bit of trial and error, this works pretty well (I will describe the remaining issue below):

<s:SciChartSurface.ChartModifier>
    <s:ModifierGroup>
        <s:LegendModifier x:Name="legendModifier" GetLegendDataFor="AllSeries"  ShowLegend="False"/>
    </s:ModifierGroup>
</s:SciChartSurface.ChartModifier>

<s:SciChartSurface.Annotations>
    <s:CustomAnnotation X1="0" Y1="0" CoordinateMode="Relative" IsEditable="True">
        <Border BorderThickness="3" BorderBrush="LightGray">
            <s:SciChartLegend x:Name="legendControl"
                ScrollViewer.HorizontalScrollBarVisibility="Auto"
                ScrollViewer.VerticalScrollBarVisibility="Auto"
                LegendData="{Binding LegendData, ElementName=legendModifier, Mode=OneWay}"
                ShowVisibilityCheckboxes="false"   IsHitTestVisible="False"  />
        </Border>
    </s:CustomAnnotation>
</s:SciChartSurface.Annotations>

There is one caveat to this working perfectly… The legend seems to handle mouse events, and can’t be dragged itself. So, if the legend fills the annotation, you can’t drag it anywhere, even though the mouse pointer changes to the cross indicating movement. So, I added a border around it, and turned off mouse events on the legend (IsHitTestVisible=false), and now you can only drag when pointer indicates you can drag. But…

The checkboxes are not clickable now. If you don’t have a need for checkboxes to show/hide specific series, this is perfect. If you have that need, I would need Andrew to chime in with a solution here. I tried templating the Legend Items (see “Templating the Legend Item Rows” here), and setting IsHitTestVisible=True on just the checkbox, but it seems that once it is false on a control, all children are false as well (verified here).

Anyway, hopefully this gives you an idea. I also made a resizeable version using the BoxAnnotation, but this answer is already pretty long, and you can see in this link the general idea.

Good Luck,
Mike.

Images
  • Andrew Burnett-Thompson
    Aww michael! You are are forum-hero and I now feel sorry for wasting your efforts!
  • You must to post comments
0
0

Hi Vibin,

The Legend is just an ItemsControl, so if you can answer the question ‘how to make an ItemsControl’ draggable then you can do this with SciChart.

To find out how to detach the legend from the chart (have a separate, or custom legend control bound to SciChart), please see our documentation:

LegendModifier Documentation

Alternatively – Binding LegendModifier.LegendData to SciChartLegend

You can alternatively bind LegendModifier.LegendData to a SciChartLegend and place anywhere in your application. You can also bind to an LegendModifier.LegendData to an ItemsControl.ItemsSource and template it as you wish.

<s:SciChartSurface x:Name="sciChart" s:ThemeManager.Theme="Chrome">

    <!-- XAxis, YAxis, Omitted for brevity -->

    <!--  Declare ChartModifiers  -->
    <s:SciChartSurface.ChartModifier>
        <s:ModifierGroup>
            <s:LegendModifier x:Name="legendModifier" GetLegendDataFor="AllSeries"  ShowLegend="False"/>
        </s:ModifierGroup>
    </s:SciChartSurface.ChartModifier>

</s:SciChartSurface>

<!-- Somewhere else in your application, you can declare a SciChartLegend and bind to LegendModifier.LegendData -->
<s:SciChartLegend x:Name="legendControl"
   s:ThemeManager.Theme="Chrome"
   Margin="23,23"
   ScrollViewer.HorizontalScrollBarVisibility="Auto"
   ScrollViewer.VerticalScrollBarVisibility="Auto"
   LegendData="{Binding LegendData, ElementName=legendModifier, Mode=OneWay}"
   ShowVisibilityCheckboxes="True" />
  • Michael Dusoe
    I figured after 5 days, I wouldn’t have collided with you Andrew, but I guess it is still possible! Only 2 minutes apart!
  • You must to post comments
Showing 2 results
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies