SciChart:将 SciChartLegend 移动到应用程序的单独部分

问题描述 投票:0回答:1

抱歉,如果它看起来像 SciChart 论坛上提出的问题的重复https://www.scichart.com/questions/wpf/move-settings-from-legend-to-separate-menu但我没有找到解决方案尚未。也许我会在这里得到帮助。 我是 SciChart 组件的新手,我使用 SciChart 网站上的示例和教程来制作我的应用程序。但我很久以前就开始使用 C#、WPF 和 MVVM 模式,当我在应用程序中添加 SciChart 时,我使用了 MVVM 教程中的 SciChart 示例。 好吧,让我们进入重点。 当我考虑我的应用程序的 UI 时,我决定最好制作几个带有面板的用户控件,在面板上放置控件。该 UserControls 将放置在 UI 的任何部分,用作模式窗口,将放置在滑动面板等上。 现在我在其中一个 UserControls 上有 SciChartSurface

        <Border Grid.Row="1" Grid.Column="0" Margin="5" Padding="5" BorderBrush="Black" BorderThickness="1,1,1,1" CornerRadius="5">
            <Grid>
                <s:SciChartSurface ChartTitle="{localVM:Localization MainChartSciChartSurface}" RenderableSeries="{s:SeriesBinding RenderableSeries}" Annotations="{s:AnnotationsBinding Annotations}">
                    <s:SciChartSurface.XAxis>
                        <s:NumericAxis AxisTitle="{localVM:Localization XNumericAxis}" VisibleRange="{Binding VisibleRangeXAxis, Mode=TwoWay}" />
                    </s:SciChartSurface.XAxis>
                    <s:SciChartSurface.YAxis>
                        <s:NumericAxis AxisTitle="{localVM:Localization YNumericAxis}" VisibleRange="{Binding VisibleRangeYAxis, Mode=TwoWay}"
                                       AutoRange="{Binding IsStaticYAxis, Converter={StaticResource StaticAxisToSciChartAutoRangeConverter}}" GrowBy="0.1,0.1" />
                    </s:SciChartSurface.YAxis>
                    <s:SciChartSurface.ChartModifier>
                        <s:ModifierGroup>
                            <s:SeriesValueModifier />
                            <s:CursorModifier IsEnabled="{Binding IsShowValuesCursor}" />
                            <s:LegendModifier x:Name="SciChartLegendModifier" LegendData="{Binding LegendData}" GetLegendDataFor="AllSeries" ShowLegend="False" />
                        </s:ModifierGroup>
                    </s:SciChartSurface.ChartModifier>
                </s:SciChartSurface>
            </Grid>
        </Border>

在 ViewModel 中创建的图表系列

        private ObservableCollection<IRenderableSeriesViewModel> _renderableSeries;
        public ObservableCollection<IRenderableSeriesViewModel> RenderableSeries
        {
            get { return _renderableSeries; }
            set
            {
                SetProperty(ref _renderableSeries, value, nameof(RenderableSeries));
            }
        }

        private ObservableCollection<IAnnotationViewModel> _annotations;
        public ObservableCollection<IAnnotationViewModel> Annotations
        {
            get { return _annotations; }
            set
            {
                SetProperty(ref _annotations, value, nameof(Annotations));
            }
        }

        private ChartDataObject _legendData;
        public ChartDataObject LegendData
        {
            get { return _legendData; }
            set
            {
                SetProperty(ref _legendData, value, nameof(LegendData));
            }
        }

        private void InitCharts()
        {
            _renderableSeries = new ObservableCollection<IRenderableSeriesViewModel>();
            _annotations = new ObservableCollection<IAnnotationViewModel>();
            _legendData = new ChartDataObject();

            _lineDataDiameter1 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_DIAMETER_1, LineColor = Colors.OrangeRed, ChartStyle = CHART_LINE_STYLE });
            _lineDataDiameter2 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_DIAMETER_2, LineColor = Colors.BlueViolet, ChartStyle = CHART_LINE_STYLE });
            _lineDataCovering1 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_COVERING_1, LineColor = Colors.LimeGreen, ChartStyle = CHART_LINE_STYLE });
            _lineDataCovering2 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_COVERING_2, LineColor = Colors.DeepSkyBlue, ChartStyle = CHART_LINE_STYLE });
            _lineDataCovering3 = InitChart(new InitChartRequest() { ChartName = CHART_NAME_COVERING_3, LineColor = Colors.White, ChartStyle = CHART_LINE_STYLE });
        }

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

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

            return lineData;
        }

现在我想将 SciChartLegend 放置到另一个 UserControls 中。 SciChart 网站有一个示例 https://www.scichart.com/documentation/win/current/webframe.html#LegendModifier.html 如何分离 SciChartSurface 和 SciChartLegend 但问题是在这个示例中它们被分离但进入一个模块。我在我的应用程序上检查它并且它有效,但正如我之前所说,我需要将 SciChartLegend 放置到另一个 UserControl 并且我们不能使用这样的绑定

LegendData="{Binding LegendData, ElementName=legendModifier, Mode=OneWay}"

据我了解,这对于 MVVM 来说不是好方法。 之后,我决定使用经典的 MVVM 绑定,并在代码中添加了 ChartDataObject 类型的 LegendData 属性,并将其绑定到 SciChartSurface.ChartModifier.ModifierGroup.LegendModifier.LegendData 和 SciChartLegend.LegendData(您可以在上面和下面的 XAML 代码中看到它)

        <Border DockPanel.Dock="Top" Margin="5" Padding="5" BorderBrush="Black" BorderThickness="1,1,1,1" CornerRadius="5">
            <StackPanel>
                <s:SciChartLegend x:Name="SciChartLegendControl"
                                  s:ThemeManager.Theme="Chrome"
                                  Margin="5,5"
                                  ScrollViewer.HorizontalScrollBarVisibility="Auto"
                                  ScrollViewer.VerticalScrollBarVisibility="Auto"
                                  LegendData="{Binding LegendData}"
                                  ShowVisibilityCheckboxes="True" />
            </StackPanel>
        </Border>

但我不明白如何将 RenderableSeries.DataSeries 数据添加到 LegendData 对象。所有图例示例都没有使用 IRenderableSeriesViewModel 和 LineRenderableSeriesViewModel,而是使用了 IRenderableSeries 和 FastLineRenderableSeries。但我认为这是可能的,因为如果按照示例进行操作(使用图表在一个模块中移动图例),它就可以工作。

我做错了什么?我该如何修复它?看起来不难,但是怎么做呢?

c# wpf mvvm legend scichart
1个回答
© www.soinside.com 2019 - 2024. All rights reserved.