目录
[1 运行效果](#1 运行效果)
[2 目录](#2 目录)
[3 源码](#3 源码)
1 运行效果
2 目录
WPF .NET Framework 4.7.2
3 源码
MainWindow.xaml.cs
cs
using System;
using System.Collections.Generic;
using System.Timers;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace IndustrialMonitor
{
public partial class MainWindow : Window
{
private Timer updateTimer;
private Timer realtimeTimer;
private Random random;
private DateTime lastDoubleClickTime = DateTime.MinValue;
// 数据
private List<int> lineData = new List<int> { 120, 280, 190, 350, 260, 410, 330, 480 };
private List<int> barData = new List<int> { 480, 390, 380, 320, 260, 290 };
private int deviceUsage = 83;
private int capacityRate = 92;
private int energyRate = 76;
public MainWindow()
{
InitializeComponent();
random = new Random();
// 等待窗口加载完成后绘制
this.Loaded += (s, e) =>
{
DrawAllCharts();
};
// 监听窗口大小变化
this.SizeChanged += (s, e) =>
{
DrawAllCharts();
};
// 初始化定时器
updateTimer = new Timer(3000);
updateTimer.Elapsed += UpdateData;
updateTimer.Start();
realtimeTimer = new Timer(1000);
realtimeTimer.Elapsed += SimulateRealTimeData;
realtimeTimer.Start();
// 启动时间更新
StartTimeUpdate();
}
private void StartTimeUpdate()
{
var timer = new Timer(1000);
timer.Elapsed += (s, e) =>
{
Dispatcher.Invoke(() =>
{
TimeText.Text = DateTime.Now.ToString("HH:mm:ss");
StatusText.Text = $"⚡ 数据实时更新中 | 最后更新: {DateTime.Now.ToString("HH:mm:ss")}";
});
};
timer.Start();
}
// ========== 窗口控制 ==========
private void TitleBar_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
if ((DateTime.Now - lastDoubleClickTime).TotalMilliseconds < 500)
{
if (this.WindowState == WindowState.Maximized)
this.WindowState = WindowState.Normal;
else
this.WindowState = WindowState.Maximized;
}
else
{
if (e.ButtonState == MouseButtonState.Pressed)
{
this.DragMove();
}
}
lastDoubleClickTime = DateTime.Now;
}
private void TitleBar_MouseEnter(object sender, MouseEventArgs e) { }
private void CloseButton_Click(object sender, RoutedEventArgs e)
{
Application.Current.Shutdown();
}
private void MinimizeButton_Click(object sender, RoutedEventArgs e)
{
this.WindowState = WindowState.Minimized;
}
private void MaximizeButton_Click(object sender, RoutedEventArgs e)
{
if (this.WindowState == WindowState.Maximized)
{
this.WindowState = WindowState.Normal;
MaximizeButton.Content = "□";
MaximizeButton.ToolTip = "最大化";
}
else
{
this.WindowState = WindowState.Maximized;
MaximizeButton.Content = "❐";
MaximizeButton.ToolTip = "还原";
}
}
protected override void OnStateChanged(EventArgs e)
{
base.OnStateChanged(e);
if (MaximizeButton != null)
{
if (this.WindowState == WindowState.Maximized)
{
MaximizeButton.Content = "❐";
MaximizeButton.ToolTip = "还原";
}
else
{
MaximizeButton.Content = "□";
MaximizeButton.ToolTip = "最大化";
}
}
}
protected override void OnKeyDown(KeyEventArgs e)
{
if (e.Key == Key.Escape && this.WindowState == WindowState.Maximized)
{
this.WindowState = WindowState.Normal;
}
base.OnKeyDown(e);
}
// ========== 数据更新 ==========
private void UpdateData(object sender, ElapsedEventArgs e)
{
Dispatcher.Invoke(() =>
{
// 更新折线图
int newValue = random.Next(100, 500);
lineData.Add(newValue);
if (lineData.Count > 8) lineData.RemoveAt(0);
// 更新直方图
for (int i = 0; i < barData.Count; i++)
{
int change = random.Next(-20, 21);
barData[i] = Math.Max(100, Math.Min(550, barData[i] + change));
}
// 更新环形图
deviceUsage = Math.Max(70, Math.Min(98, deviceUsage + random.Next(-5, 6)));
capacityRate = Math.Max(80, Math.Min(99, capacityRate + random.Next(-3, 4)));
energyRate = Math.Max(65, Math.Min(95, energyRate + random.Next(-4, 5)));
// 更新UI
//RingText1.Text = $"{deviceUsage}%";
//RingText2.Text = $"{capacityRate}%";
//RingText3.Text = $"{energyRate}%";
DrawAllCharts();
});
}
private void SimulateRealTimeData(object sender, ElapsedEventArgs e)
{
Dispatcher.Invoke(() =>
{
if (lineData.Count > 0)
{
int lastValue = lineData[lineData.Count - 1];
int adjustment = random.Next(-15, 16);
lineData[lineData.Count - 1] = Math.Max(80, Math.Min(550, lastValue + adjustment));
}
deviceUsage = Math.Max(70, Math.Min(98, deviceUsage + random.Next(-2, 3)));
capacityRate = Math.Max(80, Math.Min(99, capacityRate + random.Next(-1, 2)));
energyRate = Math.Max(65, Math.Min(95, energyRate + random.Next(-2, 3)));
//RingText1.Text = $"{deviceUsage}%";
//RingText2.Text = $"{capacityRate}%";
//RingText3.Text = $"{energyRate}%";
DrawLineChart();
DrawRingCharts();
});
}
private void DrawAllCharts()
{
DrawLineChart();
DrawBarChart();
DrawRingCharts();
}
// ========== 折线图 ==========
private void DrawLineChart()
{
// 获取实际尺寸，如果为0则使用默认值
double width = LineChartCanvas.ActualWidth;
double height = LineChartCanvas.ActualHeight;
if (width <= 0) width = 700;
if (height <= 0) height = 280;
LineChartCanvas.Children.Clear();
if (lineData.Count == 0) return;
double maxY = 550;
double step = width / (lineData.Count - 1);
// 绘制网格线
for (int i = 0; i <= 5; i++)
{
double y = height / 5 * i;
var gridLine = new Line
{
X1 = 0,
Y1 = y,
X2 = width,
Y2 = y,
Stroke = new SolidColorBrush(Color.FromRgb(42, 74, 107)),
StrokeThickness = 0.8
};
LineChartCanvas.Children.Add(gridLine);
var label = new TextBlock
{
Text = $"{maxY - i * (maxY / 5):F0}",
Foreground = new SolidColorBrush(Color.FromRgb(107, 140, 192)),
FontSize = 12,
FontFamily = new FontFamily("Microsoft YaHei")
};
Canvas.SetLeft(label, -30);
Canvas.SetTop(label, y - 8);
LineChartCanvas.Children.Add(label);
}
// X轴标签
string[] xLabels = { "08:00", "10:00", "12:00", "14:00", "16:00", "18:00", "20:00", "22:00" };
for (int i = 0; i < lineData.Count && i < xLabels.Length; i++)
{
var label = new TextBlock
{
Text = xLabels[i],
Foreground = new SolidColorBrush(Color.FromRgb(107, 140, 192)),
FontSize = 12
};
Canvas.SetLeft(label, step * i - 15);
Canvas.SetTop(label, height + 5);
LineChartCanvas.Children.Add(label);
}
// 收集点
PointCollection points = new PointCollection();
for (int i = 0; i < lineData.Count; i++)
{
double x = step * i;
double y = height - (lineData[i] / maxY) * height;
points.Add(new Point(x, y));
}
// 渐变填充区域
PathGeometry fillGeometry = new PathGeometry();
PathFigure fillFigure = new PathFigure();
fillFigure.StartPoint = new Point(0, height);
fillFigure.Segments.Add(new LineSegment(points[0], true));
for (int i = 1; i < points.Count; i++)
{
fillFigure.Segments.Add(new LineSegment(points[i], true));
}
fillFigure.Segments.Add(new LineSegment(new Point(width, height), true));
fillGeometry.Figures.Add(fillFigure);
var fillPath = new Path
{
Data = fillGeometry,
Fill = new LinearGradientBrush
{
StartPoint = new Point(0, 0),
EndPoint = new Point(0, 1),
GradientStops = new GradientStopCollection
{
new GradientStop(Color.FromArgb(102, 77, 159, 255), 0),
new GradientStop(Color.FromArgb(13, 77, 159, 255), 1)
}
}
};
LineChartCanvas.Children.Add(fillPath);
// 折线
Polyline polyline = new Polyline
{
Points = points,
Stroke = new SolidColorBrush(Color.FromRgb(77, 159, 255)),
StrokeThickness = 3,
StrokeLineJoin = PenLineJoin.Round
};
polyline.Effect = new System.Windows.Media.Effects.DropShadowEffect
{
Color = Color.FromRgb(77, 159, 255),
BlurRadius = 8
};
LineChartCanvas.Children.Add(polyline);
// 数据点和标签
for (int i = 0; i < points.Count; i++)
{
var point = points[i];
// 外光晕
var outerCircle = new Ellipse
{
Width = 20,
Height = 20,
Fill = new SolidColorBrush(Color.FromArgb(77, 77, 159, 255))
};
Canvas.SetLeft(outerCircle, point.X - 10);
Canvas.SetTop(outerCircle, point.Y - 10);
LineChartCanvas.Children.Add(outerCircle);
// 内圆点
var innerCircle = new Ellipse
{
Width = 12,
Height = 12,
Fill = new SolidColorBrush(Color.FromRgb(77, 159, 255))
};
Canvas.SetLeft(innerCircle, point.X - 6);
Canvas.SetTop(innerCircle, point.Y - 6);
LineChartCanvas.Children.Add(innerCircle);
// 核心点
var coreCircle = new Ellipse
{
Width = 6,
Height = 6,
Fill = Brushes.White
};
Canvas.SetLeft(coreCircle, point.X - 3);
Canvas.SetTop(coreCircle, point.Y - 3);
LineChartCanvas.Children.Add(coreCircle);
// 数值标签
var valueBorder = new Border
{
Background = new SolidColorBrush(Color.FromRgb(26, 35, 80)),
BorderBrush = new SolidColorBrush(Color.FromRgb(77, 159, 255)),
BorderThickness = new Thickness(1),
CornerRadius = new CornerRadius(6),
Child = new TextBlock
{
Text = lineData[i].ToString(),
Foreground = new SolidColorBrush(Color.FromRgb(0, 255, 255)),
FontSize = 12,
FontWeight = FontWeights.Bold,
Padding = new Thickness(8, 4, 8, 4)
}
};
Canvas.SetLeft(valueBorder, point.X - 25);
Canvas.SetTop(valueBorder, point.Y - 40);
LineChartCanvas.Children.Add(valueBorder);
}
}
// ========== 直方图 ==========
private void DrawBarChart()
{
double width = BarChartCanvas.ActualWidth;
double height = BarChartCanvas.ActualHeight;
if (width <= 0) width = 650;
if (height <= 0) height = 280;
BarChartCanvas.Children.Clear();
if (barData.Count == 0) return;
double barWidth = 75;
double gap = 28;
double startX = (width - (barWidth * barData.Count + gap * (barData.Count - 1))) / 2;
Color[] colors = {
Color.FromRgb(77, 159, 255), // 车间A - 蓝色
Color.FromRgb(54, 211, 153), // 车间B - 绿色
Color.FromRgb(251, 189, 35), // 车间C - 黄色
Color.FromRgb(248, 114, 114), // 车间D - 红色
Color.FromRgb(167, 139, 250), // 车间E - 紫色
Color.FromRgb(34, 211, 238) // 车间F - 青色
};
string[] labels = { "车间A", "车间B", "车间C", "车间D", "车间E", "车间F" };
for (int i = 0; i < barData.Count && i < colors.Length; i++)
{
double barHeight = (barData[i] / 550.0) * height;
double x = startX + i * (barWidth + gap);
double y = height - barHeight;
// 渐变柱子
var rect = new Rectangle
{
Width = barWidth,
Height = barHeight,
Fill = new LinearGradientBrush
{
StartPoint = new Point(0, 0),
EndPoint = new Point(0, 1),
GradientStops = new GradientStopCollection
{
new GradientStop(colors[i], 0),
new GradientStop(Color.FromRgb(
(byte)(colors[i].R * 0.7),
(byte)(colors[i].G * 0.7),
(byte)(colors[i].B * 0.7)), 1)
}
},
RadiusX = 4,
RadiusY = 4
};
Canvas.SetLeft(rect, x);
Canvas.SetTop(rect, y);
BarChartCanvas.Children.Add(rect);
// 顶部高光
var highlight = new Rectangle
{
Width = barWidth,
Height = 3,
Fill = new SolidColorBrush(Color.FromArgb(77, 255, 255, 255))
};
Canvas.SetLeft(highlight, x);
Canvas.SetTop(highlight, y);
BarChartCanvas.Children.Add(highlight);
// 数值标签
var valueText = new TextBlock
{
Text = barData[i].ToString(),
Foreground = Brushes.White,
FontSize = 14,
FontWeight = FontWeights.Bold,
HorizontalAlignment = HorizontalAlignment.Center
};
Canvas.SetLeft(valueText, x + barWidth / 2 - 15);
Canvas.SetTop(valueText, y - 20);
BarChartCanvas.Children.Add(valueText);
// X轴标签
var labelText = new TextBlock
{
Text = labels[i],
Foreground = new SolidColorBrush(Color.FromRgb(192, 216, 255)),
FontSize = 12,
HorizontalAlignment = HorizontalAlignment.Center
};
Canvas.SetLeft(labelText, x + barWidth / 2 - 20);
Canvas.SetTop(labelText, height + 10);
BarChartCanvas.Children.Add(labelText);
}
}
// ========== 环形图（修复版） ==========
private void DrawRingCharts()
{
DrawRing(RingCanvas1, deviceUsage, Color.FromRgb(77, 159, 255));
DrawRing(RingCanvas2, capacityRate, Color.FromRgb(54, 211, 153));
DrawRing(RingCanvas3, energyRate, Color.FromRgb(251, 189, 35));
}
private void DrawRing(Canvas canvas, int percent, Color color)
{
canvas.Children.Clear();
double cx = 65; // 中心点 X (260/2)
double cy = 65; // 中心点 Y (260/2)
double r = 45; // 半径
double w = 18; // 线宽
// 背景圆环
var backgroundRing = new Ellipse
{
Width = r * 2,
Height = r * 2,
Stroke = new SolidColorBrush(Color.FromRgb(26, 35, 80)),
StrokeThickness = w
};
Canvas.SetLeft(backgroundRing, cx - r);
Canvas.SetBottom(backgroundRing, cy - r);
canvas.Children.Add(backgroundRing);
// 进度圆弧 - 使用 ArcSegment 实现
double angle = percent / 100.0 * 360;
double radians = angle * Math.PI / 180;
// 计算圆弧终点
double startX = cx;
double startY = cy - r;
double endX = cx + r * Math.Sin(radians);
double endY = cy - r * Math.Cos(radians);
bool isLargeArc = angle > 180;
var pathFigure = new PathFigure
{
StartPoint = new Point(cx, cy - r)
};
var arcSegment = new ArcSegment
{
Point = new Point(endX, endY),
Size = new Size(r, r),
SweepDirection = SweepDirection.Clockwise,
IsLargeArc = isLargeArc
};
pathFigure.Segments.Add(arcSegment);
var pathGeometry = new PathGeometry();
pathGeometry.Figures.Add(pathFigure);
var progressRing = new Path
{
Data = pathGeometry,
Stroke = new SolidColorBrush(color),
StrokeThickness = w,
StrokeStartLineCap = PenLineCap.Round,
StrokeEndLineCap = PenLineCap.Round
};
progressRing.Effect = new System.Windows.Media.Effects.DropShadowEffect
{
Color = color,
BlurRadius = 10
};
canvas.Children.Add(progressRing);
// 内圈装饰
var innerRing = new Ellipse
{
Width = (r - 8) * 2,
Height = (r - 8) * 2,
Stroke = new SolidColorBrush(Color.FromArgb(51, color.R, color.G, color.B)),
StrokeThickness = 1
};
Canvas.SetLeft(innerRing, cx - (r - 8));
Canvas.SetBottom(innerRing, cy - (r - 8));
canvas.Children.Add(innerRing);
// 添加百分比文字到圆环中心
var percentText = new TextBlock
{
Text = $"{percent}%",
Foreground = new SolidColorBrush(color),
FontSize = 24,
FontWeight = FontWeights.Bold,
HorizontalAlignment = HorizontalAlignment.Center,
VerticalAlignment = VerticalAlignment.Center
};
Canvas.SetLeft(percentText, cx - 30);
Canvas.SetBottom(percentText, cy - 15);
canvas.Children.Add(percentText);
}
}
}
MainWindow.xaml
XML
<Window x:Class="IndustrialMonitor.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="北京工业生产实时监控大屏"
Width="1920" Height="1080"
WindowStyle="None"
WindowState="Maximized"
AllowsTransparency="True"
Background="Transparent">
<Grid>
<!-- 渐变背景 -->
<Grid.Background>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Offset="0" Color="#FF0A0E1A"/>
<GradientStop Offset="0.5" Color="#FF0F1530"/>
<GradientStop Offset="1" Color="#FF0A0E1A"/>
</LinearGradientBrush>
</Grid.Background>
<!-- 顶部标题栏 -->
<Grid Height="90" VerticalAlignment="Top">
<Border Background="#FF0F1530"
MouseLeftButtonDown="TitleBar_MouseLeftButtonDown"
MouseEnter="TitleBar_MouseEnter">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Offset="0" Color="Transparent"/>
<GradientStop Offset="0.2" Color="#FF4D9FFF"/>
<GradientStop Offset="0.5" Color="#FF00FFFF"/>
<GradientStop Offset="0.8" Color="#FF4D9FFF"/>
<GradientStop Offset="1" Color="Transparent"/>
</LinearGradientBrush>
</Border.BorderBrush>
<Border.BorderThickness>0,0,0,2</Border.BorderThickness>
</Border>
<!-- 顶部光晕 -->
<Border Height="30" VerticalAlignment="Bottom" Opacity="0.15" Background="#FF4D9FFF"/>
<!-- 标题文字 -->
<TextBlock Text="北京工业生产实时监控大屏"
FontSize="36" FontWeight="Bold"
Foreground="White"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontFamily="Microsoft YaHei">
<TextBlock.Effect>
<DropShadowEffect Color="#FF4D9FFF" ShadowDepth="2" BlurRadius="5"/>
</TextBlock.Effect>
</TextBlock>
<!-- 窗口控制按钮区域 -->
<StackPanel Orientation="Horizontal"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Margin="0,0,10,0">
<!-- 最小化按钮 -->
<Button Content="─"
Width="45" Height="45"
Background="Transparent"
BorderThickness="0"
Foreground="#FF6B8CC0"
FontSize="20"
FontWeight="Bold"
Cursor="Hand"
Click="MinimizeButton_Click"
ToolTip="最小化">
<Button.Style>
<Style TargetType="Button">
<Setter Property="Background" Value="Transparent"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="#FFFFFFFF"/>
<Setter Property="Background" Value="#33FFFFFF"/>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
<!-- 最大化/还原按钮 -->
<Button x:Name="MaximizeButton"
Content="□"
Width="45" Height="45"
Background="Transparent"
BorderThickness="0"
Foreground="#FF6B8CC0"
FontSize="20"
FontWeight="Bold"
Cursor="Hand"
Click="MaximizeButton_Click"
ToolTip="最大化">
<Button.Style>
<Style TargetType="Button">
<Setter Property="Background" Value="Transparent"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="#FFFFFFFF"/>
<Setter Property="Background" Value="#33FFFFFF"/>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
<!-- 关闭按钮 -->
<Button Content="✕"
Width="45" Height="45"
Background="Transparent"
BorderThickness="0"
Foreground="#FF6B8CC0"
FontSize="18"
FontWeight="Bold"
Cursor="Hand"
Click="CloseButton_Click"
ToolTip="关闭">
<Button.Style>
<Style TargetType="Button">
<Setter Property="Background" Value="Transparent"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="#FFFF0000"/>
<Setter Property="Background" Value="#33FF0000"/>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
</StackPanel>
<!-- 时间显示框 -->
<Border Width="200" Height="45"
Background="#FF1A2350"
CornerRadius="8"
BorderBrush="#FF00FFFF"
BorderThickness="1"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Margin="100,0,0,0">
<TextBlock x:Name="TimeText"
Text="00:00:00"
Foreground="#FF00FFFF"
FontSize="20"
FontFamily="Consolas"
FontWeight="Bold"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
</Border>
</Grid>
<!-- 左侧：折线图容器 -->
<Border Width="720" Height="420"
Background="#FF0F1530"
CornerRadius="15"
BorderBrush="#FF4D9FFF"
BorderThickness="1"
Margin="40,110,0,0"
HorizontalAlignment="Left"
VerticalAlignment="Top">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!-- 标题栏 -->
<Border Grid.Row="0" Background="#FF1A2350" CornerRadius="15,15,0,0">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Offset="0" Color="Transparent"/>
<GradientStop Offset="0.5" Color="#FF00FFFF"/>
<GradientStop Offset="1" Color="Transparent"/>
</LinearGradientBrush>
</Border.BorderBrush>
<Border.BorderThickness>0,0,0,2</Border.BorderThickness>
<TextBlock Text="产量趋势折线图"
FontSize="22" FontWeight="Bold"
Foreground="#FF00FFFF"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontFamily="Microsoft YaHei"/>
</Border>
<Grid Grid.Row="1" Margin="40,10,40,30">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Text="单位：吨"
FontSize="14"
Foreground="#FF6B8CC0"
HorizontalAlignment="Right"/>
<!-- 折线图画布 -->
<Canvas x:Name="LineChartCanvas" Grid.Row="1"
Background="Transparent"
ClipToBounds="True"/>
</Grid>
</Grid>
</Border>
<!-- 外发光效果 -->
<Border Width="724" Height="424"
CornerRadius="17"
BorderBrush="#FF4D9FFF"
BorderThickness="2"
Opacity="0.3"
Margin="38,108,0,0"
HorizontalAlignment="Left"
VerticalAlignment="Top"
IsHitTestVisible="False"/>
<!-- 右侧：直方图容器 -->
<Border Width="720" Height="420"
Background="#FF0F1530"
CornerRadius="15"
BorderBrush="#FF36D399"
BorderThickness="1"
Margin="0,110,40,0"
HorizontalAlignment="Right"
VerticalAlignment="Top">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Border Grid.Row="0" Background="#FF1A2350" CornerRadius="15,15,0,0">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Offset="0" Color="Transparent"/>
<GradientStop Offset="0.5" Color="#FF36D399"/>
<GradientStop Offset="1" Color="Transparent"/>
</LinearGradientBrush>
</Border.BorderBrush>
<Border.BorderThickness>0,0,0,2</Border.BorderThickness>
<TextBlock Text="车间产能直方图"
FontSize="22" FontWeight="Bold"
Foreground="#FF36D399"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontFamily="Microsoft YaHei"/>
</Border>
<Grid Grid.Row="1" Margin="30,10,30,50">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Text="单位：吨"
FontSize="14"
Foreground="#FF6B8CC0"
HorizontalAlignment="Right"/>
<Canvas x:Name="BarChartCanvas" Grid.Row="1"
Background="Transparent"
ClipToBounds="True"/>
</Grid>
</Grid>
</Border>
<!-- 右侧外发光 -->
<Border Width="724" Height="424"
CornerRadius="17"
BorderBrush="#FF36D399"
BorderThickness="2"
Opacity="0.3"
Margin="0,108,38,0"
HorizontalAlignment="Right"
VerticalAlignment="Top"
IsHitTestVisible="False"/>
<!-- 底部环形图 -->
<StackPanel Orientation="Horizontal"
HorizontalAlignment="Center"
VerticalAlignment="Bottom"
Margin="0,0,0,60">
<!-- 环形图1：设备使用率 -->
<StackPanel Width="280" Margin="0,0,70,0">
<Canvas x:Name="RingCanvas1" Width="130" Height="130"/>
<!--<TextBlock x:Name="RingText1"
Text="83%"
FontSize="48" FontWeight="Bold"
Foreground="#FF4D9FFF"
HorizontalAlignment="Center"
Margin="0,10,0,0"/>-->
<TextBlock Text="设备使用率"
FontSize="22" FontWeight="Bold"
Foreground="#FFC0D8FF"
HorizontalAlignment="Center"
Margin="0,10,0,0"/>
<Rectangle Width="50" Height="2" Fill="#FF4D9FFF"
HorizontalAlignment="Center" Margin="0,10,0,0" Opacity="0.5"/>
</StackPanel>
<!-- 环形图2：产能达标率 -->
<StackPanel Width="280" Margin="0,0,70,0">
<Canvas x:Name="RingCanvas2" Width="130" Height="130"/>
<!--<TextBlock x:Name="RingText2"
Text="92%"
FontSize="48" FontWeight="Bold"
Foreground="#FF36D399"
HorizontalAlignment="Center"
Margin="0,10,0,0"/>-->
<TextBlock Text="产能达标率"
FontSize="22" FontWeight="Bold"
Foreground="#FFC0D8FF"
HorizontalAlignment="Center"
Margin="0,10,0,0"/>
<Rectangle Width="50" Height="2" Fill="#FF36D399"
HorizontalAlignment="Center" Margin="0,10,0,0" Opacity="0.5"/>
</StackPanel>
<!-- 环形图3：能耗优化率 -->
<StackPanel Width="280">
<Canvas x:Name="RingCanvas3" Width="130" Height="130"/>
<!--<TextBlock x:Name="RingText3"
Text="76%"
FontSize="48" FontWeight="Bold"
Foreground="#FFFBBD23"
HorizontalAlignment="Center"
Margin="0,10,0,0"/>-->
<TextBlock Text="能耗优化率"
FontSize="22" FontWeight="Bold"
Foreground="#FFC0D8FF"
HorizontalAlignment="Center"
Margin="0,10,0,0"/>
<Rectangle Width="50" Height="2" Fill="#FFFBBD23"
HorizontalAlignment="Center" Margin="0,10,0,0" Opacity="0.5"/>
</StackPanel>
</StackPanel>
<!-- 底部状态栏 -->
<Border Height="35" VerticalAlignment="Bottom" Background="#FF0F1530">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Offset="0" Color="Transparent"/>
<GradientStop Offset="0.5" Color="#FF4D9FFF"/>
<GradientStop Offset="1" Color="Transparent"/>
</LinearGradientBrush>
</Border.BorderBrush>
<Border.BorderThickness>0,1,0,0</Border.BorderThickness>
<Grid>
<TextBlock x:Name="StatusText"
Text="⚡ 数据实时更新中 | 最后更新: --:--:--"
FontSize="13"
Foreground="#FF6B8CC0"
FontFamily="Consolas"
Margin="40,0,0,0"
VerticalAlignment="Center"/>
<StackPanel Orientation="Horizontal"
HorizontalAlignment="Right"
VerticalAlignment="Center"
Margin="0,0,40,0">
<Rectangle Width="8" Height="8" RadiusX="4" RadiusY="4"
Fill="#FF36D399" Margin="0,0,8,0">
<Rectangle.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard>
<Storyboard RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetProperty="Opacity"
From="0.3" To="1" Duration="0:0:1"
AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>
<TextBlock Text="系统运行正常" Foreground="#FF36D399" FontSize="13"/>
<Rectangle Width="8" Height="8" RadiusX="4" RadiusY="4"
Fill="#FF4D9FFF" Margin="20,0,8,0">
<Rectangle.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard>
<Storyboard RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetProperty="Opacity"
From="0.3" To="1" Duration="0:0:0.8"
AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>
<TextBlock Text="数据同步中" Foreground="#FF4D9FFF" FontSize="13"/>
</StackPanel>
</Grid>
</Border>
</Grid>
</Window>