如何WPF工具包图表区和绘图区之间消除空间？工具包、图表、空间、WPF

2023-09-03 01:54:22 作者：深陷荒岛

我使用chartingToolKit：图表控件。我想删除空白出现在图表和绘图区之间。连着WPF的样品和区域的图像被删除。

 ＆LT;窗口x：类=WpfApplication2.MainWindow
    的xmlns =http://schemas.microsoft.com/winfx/2006/xaml/$p$psentation
    的xmlns：X =http://schemas.microsoft.com/winfx/2006/xaml
    标题=主窗口高度=350宽度=525 xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit">


＆LT;电网＆GT;
    ＆LT; chartingToolkit：图表X：名称=图WIDTH =500高度=300保证金=0，0，0，0LegendStyle ={的StaticResource LegendStyle}＆GT;


        ＆LT; chartingToolkit：中AreaSeries的ItemsSource ={结合}

                                   DependentValuePath =值

                                   IndependentValuePath =关键

                                   背景=红

                                    ＆GT;


        ＆LT; / chartingToolkit：中AreaSeries＆GT;

        ＆LT; chartingToolkit：Chart.Axes＆GT;
            ＆LT; chartingToolkit：LinearAxis在方向=XShowGridLines =FALSE能见度=隐藏＆GT;

            ＆LT; / chartingToolkit：LinearAxis在＆GT;
            ＆LT; chartingToolkit：LinearAxis在方向=YShowGridLines =FALSE能见度=隐藏/＆GT;
        ＆LT; / chartingToolkit：Chart.Axes＆GT;

    ＆LT; / chartingToolkit：图表＆GT;
＆LT; /网格＆GT;

标记为红色箭头的区域必须被删除

解决方案

为了实现这一点，你需要重新模板的图表。标准图表模板如下：

 ＆LT;的ControlTemplate的TargetType =图表：图表＆GT;
                ＆LT; BORDER背景={TemplateBinding背景}BorderBrush ={TemplateBinding BorderBrush}了borderThickness ={TemplateBinding了borderThickness}填充={TemplateBinding填充}＆GT;
                    ＆LT;电网＆GT;
                        ＆LT; Grid.RowDefinitions＆GT;
                            ＆LT; RowDefinition高度=自动/＆GT;
                            ＆LT; RowDefinition身高=*/＆GT;
                        ＆LT; /Grid.RowDefinitions>

                        ＆LT; datavis：标题内容={TemplateBinding标题}风格={TemplateBinding TitleStyle}/＆GT;

                        ＆LT;！ - 使用嵌套网格，以避免可能出现削波的行为从ColumnSpan +宽=自动生成的 - ＆GT;
                        ＆所述;电网Grid.Row =1保证金=0,15,0,15＆GT;
                            ＆LT; Grid.ColumnDefinitions＆GT;
                                ＆所述; ColumnDefinition宽度=*/＆GT;
                                ＆LT; ColumnDefinition宽度=自动/＆GT;
                            ＆LT; /Grid.ColumnDefinitions>

                            ＆LT; datavis：【注】X：名称=传奇标题={TemplateBinding LegendTitle}风格={TemplateBinding LegendStyle}Grid.Column =1/＆GT;
                            ＆LT; chartingprimitives：EdgePanel X：名称=ChartArea风格={TemplateBinding ChartAreaStyle}＆GT;
                                ＆LT;电网Canvas.ZIndex = -  1样式={TemplateBinding PlotAreaStyle}/＆GT;
                                ＆所述;边框Canvas.ZIndex =10BorderBrush =＃FF919191了borderThickness =1/＆GT;
                            ＆LT; / chartingprimitives：EdgePanel＆GT;
                        ＆LT; /网格＆GT;
                    ＆LT; /网格＆GT;
                ＆LT; /边框＆GT;
            ＆LT; /控件模板＆GT;

这详述了绘图区，标题，图例等的位置......它也包含绘图区一个硬codeD保证金，所以你不能达到你是什么后，通过简单的样式表。如果你只是想图表区域，没有别的，你可以简化图表模板如下：

xmlns:chartingprimitives="clr-namespace:System.Windows.Controls.DataVisualization.Charting.Primitives;assembly=System.Windows.Controls.DataVisualization.Toolkit" ＆LT;电网＆GT; ＆LT; chartingToolkit：图表X：名称=图WIDTH =500高度=300 余量=0，0，0，0填充=0＆GT; ＆LT; chartingToolkit：中AreaSeries的ItemsSource ={结合} DependentValuePath =值 IndependentValuePath =关键背景=红＆GT; ＆LT; / chartingToolkit：中AreaSeries＆GT; ＆LT; chartingToolkit：Chart.Axes＆GT; ＆所述; chartingToolkit：LinearAxis在角度=XShowGridLines =假高度=0＆GT; ＆LT; / chartingToolkit：LinearAxis在＆GT; ＆LT; chartingToolkit：LinearAxis在方向=YShowGridLines =FALSEWIDTH =0/＆GT; ＆LT; / chartingToolkit：Chart.Axes＆GT; ＆LT; chartingToolkit：Chart.Template＆GT; ＆LT;的ControlTemplate的TargetType =chartingToolkit：图表＆GT; ＆LT; BORDER背景={TemplateBinding背景} BorderBrush ={TemplateBinding BorderBrush} 了borderThickness ={TemplateBinding了borderThickness} 填充={TemplateBinding填充}＆GT; ＆LT;电网＆GT; ＆LT; chartingprimitives：EdgePanel X：名称=ChartArea风格={TemplateBinding ChartAreaStyle}＆GT; ＆LT;电网Canvas.ZIndex = - 1样式={TemplateBinding PlotAreaStyle}/＆GT; ＆所述;边框Canvas.ZIndex =10BorderBrush =＃FF919191了borderThickness =1/＆GT; ＆LT; / chartingprimitives：EdgePanel＆GT; ＆LT; /网格＆GT; ＆LT; /边框＆GT; ＆LT; /控件模板＆GT; ＆LT; / chartingToolkit：Chart.Template＆GT; ＆LT; / chartingToolkit：图表＆GT; ＆LT; /网格＆GT;

这将删除您所看到的填充。

I am using chartingToolKit:Chart control. I want to remove the white space appear in between the chart and plot area. Attached the WPF sample and image of area to be removed.

<Window x:Class="WpfApplication2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525" xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit">


<Grid>
    <chartingToolkit:Chart x:Name="chart" Width="500" Height="300" Margin="0, 0, 0, 0"   LegendStyle="{StaticResource LegendStyle}"   >


        <chartingToolkit:AreaSeries ItemsSource="{Binding}"  

                                   DependentValuePath="Value"

                                   IndependentValuePath="Key"

                                   Background="Red"

                                    >


        </chartingToolkit:AreaSeries>

        <chartingToolkit:Chart.Axes>
            <chartingToolkit:LinearAxis Orientation="X" ShowGridLines="False" Visibility="Hidden">

            </chartingToolkit:LinearAxis>
            <chartingToolkit:LinearAxis Orientation="Y" ShowGridLines="False" Visibility="Hidden"/>
        </chartingToolkit:Chart.Axes>

    </chartingToolkit:Chart>
</Grid>

The area marked in red arrow must be removed

解决方案

In order to achieve this you need to re-template the chart. The standard chart template is as follows:

            <ControlTemplate TargetType="charting:Chart">
                <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>

                        <datavis:Title Content="{TemplateBinding Title}" Style="{TemplateBinding TitleStyle}" />

                        <!-- Use a nested Grid to avoid possible clipping behavior resulting from ColumnSpan+Width=Auto -->
                        <Grid Grid.Row="1" Margin="0,15,0,15">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>

                            <datavis:Legend x:Name="Legend" Title="{TemplateBinding LegendTitle}" Style="{TemplateBinding LegendStyle}" Grid.Column="1" />
                            <chartingprimitives:EdgePanel x:Name="ChartArea" Style="{TemplateBinding ChartAreaStyle}">
                                <Grid Canvas.ZIndex="-1" Style="{TemplateBinding PlotAreaStyle}" />
                                <Border Canvas.ZIndex="10" BorderBrush="#FF919191" BorderThickness="1" />
                            </chartingprimitives:EdgePanel>
                        </Grid>
                    </Grid>
                </Border>
            </ControlTemplate>

This details the location of the plot area, title, legend etc... It also included a hard-coded margin around the plot area, so you cannot achieve what you are after by simply styling the chart. If you just want a chart area and nothing else, you can simplify the chart template as follows:

xmlns:chartingprimitives="clr-namespace:System.Windows.Controls.DataVisualization.Charting.Primitives;assembly=System.Windows.Controls.DataVisualization.Toolkit"

<Grid>
  <chartingToolkit:Chart x:Name="chart" Width="500" Height="300"
                         Margin="0, 0, 0, 0" Padding="0">
    <chartingToolkit:AreaSeries ItemsSource="{Binding}"  
                                  DependentValuePath="Value"
                                  IndependentValuePath="Key"
                                  Background="Red">
    </chartingToolkit:AreaSeries>
    <chartingToolkit:Chart.Axes>
      <chartingToolkit:LinearAxis Orientation="X" ShowGridLines="False" Height="0">
      </chartingToolkit:LinearAxis>
      <chartingToolkit:LinearAxis Orientation="Y" ShowGridLines="False" Width="0"/>
    </chartingToolkit:Chart.Axes>
    <chartingToolkit:Chart.Template>
      <ControlTemplate TargetType="chartingToolkit:Chart">
        <Border Background="{TemplateBinding Background}"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"
                Padding="{TemplateBinding Padding}">
          <Grid>
            <chartingprimitives:EdgePanel x:Name="ChartArea" Style="{TemplateBinding ChartAreaStyle}">
              <Grid Canvas.ZIndex="-1" Style="{TemplateBinding PlotAreaStyle}" />
              <Border Canvas.ZIndex="10" BorderBrush="#FF919191" BorderThickness="1" />
            </chartingprimitives:EdgePanel>
          </Grid>
        </Border>
      </ControlTemplate>
    </chartingToolkit:Chart.Template>
  </chartingToolkit:Chart>
</Grid>

This will remove the padding that you are seeing.

上一篇：是什么原因导致在WPF应用程序的InvalidDeploymentException？应用程序、WPF、InvalidDeploymentException

下一篇：WMI：RPC服务器不可用。（从HRESULT异常：0x800706BA）抛出时，尝试连接到远程计算机连接到、抛出、不可用、异常

相关推荐

精彩图集

精彩推荐

图片推荐

肝肠寸断的典故：源于猿猴追船救子_追到肠