直方图将柱状图替换为面积图,优化密集数据显示效果,Y轴刻度自动取整支持 K/M 缩写,X 轴根据数据范围自动设置。

This commit is contained in:
QI Mingxuan
2026-05-21 10:37:28 +08:00
parent ef83a7637a
commit d7c027b732
3 changed files with 131 additions and 20 deletions
@@ -3,39 +3,58 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
xmlns:loc="clr-namespace:XP.Common.Localization.Extensions"
xmlns:local="clr-namespace:XP.Common.Controls.ImageHistogram"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="200" d:DesignWidth="400">
<UserControl.Resources>
<local:FrequencyLabelConverter x:Key="FreqConverter"/>
</UserControl.Resources>
<Grid>
<!-- 图表控件 | Chart control -->
<telerik:RadCartesianChart x:Name="HistogramChart">
<telerik:RadCartesianChart x:Name="HistogramChart" Padding="0">
<!-- 禁用 Telerik 自带的无数据提示 | Disable Telerik built-in empty content -->
<telerik:RadCartesianChart.EmptyContent>
<TextBlock/>
</telerik:RadCartesianChart.EmptyContent>
<!-- X 轴:灰度级别 | X Axis: Gray Level -->
<!-- X 轴:灰度级别(缩小字体,控制刻度数量,K/M 缩写)| X Axis: Gray Level -->
<telerik:RadCartesianChart.HorizontalAxis>
<telerik:LinearAxis x:Name="XAxis"
Minimum="0"
Maximum="255"
Title="灰度级别"/>
MajorStep="64"
FontSize="9">
<telerik:LinearAxis.LabelTemplate>
<DataTemplate>
<TextBlock Text="{Binding Converter={StaticResource FreqConverter}}"/>
</DataTemplate>
</telerik:LinearAxis.LabelTemplate>
</telerik:LinearAxis>
</telerik:RadCartesianChart.HorizontalAxis>
<!-- Y 轴:像素频次(默认线性| Y Axis: Pixel Frequency (default linear) -->
<!-- Y 轴:像素频次(K/M 缩写标签| Y Axis: Pixel Frequency (K/M abbreviation labels) -->
<telerik:RadCartesianChart.VerticalAxis>
<telerik:LinearAxis x:Name="YAxis"
Minimum="0"
Maximum="1"
Title="频次"/>
FontSize="9">
<telerik:LinearAxis.LabelTemplate>
<DataTemplate>
<TextBlock Text="{Binding Converter={StaticResource FreqConverter}}"/>
</DataTemplate>
</telerik:LinearAxis.LabelTemplate>
</telerik:LinearAxis>
</telerik:RadCartesianChart.VerticalAxis>
<!-- 柱状图系列 | Bar Series -->
<!-- 面积图系列(适合密集直方图数据)| Area Series (suitable for dense histogram data) -->
<telerik:RadCartesianChart.Series>
<telerik:BarSeries x:Name="HistogramBarSeries"
ValueBinding="Frequency"
CategoryBinding="GrayLevel"
ShowLabels="False"/>
<telerik:ScatterAreaSeries x:Name="HistogramBarSeries"
XValueBinding="GrayLevel"
YValueBinding="Frequency"
Fill="#7F2196F3"
Stroke="#FF2196F3"
StrokeThickness="1"/>
</telerik:RadCartesianChart.Series>
</telerik:RadCartesianChart>
@@ -44,7 +63,7 @@
Text="{loc:Localization Histogram_NoData}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="14"
FontSize="12"
Foreground="#9E9E9E"
Visibility="Visible"/>
</Grid>