Pre loader

Tag: LegendModifier

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

1 vote
916 views

Hello.
I’d checked examples from your Demo ‘SciChart.Examples.Demo’ and looks like the example “SciChart.Examples.Examples.CreateRealtimeChart.UsingSeriesValueModifier” is applicable for me because I need functionality like this.

But as I understand Legend as LegendModifier component is a part of chart and it ‘know’ about chart data and can manipulate layout of it. In my application I want to have chart settings not in chart layout but in separate part of application. Can I bind chart settings with my custom controls? At start I want to set visibility for chart series which created in code

        private XyDataSeries<double, double> _lineDataDiameter1;
        private XyDataSeries<double, double> _lineDataDiameter2;
        private XyDataSeries<double, double> _lineDataCovering1;
        private XyDataSeries<double, double> _lineDataCovering2;
        private XyDataSeries<double, double> _lineDataCovering3;

private void InitCharts()
    { // TODO names and color maybe make as settings
        _lineDataDiameter1 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_DIAMETER_1, LineColor = Colors.OrangeRed, ChartStyle = CHART_LINE_STYLE, LineThickness = CHART_LINE_THICKNESS });
        _lineDataDiameter2 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_DIAMETER_2, LineColor = Colors.BlueViolet, ChartStyle = CHART_LINE_STYLE, LineThickness = CHART_LINE_THICKNESS });
        _lineDataCovering1 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_COVERING_1, LineColor = Colors.LimeGreen, ChartStyle = CHART_LINE_STYLE, LineThickness = CHART_LINE_THICKNESS });
        _lineDataCovering2 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_COVERING_2, LineColor = Colors.DeepSkyBlue, ChartStyle = CHART_LINE_STYLE, LineThickness = CHART_LINE_THICKNESS });
        _lineDataCovering3 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_COVERING_3, LineColor = Colors.White, ChartStyle = CHART_LINE_STYLE, LineThickness = CHART_LINE_THICKNESS });
    }

    private XyDataSeries<double, double> InitChart(InitChartRequest request)
    {
        XyDataSeries<double, double> lineData = new()
        {
            SeriesName = request.ChartName,
        };

        RenderableSeries.Add(new LineRenderableSeriesViewModel()
        {
            StrokeThickness = request.LineThickness,
            Stroke = request.LineColor,
            DataSeries = lineData,
            StyleKey = request.ChartStyle,
        });

        return lineData;
    }

And additional little question. How can I make CursorModifier visible or not?

            <s:SciChartSurface.ChartModifier>
                <s:ModifierGroup>
                    <s:SeriesValueModifier/>
                    <s:CursorModifier/>
                </s:ModifierGroup>
            </s:SciChartSurface.ChartModifier>

Even if I make it like this

                <s:SciChartSurface.ChartModifier>
                    <s:ModifierGroup>
                        <s:SeriesValueModifier/>
                        <s:CursorModifier Visibility="Hidden"/>
                    </s:ModifierGroup>
                </s:SciChartSurface.ChartModifier>

I see it

1 vote
2k views

Hello,

I’m trying to include a legend modifier for a collection of LineRenderableSeriesViewModel, everything works fine except I’m not able to set the series Name to show in the legend, because this view Model doesn’t have a Name property to set so all I get is the series markers (and visibility checkboxes but don’t really need those), does someone know how to show these names?

I tried extending said ViewModel with a custom one adding a Name property but didn’t work.

Thanks a lot,

Marco

0 votes
0 answers
5k views

Several legends are displayed using LegendModifier.

  1. Using ScrollViewer.VerticalScrollBarVisibility=”Auto”, it was possible to move using mouse scrolling, bar grabbing, etc., but it did not work when the border was dragged in a screen touch environment. Is there a way to drag on a touch monitor?

  2. It is being displayed using Orientation=”Horizontal”, but there is a limit to displaying it on one line due to the large number of legends. What document can I refer to if I want to change it to display as multi-line? I think the MVVM method would be best.

  • Lee Ji Un asked 5 months ago
  • last active 5 months ago
1 vote
2k views

Greetings,
i have three Series in a SciChart.js (Community-Version) Surface.
The Legend i added shows me all three of them and their names and checkboxes do hide or show the series.

Here is my problem: Is there a way to hide one Series (a FastCandlestickRenderableSeries) from the Legend? I only want to show the other two Series (FastLinerenderableSeries).

Somethin like a Parameter “showInLegend: false,”? I did not find something like this in the documentation(https://www.scichart.com/documentation/js/current/typedoc/classes/legendmodifier.html).

Thank you

1 vote
2k views

Hi there,

Wow this library has come along way in ten years. My question is related to interaction between RS and the legend that is rendered by the chartmodifier.

I declare the legend something like this during the initial bootstrapping of the plot view:

        const legend = new LegendModifier({placementDivId: "legend-goes-here", id:"legend"});
        sciChartSurface.chartModifiers.add(legend);

After that, I have a custom interface available for users to change things, which eventually results in visibility or color changes, updating an RS something like this:

        const thisRs = surface.renderableSeries.getById(`${s.fileId}-${s.name}`);
        if (thisRs) {
            thisRs.isVisible = s.isVisible;
            thisRs.stroke = s.visualInfo?.colorCode ?? "#FFFFFF";
        } 

These changes do not appear to be propagated to the legend despite the series on the plot changing. I guess my questions are:

1) What’s the expected behavior/is there something obvious I’m missing about the model?
2) Any suggestions?

It may very well be somewhere lost in my fairly complex React app, but I first wanted to confirm that I’m not missing something in the api.

Thanks!
Dan

1 vote
2k views

Hi,

In the interface IRenderableSeriesViewModel an IncludeLegend property would be helpful (analogous to LegendModifier.IncludeSeriesProperty). Otherwise you have to override the LegendModifier.GetSeriesInfo method and implement the logic yourself.

regard
Tobias

  • Tobias asked 10 months ago
  • last active 10 months ago
1 vote
2k views

I am trying to place a legend outside a Piechart without success. When I create the legend modifier like below everything works as expected:

    let legendModifier = SCIPieChartLegendModifier()
    legendModifier.sourceSeries = renderableSeries
    legendModifier.margins = UIEdgeInsets(top: 17, left: 17, bottom: 17, right: 17)
    legendModifier.position = [.bottom, .centerHorizontal]

However when I try to place it outside like below the app crashes with:
NSInvalidArgumentException’, reason: ‘-[SCIPieSegment seriesName]: unrecognized selector sent to instance 0x281881500

    legend = SCIChartLegend()
    legend.backgroundColor = SCIColor(.red)
    let dataSource = SCISeriesInfoLegendDataSource(legend: legend)
    legendModifier = SCIPieChartLegendModifier(legend: legend, dataSource: dataSource, useAutoPlacement: false)
    legendModifier.sourceSeries = renderableSeries.series
    legendModifier.margins = UIEdgeInsets(top: 17, left: 17, bottom: 17, right: 17)
    legendModifier.position = [.left, .top]

Note: I am using SwiftIUI and add the legend container to the swiftui view wrapped in an UIViewRepresentable

UIViewRepresentable(container: legend.container!)

if i comment out legendModifier.sourceSeries = renderableSeries.series the crash does not appear but the legend does not show.

1 vote
6k views

I have a bunch of series (XyScatterSeries) that I am using to draw different markers (triangle, circle, cross) based on the data. I also have couple line series too in the chart.

The line series should be displayed in the LegendModifier, but not any of the scatter series.

I tried setting “includeSeries” function here but that didn’t work (typescript kept complaining about it but I kept it and while running the app it didn’t hide the series):

return new LegendModifier({
        showCheckboxes: true,
        orientation: ELegendOrientation.Vertical,
        placement: ELegendPlacement.TopRight,
        includeSeries: (series: IRenderableSeries, isIncluded: boolean): void => { return false; },
    });

Then I created my own class “MyLegendModifier” deriving from LegendModifier, but that didn’t do anything either.

class MyLegendModifier extends LegendModifier {
    constructor(options?: ILegendModifierOptions) {
        super(options);
    }

    includeSeries(series: IRenderableSeries, isIncluded: boolean) {
        console.log('includeSeries:', series.id);
        if (series.id.startsWith('BUY:') || series.id.startsWith('SELL:')) {
            isIncluded = false;
        }
        super.includeSeries(series, isIncluded);
    }
}

Any advise please.

3 votes
3k views

Hi,

In my application I am using two charts for represent different values. I am using LegendModifier on the first chart. Is it possible when i uncheck the series on first chart and the same color series on second chart also need to hide from the second chart. Any event callback function available in LegendModifier ?

0 votes
7k views

I am adding a LegendModifier to display legends for my chart as below:

_sciChartSurface.chartModifiers.add(new SciChart.LegendModifier({ showCheckboxes: true }));

My legend currently looks like the below, with very poor legend visibility:

![enter image description here][1]

I want to know how to set this legend to be opaque so that the labels may be seen clearly. What would be event better would be to just have a constant class for my legend collection (perhaps .sciChartLegendsContainer or whatever) so that I can apply my own css styling myself, without having to hack around with javascript.
Thanks

0 votes
7k views

Hi,
I’m experimenting with the LegendModifier and want to control which RenderableSeries are shown via the “LegendItemTemplate” approach. The idea is to add a specific tagging class to the RenderableSeries.DataSeries.Tag and use the content inside the LegendItemTemplate which I define in the Window.Resouces.

The tagging Class:

public class DataSeriesTag
{
    public string LegendText { get; set; }
    public bool ShowLegend { get; set; }
}

The LegendItemTemplate:
<Window.Resources>


<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

            <!--<CheckBox Width="16" Margin="5,0,0,0"
                HorizontalAlignment="Left"
                VerticalAlignment="Center"
                IsChecked="{Binding RenderableSeries.IsVisible, Mode=TwoWay}"
                Visibility="{Binding RenderableSeries.DataSeries.Tag.ShowLegend, Converter={dxmvvm:BooleanToVisibilityConverter}}" />-->

            <s:PointMarker Grid.Column="1" Margin="5,0,0,0" Width="40" Height="10" VerticalAlignment="Center" HorizontalAlignment="Center"
              DataContext="{Binding RenderableSeries}"
              DeferredContent="{Binding LegendMarkerTemplate}"
              Visibility="{Binding ShowSeriesMarkers, RelativeSource={RelativeSource AncestorType=s:SciChartLegend}, Converter={dxmvvm:BooleanToVisibilityConverter}}" />

            <TextBlock Margin="5,0,5,0"
     Grid.Column="2"
     HorizontalAlignment="Left"
     Text="{Binding RenderableSeries.DataSeries.Tag.LegendText}" />

        </Grid>
    </DataTemplate>
</Window.Resources>

As long as I declare the SciChartSurface.ChartModifier in XAML, it works perfect.
The proplem raises when I bind the ModifierGroup to a ViewModel Property and try to build the LegendModifier there. How can I assign the LegendItemTemplate in the ViewModel?:

legendModifier = new LegendModifier(){
            ShowLegend = true,
            ShowVisibilityCheckboxes = false,
            LegendItemTemplate = ??????
        };
        TheModifiers.ChildModifiers.Add(legendModifier);

Kind regards
Martin

0 votes
7k views

I am trying to add a legend to my chart similar to how is done in the LegendChartView.swift code in the sample app. However the legend does not show and I get several NSLayoutConstraints conflicts such as this one:

[LayoutConstraints] Unable to simultaneously satisfy constraints.   Probably at least one of the constraints in the following list is one you don't want.   Try this:       (1) look at each constraint and try to figure out which you don't expect;       (2) find the code that added the unwanted constraint or constraints and fix it.  (
    "<NSLayoutConstraint:0x283528af0 UIButton:0x13c52d840.height == 25   (active)>",
    "<NSLayoutConstraint:0x2835285f0 UIButton:0x13c52d840.bottom == UIView:0x13c545060.bottom - 4   (active)>",
    "<NSLayoutConstraint:0x2835285a0 V:|-(4)-[UIButton:0x13c52d840]   (active, names: '|':UIView:0x13c545060 )>",
    "<NSLayoutConstraint:0x283528b40 'UIIBSystemGenerated' SCIDefaultLegendItem:0x13c543f90.top == UIView:0x13c545060.top   (active)>",
    "<NSLayoutConstraint:0x283528b90 'UIIBSystemGenerated' V:[UIView:0x13c545060]-(0)-|   (active, names: '|':SCIDefaultLegendItem:0x13c543f90 )>",
    "<NSLayoutConstraint:0x283529c20 'UIView-Encapsulated-Layout-Height' SCIDefaultLegendItem:0x13c543f90.height == 0   (active)>" )

Will attempt to recover by breaking constraint  <NSLayoutConstraint:0x283528af0 UIButton:0x13c52d840.height == 25   (active)>

The internal SCIDefaultLegendItems look to keep setting their width and height to 0 which causes conflicts with the underlying UIButton and UILabel components.

Any thoughts on how to get around this? My chart has four series. I have seen the article on drawing the legend outside the chart surface area however I do not want to do that.

Thank you!

  • Brad Taber asked 4 years ago
  • last active 4 years ago
0 votes
0 answers
8k views

When I run the LegendModifier example from tutorial, I just got an error

FATAL EXCEPTION: main
Process: br.cta.ipev.scicharttutorial, PID: 16941
java.lang.NoClassDefFoundError: com.scichart.charting.visuals.legend.SciChartLegend$LegendItemViewHolderAdapter*

ModifierGroup legendModifier = sciChartBuilder.newModifierGroup()
.withLegendModifier().withOrientation(Orientation.HORIZONTAL).withPosition(Gravity.TOP | Gravity.START, 16).build()
.build();
surface.getChartModifiers().add(legendModifier);
0 votes
6k views

Hello, I’m trailing your library right now. I’m wondering how to change the background color of the legend box. The document page for LegendModifier shows coming soon. I don’t see such option in LegendModifier definition in Xcode either. Thanks

  • Haoran Xie asked 5 years ago
  • last active 5 years ago
1 vote
8k views

We’re trying to make multiple legends on the screen, for example, 1 for the left axis and its data series, 1 for the right axis and its data series. I can see it’s possible in the WPF documentation, but in the iOS documentation it says “Coming soon!”. Do we need to wait for a future release of the Xamarin.iOS library or is it possible somehow now?

By the way, I’m not a trial user. We’ve just purchased a license today.

Thanks,
Lazar Nikolov

0 votes
9k views

I am using the LegendModifier to bind my RenderableSeries to my legend.

In my legends Datatemplate, I have a checkbox and a colour picker.

I notice the LegendData object is of ChartDataObjectBase type. I would like to group my data in my legend (eg, with a label), rather than just display the list.

Is this possible, similar to the images attached ?

0 votes
8k views

In Xamarin.IOS when you set the legend to Horizontal and Top it will create a legend at the top then allow you to scroll horizontally to see all your LineSeries. In Xamarin.Android when you have more Series than can originally fit on the screen, the legend malfunctions and takes up the entire screen. Picture will be attached.

0 votes
0 answers
8k views

I have a chart that has Real Time updates. I would like to create a custom legend modifier to display the latest value in the legend as well as other information. Is it possible to do this and if so where can I find an example?

0 votes
10k views

i currently place my custom (templated) legend inside the Scichartsurface (via xaml).

How can I offer the feature to drag the legend with the mouse to any location on the surface? Please note that I also use mouse movements and clicks for several chart modifiers so most likely I would have to check whether the mouse is hovering over the legend when a left mouse click event is raised?

Could you please get me started with some ideas or thoughts as I am not sure how to approach this issue.

Thanks

  • bbmat asked 7 years ago
  • last active 7 years ago
0 votes
10k views

I have a legend modifier and I’m trying to set the max height like this:

<s:LegendModifier ShowLegend="True" Orientation="Vertical" LegendPlacement="Inside"
    ScrollViewer.HorizontalScrollBarVisibility="Auto"
    ScrollViewer.VerticalScrollBarVisibility="Auto"
    MaxHeight="165" />

However the setting has no effect on the max height. Is there somewhere else I need to set this? Thank you.

  • AE Admin asked 7 years ago
  • last active 7 years ago
0 votes
10k views

Hello,

I want to use user’s settings in my application. I’ve created my own window for settings with checkboxes and colorpickers.

I’ve binded my series with settings like that

 <s:SciChartSurface.RenderableSeries>
            <s:FastLineRenderableSeries x:Name="tLineSeries1" StrokeDashArray="7 4" StrokeThickness="3" YAxisId="RightAxis" >
                <s:FastLineRenderableSeries.IsVisible>
                    <Binding Source="{x:Static ProjectProperties:Settings.Default}" Path="Visibility1" />
                </s:FastLineRenderableSeries.IsVisible>
                <s:FastLineRenderableSeries.SeriesColor>
                    <Binding Source="{x:Static ProjectProperties:Settings.Default}" Path="Color1" />
                </s:FastLineRenderableSeries.SeriesColor>
            </s:FastLineRenderableSeries>

Everything is working fine and after restarting the application i get the colors and visibility of series as i want.

The problems starts after turning on ShowVisibilityCheckboxes=”true” in LegendModifier. After that, my settings dont work at all. Is there any way how can i bind checkboxes from the legends with my own created checkboxes or settings? In other words, how can i make them both to work “together”?

1 vote
9k views

Visual Studio 2015

This isn’t a critical issue since it is handled but since it didn’t do this for the old version I thought I’d bring it to your attention. Awesome product BTW.

I just upgraded my .NET 4.0 SciChart 2D application from SciChart version 4.1.1.8645 to 4.2.1.9358.
Now I get the following (handled) exception message in the output window if I use a legend with my chart:

Exception:
System.Windows.Data Warning: 40 : BindingExpression path error: ‘ScrollViewer’ property not found on ‘object’ ”LegendPlaceholder’ (Name=”)’. BindingExpression:Path=ScrollViewer.HorizontalScrollBarVisibility; DataItem=’LegendPlaceholder’ (Name=”); target element is ‘SciChartLegend’ (Name=”); target property is ‘HorizontalScrollBarVisibility’ (type ‘ScrollBarVisibility’)

This XAML the triggers the exception (comment it out and exception goes away):

                        <s:SciChartSurface.ChartModifier>
                            <s:ModifierGroup>
                                <s:LegendModifier ShowLegend="True" />
                            </s:ModifierGroup>
                        </s:SciChartSurface.ChartModifier>

How to reproduce:
– Take the EEG sample with the latest SciChart version (4.2.1.9358)
– Change the target framework to .NET 4.0
– Change the SciChart references to use the SciChart 4.2, net40 DLLs.

I made a test solution for the following combinations:
.NET 4.5 with SciChart 4.2 works
.NET 4.0 with SciChart 4.2 throws exception
.NET 4.0 with SciChart 4.1 works

0 votes
0 answers
9k views

I am working with Wpf on window.

I have defined a legend modifier with a template.

<s:ModifierGroup>
                    <s:LegendModifier
                        ShowLegend="True"
                        Orientation="Horizontal"
                        Margin="20"
                        LegendPlacement="Inside"
                        LegendItemTemplate="{DynamicResource TopDownLegendTemplate}"
                        GetLegendDataFor="AllSeries"
                        ShowVisibilityCheckboxes="True"/>
                </s:ModifierGroup>

Always, when the chart is rendered, the legend is not (see legendOff.PNG)

Most times, after some chart updates (e.g by moving a slider that affects the data displayed), the legend comes back on (see legendOn.PNG)

Always, when the legend is rendered, then it will stay rendered.

A similar code is elsewhere in my project and does not give this problem so I can’t say for sure it is a bug. It certainly is an unexpected behavior.

Another piece of useful information is that my template uses a converter in the xaml code. I have put a breakpoint in this converter and verified the code is not being called (hence nothing is trying to render the legend) when the chart is rendered.

Any idea?

0 votes
11k views

I followed this post http://support.scichart.com/index.php?/Knowledgebase/Article/View/17244/39/tutorial—custom-legend-with-color-picker-and-custom-point-markers for creating a custom Chart Legend and it worked great. One feature of it that I really liked was the checkbox behavior: CheckedChangeZoomExtentsBehaviour.EnableZoomExtentsOnChecked=”True” which zooms the chart to extents everytime you show or hide a series.

This checkbox behavior breaks when I move the Legend outside of the chart, which I accomplished by following this post: https://www.scichart.com/questions/question/moving-legend-outside-sci-chart-plots

How can I keep this checkbox behavior when moving the Legend outside of the Chart area?

Note: if I set ShowLegend=”True” in my s:LegendModifie> tag, the behavior properly works with the legend outside the Chart area, but now I have duplicate legends both inside and outside my chart area with this setting set.

<!-- LEGEND_ITEM_TEMPLATE -->
<DataTemplate x:Key="LegendItemTemplate" DataType="s:SeriesInfo">
            <!-- DataContext is of type SeriesInfo -->
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <!-- Visibility checkbox, bound to SeriesInfo.RenderableSeries.IsVisible -->
                <CheckBox Margin="5,0,0,0"
                    HorizontalAlignment="Left"
                    VerticalAlignment="Center"
                    behaviors:CheckedChangeZoomExtentsBehaviour.EnableZoomExtentsOnChecked="True"
                    Foreground="{StaticResource LegendTextBrush}"
                    IsChecked="{Binding RenderableSeries.IsVisible, Mode=TwoWay}"
                    Visibility="{Binding LegendData.ShowVisibilityCheckboxes, RelativeSource={RelativeSource AncestorType=s:SciChartLegend}, Converter={StaticResource BooleanToVisibilityConverter}}" />

                <s:PointMarker Grid.Column="1" Margin="5,0,0,0" Width="40" Height="10" VerticalAlignment="Center" HorizontalAlignment="Center"
                    DataContext="{Binding RenderableSeries}"
                    DeferredContent="{Binding LegendMarkerTemplate}"
                    Visibility="{Binding ShowSeriesMarkers, RelativeSource={RelativeSource AncestorType=s:SciChartLegend}, Converter={StaticResource BooleanToVisibilityConverter}}" />

                <!-- Series Name, bound to SeriesInfo.SeriesName -->
                <TextBlock Margin="5,0,5,0"
            Grid.Column="2"
            HorizontalAlignment="Left"
            Foreground="{StaticResource LegendTextBrush}"
            Text="{Binding SeriesName}" />
            </Grid>
        </DataTemplate>

<!-- LEGEND MODIFIER -->
    <s:LegendModifier x:Name="ChartLegend" ShowLegend="True" GetLegendDataFor="AllSeries" LegendItemTemplate="{StaticResource LegendItemTemplate}" ShowVisibilityCheckboxes="True"   />

<!-- MY LEGEND CONTROL ELSEWHERE ON THE PAGE -->
<s:SciChartLegend x:Name="legendControl" DockPanel.Dock="Top"
                                       Orientation="Horizontal" Margin="10"


                                       ScrollViewer.HorizontalScrollBarVisibility="Auto"
                                       ScrollViewer.VerticalScrollBarVisibility="Auto"
                                       LegendData="{Binding LegendData, ElementName=ChartLegend, Mode=OneWay}"
                                       ShowVisibilityCheckboxes="True" />           
0 votes
17k views

Hello,
I would like to allow user click on Legend and highlight the corresponding Series on the chart but I don’t know if this feature is supported or not.

I tried to add mouse events to the Legend Modified but it seems like mouse events are not triggered

This is the simple code that I am using

<s:LegendModifier x:Name="chlLegend" ShowLegend="True" LegendPlacement="Top" Orientation="Horizontal" MouseDown="chlLegend_MouseDown" ScrollViewer.HorizontalScrollBarVisibility="Auto" />

Before investigating more I would like to ask you if you have any hints which is the correct way to implement this behavior.
Is the LegendModifier suitable for this or should I override instead the Legend Control Template?

Thank you in advance for the support

1 vote
17k views

Hi,

I have a chart showing data sets composed of multiple renderable series. Each data set is displayed using one FastLineRenderableSeries and three XyScatterRenderableSeries. All four series show in the legend for each data set, but I would only like to show the FastLineRenderableSeries in the legend for each data set. How can I do this?

I’ve seen the legendModifier.GetLegendDataFor property, but that can only be set to show options from this enum

public enum SourceMode
{
    AllSeries = 0,
    AllVisibleSeries = 1,
    SelectedSeries = 2,
    UnselectedSeries = 3,
}

which aren’t what I need. Some kind of flag on the renderable series saying whether they should be shown in the legend, or some way to specify the items source for the legend would be good.

Thanks!

1 vote
16k views

How can I only show Legends when the corresponding RenederableSeries is visible.
If the corresponding RenderableSeries is not visible then that Legend shouldn’t be shown.
Keep in mind my users will be able to hide and show RenderableSeries during runtime.

My xaml code is:

                                            <s:LegendModifier x:Name="legendModifier" ShowVisibilityCheckboxes="False" Orientation="Vertical" ShowLegend="{Binding ParentViewModel.ShowLegends, Mode=TwoWay}" Margin="10" />
                                        <s:SeriesSelectionModifier>
                                            <s:SeriesSelectionModifier.SelectedSeriesStyle>
                                                <Style TargetType="s:BaseRenderableSeries">
                                                    <Setter Property="StrokeThickness" Value="3"/>
                                                </Style>
                                            </s:SeriesSelectionModifier.SelectedSeriesStyle>
                                        </s:SeriesSelectionModifier>
1 vote
15k views

I have a chart with multiple dataseries, with each dataseries having annotations on top (like in the Trade Markers example). I have a legend which already shows or hides dataseries using a checkbox, but how can I make this checkbox also show or hide the annotations for that dataseries? Can I hook an event when this checkbox is triggered, or when the dataseries visibility changes?

1 vote
14k views

I am stuck and do not seem to be able to make the legend become visible. I use a SciChartGroup and Datatemplate (MainChartView) as follows:

<UserControl x:Class="SciChartSample.Views.MainChartView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:s="http://schemas.abtsoftware.co.uk/scichart"
         xmlns:resources="clr-namespace:SciChartSample.Resources"
         xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
         xmlns:mvvm="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras"
         mc:Ignorable="d" 
         d:DesignHeight="400" d:DesignWidth="600"
         DataContext="{Binding MainChartViewModel, Source={StaticResource Locator}}">

<i:Interaction.Triggers>
    <i:EventTrigger EventName="SizeChanged">
        <mvvm:EventToCommand 
            Command="{Binding UserControlResizedCommand, Mode=OneWay}"
            EventArgsConverterParameter="{Binding ElementName=LayoutRoot}"
            PassEventArgsToCommand="True" />
    </i:EventTrigger>
</i:Interaction.Triggers>

<UserControl.Resources>

    <!-- This allows setting the Height of a pane from a viewmodel -->
    <Style x:Key="ChartPaneStyle" TargetType="s:SciChartGroupPane">
        <Setter Property="Height" Value="{Binding PaneViewModel.Height, Mode=TwoWay}"/>
    </Style>

    <!-- A number of converters which change parameters of charts based on the IsFirstChartPane property -->
    <resources:BoolToValueConverter x:Key="MinorsPerMajorConverter" TrueValue="4" FalseValue="2"/>
    <resources:BoolToValueConverter x:Key="MaxAutoTicksConverter" TrueValue="8" FalseValue="4"/>
    <resources:BoolToValueConverter x:Key="GrowByConverter" >
    <resources:BoolToValueConverter.TrueValue>
        <s:DoubleRange Min="0.05" Max="0.05"/>
    </resources:BoolToValueConverter.TrueValue>
    <resources:BoolToValueConverter.FalseValue>
        <s:DoubleRange Min="0.02" Max="0.02"/>
    </resources:BoolToValueConverter.FalseValue>
    </resources:BoolToValueConverter>
    <resources:IsModifierTypeConverter x:Key="IsModifierTypeConverter" />

</UserControl.Resources>

<Grid>

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <!-- Databinds a SciChartGroup to a list of ChartPaneViewModels -->
    <!-- Child chart panes are generated using the ItemTemplate below -->
    <s:SciChartGroup Grid.Row="1" 
                     ItemsSource="{Binding ChartPaneViewModels}"
                     s:ThemeManager.Theme="{Binding ElementName=ThemeCombo, Path=SelectedItem}"
                     ItemContainerStyle="{StaticResource ChartPaneStyle}">

        <s:SciChartGroup.ItemTemplate>

            <DataTemplate>

                <s:SciStockChart Padding="0" 
                                 BorderThickness="0,0,1,1"
                                 ChartTitle="{Binding Title}"  
                                 IsXAxisVisible="{Binding IsFirstChartPane}"     
                                 IsPanEnabled="{Binding ParentViewModel.IsPanEnabled}"
                                 IsRubberBandZoomEnabled="{Binding ParentViewModel.IsZoomEnabled}"  
                                 VerticalChartGroupId="{Binding ParentViewModel.VerticalChartGroupId}"                                     
                                 SeriesSource="{Binding ChartSeriesViewModels}">

                    <s:SciStockChart.XAxisStyle>
                        <Style TargetType="s:CategoryDateTimeAxis">
                            <Setter Property="LabelProvider" Value="{Binding XAxisFormatting}"/>
                            <Setter Property="DrawMajorBands" Value="False"/>
                            <Setter Property="DrawMinorGridLines" Value="False"/>
                            <Setter Property="VisibleRange" Value="{Binding ParentViewModel.XVisibleRange, Mode=TwoWay}"/>
                            <Setter Property="GrowBy" Value="0, 0.02"/>

                        </Style>
                    </s:SciStockChart.XAxisStyle>

                    <s:SciStockChart.YAxisStyle>
                        <Style TargetType="s:NumericAxis">
                            <Setter Property="TextFormatting" Value="{Binding YAxisTextFormatting}"/>
                            <Setter Property="AutoRange" Value="Always"/>
                            <Setter Property="MinorsPerMajor" Value="{Binding IsFirstChartPane, Converter={StaticResource MinorsPerMajorConverter}}"/>
                            <Setter Property="MaxAutoTicks" Value="{Binding IsFirstChartPane, Converter={StaticResource MaxAutoTicksConverter}}"/>
                            <Setter Property="GrowBy" Value="{Binding IsFirstChartPane, Converter={StaticResource GrowByConverter}}"/>
                        </Style>
                    </s:SciStockChart.YAxisStyle>

                </s:SciStockChart>

            </DataTemplate>
        </s:SciChartGroup.ItemTemplate>
    </s:SciChartGroup>

    <StackPanel Grid.Row="0"
                Margin="2,4"
                Orientation="Horizontal">

        <ToggleButton Margin="2"
                      Command="{Binding PanModeCommand}"
                      s:ToggleButtonExtensions.GroupName="Modifiers"
                      IsChecked="True">
            <StackPanel Orientation="Horizontal" Width="47">

                <TextBlock Margin="3" Text="Pan" />
            </StackPanel>
        </ToggleButton>

        <ToggleButton Margin="2"
                      Command="{Binding ZoomModeCommand}"
                      s:ToggleButtonExtensions.GroupName="Modifiers">
            <StackPanel Orientation="Horizontal">

                <TextBlock Margin="3" Text="Zoom" />
            </StackPanel>
        </ToggleButton>

        <Button Margin="2" Command="{Binding ElementName=priceChart, Path=ZoomExtentsCommand}">
            <StackPanel Orientation="Horizontal">

                <TextBlock Margin="3" Text="Zoom Extents" />
            </StackPanel>
        </Button>

    </StackPanel>

    <Button Margin="259,4,261,6">
        <Button Content="LoadData" Height="30" Width="80" Command="{Binding LoadDataCommand}" CommandParameter="UserC"/>
    </Button>


</Grid>

My ChartView looks as follows:

<UserControl x:Class="SciChartSample.Views.ChartView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:visuals="clr-namespace:Abt.Controls.SciChart.Visuals;assembly=Abt.Controls.SciChart.Wpf"
         xmlns:sciChart3="clr-namespace:Abt.Controls.SciChart;assembly=Abt.Controls.SciChart.Wpf"
         xmlns:renderableSeries3="clr-namespace:Abt.Controls.SciChart.Visuals.RenderableSeries;assembly=Abt.Controls.SciChart.Wpf"
         xmlns:pointMarkers="clr-namespace:Abt.Controls.SciChart.Visuals.PointMarkers;assembly=Abt.Controls.SciChart.Wpf"
         xmlns:axes3="clr-namespace:Abt.Controls.SciChart.Visuals.Axes;assembly=Abt.Controls.SciChart.Wpf"
         xmlns:chartModifiers3="clr-namespace:Abt.Controls.SciChart.ChartModifiers;assembly=Abt.Controls.SciChart.Wpf"

         d:DesignHeight="577"
         d:DesignWidth="735"
         mc:Ignorable="d"
         DataContext="{Binding ChartViewModel, Source={StaticResource Locator}}">

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="368*"/>
        <ColumnDefinition Width="367*"/>
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="32"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>

    <!-- Define Toolbar -->
    <StackPanel Grid.Row="0" Orientation="Horizontal" Grid.ColumnSpan="2">
        <ToggleButton Content="Zoom" Margin="3"
                      IsChecked="{Binding ZoomEnabled, Mode=TwoWay}"/>
        <ToggleButton Content="Pan" Margin="3"
                      IsChecked="{Binding PanEnabled, Mode=TwoWay}"/>
        <ToggleButton Content="MouseWheel" Margin="3"
                      IsChecked="{Binding MouseWheelEnabled, Mode=TwoWay}"/>
        <ToggleButton Content="Rollover" Margin="3"
                      IsChecked="{Binding RolloverEnabled, Mode=TwoWay}"/>
        <ToggleButton Content="Cursor" Margin="3"
                      IsChecked="{Binding CursorEnabled, Mode=TwoWay}" />
    </StackPanel>

    <visuals:SciChartSurface x:Name="MainChart" Grid.Row="1" sciChart3:ThemeManager.Theme="Chrome" Padding="30" Grid.RowSpan="2" Grid.ColumnSpan="2">

        <visuals:SciChartSurface.RenderableSeries>

            <renderableSeries3:FastLineRenderableSeries SeriesColor="DarkBlue" DataSeries="{Binding ChartData}">
                <renderableSeries3:FastLineRenderableSeries.PointMarker>
                    <pointMarkers:EllipsePointMarker Width="7" Height="7" Stroke="DarkBlue" Fill="DarkBlue" StrokeThickness="1"/>
                </renderableSeries3:FastLineRenderableSeries.PointMarker>
            </renderableSeries3:FastLineRenderableSeries>

        </visuals:SciChartSurface.RenderableSeries>

        <visuals:SciChartSurface.XAxis>
            <axes3:DateTimeAxis
                SubDayTextFormatting="dd/MM/yyyy HH:mm:ss.fff"
                VisibleRange="{Binding ChartData.XValues, Mode=OneWay}"
                GrowBy="0.1,0.1">
            </axes3:DateTimeAxis>
        </visuals:SciChartSurface.XAxis>

        <visuals:SciChartSurface.YAxis>
            <axes3:NumericAxis 
                VisibleRange="{Binding ChartData.YValues, Mode=OneWay}"
                GrowBy="0.1,0.1">
            </axes3:NumericAxis>
        </visuals:SciChartSurface.YAxis>

        <visuals:SciChartSurface.ChartModifier>
            <chartModifiers3:ModifierGroup>
                <chartModifiers3:RubberBandXyZoomModifier IsEnabled="{Binding ZoomEnabled, Mode=TwoWay}" IsXAxisOnly="True"></chartModifiers3:RubberBandXyZoomModifier>
                <chartModifiers3:ZoomPanModifier IsEnabled="{Binding PanEnabled, Mode=TwoWay}"></chartModifiers3:ZoomPanModifier>
                <chartModifiers3:MouseWheelZoomModifier IsEnabled="{Binding MouseWheelEnabled, Mode=TwoWay}"></chartModifiers3:MouseWheelZoomModifier>
                <chartModifiers3:RolloverModifier IsEnabled="{Binding RolloverEnabled, Mode=TwoWay}"></chartModifiers3:RolloverModifier>
                <chartModifiers3:CursorModifier IsEnabled="{Binding CursorEnabled, Mode=TwoWay}"  ShowTooltip="True" ShowTooltipOn="Always"  ></chartModifiers3:CursorModifier>
                <chartModifiers3:LegendModifier x:Name="legendSource" ShowLegend="True" Visibility="Visible" GetLegendDataFor="AllSeries"/>
            </chartModifiers3:ModifierGroup>
        </visuals:SciChartSurface.ChartModifier>

    </visuals:SciChartSurface>

    <visuals:SciChartLegend LegendData="{Binding LegendData, ElementName=legendSource, Mode=OneWay}"/>

</Grid>

Please note that I included a legendModifier in the ChartView and also defined a ChartLegend in same. But the legend is not visible at all. What am I doing wrong? Thanks

  • bbmat asked 9 years ago
  • last active 9 years ago
1 vote
14k views

I am dynamically adding and removing items from an observablecollection of Irenderable series in my viewmodel, and binding it to the renderableseries on the chart surface. However, when I add and remove items that I want to be ordered, and are appropriately ordered in the collection, they are not ordered on the legend.

Is there a way to reorder the series in the legend (MVVM solution would be great)?

You can replicate the issue (or the symptom), by toggling the visibilty of the series in the below example by clicking the checkbox within the legend and then switching the getlegenddatafrom to visible series, and then switch back. (no longer in ABC order).

https://www.scichart.com/Abt.Controls.SciChart.SL.ExampleTestPage.html#/Abt.Controls.SciChart.Example;component/Examples/IWantTo/CreateMultiseriesChart/MultipleLinesView.xaml

Thanks,
Jason

  • morseja asked 9 years ago
  • last active 3 months ago
1 vote
21k views

how can i apply styling for legend in legend modifier? i want to apply the following style

<Style x:Key="LegendStyle" TargetType="s:LegendModifier">
        <Setter Property="ContentTemplate">
            <Setter.Value>        
                <DataTemplate>
            <s:SciChartLegend  x:Name="legendControl"  Margin="2,2" Orientation="Horizontal"  Background="Transparent" BorderThickness="0" ScrollViewer.VerticalScrollBarVisibility="Auto"
                                Visibility="{Binding IsLegendVisible,Converter={StaticResource  BoolToVisibilityConverter}}" 
                                LegendData="{Binding LegendData,  ElementName=legendModifier,Mode=OneWay}">

                <s:SciChartLegend.Resources>
                    <SciChart:ColorToBrushConverter x:Key="ColorToBrushConverter"/>
                </s:SciChartLegend.Resources>
                <s:SciChartLegend.ItemTemplate>
                    <DataTemplate DataType="SciChart:XyzSeriesInfo">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>
                            <Rectangle Grid.Column="0"
                                                VerticalAlignment="Center"
                                                Stretch="Fill"
                                                Width="10"

                                                StrokeThickness="10"
                                                Stroke="{Binding SeriesColor,
                                                Converter={StaticResource ColorToBrushConverter}}" />
                            <TextBlock Grid.Column="1" Foreground="Black" 
                                                Margin="2,0,15,0"
                                                HorizontalAlignment="Center"
                                                Text="{Binding SeriesName}" FontWeight="Normal"/>
                        </Grid>
                    </DataTemplate>
                </s:SciChartLegend.ItemTemplate>
            </s:SciChartLegend>
        </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>
  • Raghupathy asked 9 years ago
  • last active 9 years ago
1 vote
17k views

I have a case where there can be hundreds or even thousands of potential series on the surface.
When I use the LegendModifier, I only see the first 20 or so series.
What would it take to display a scrollbar so that the user can see all available series?
Thanks!

  • dwoerner asked 9 years ago
  • last active 9 years ago
Showing 32 results

Try SciChart Today

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

Start TrialCase Studies